{shortSha(props.app.commit)}
- {props.app.websites[0]?.fqdn || ''}
- {props.state}
- {num()}
- {formatBytes(+props.artifact.size.toString())}
-
-
- Database
-
-
- props.setRuntimeConfig('useMariadb', useMariadb)}
- >
- MariaDB
-
- props.setRuntimeConfig('useMongodb', useMongodb)}
- >
- MongoDB
-
-
-
-
-
- Entrypoint
-
- props.setRuntimeConfig('entrypoint', e.target.value)}
- />
-
-
-
- Command
-
- props.setRuntimeConfig('command', e.target.value)}
- />
-
-
- )
-}
-
-interface StaticConfigProps {
- // case, valueのunionを直接使っている都合上、runtimeからstaticに切り替えたときにstaticConfigフィールドが存在しない
- staticConfig: PlainMessage
-
- Artifact path
-
- props.setStaticConfig('artifactPath', e.target.value)}
- />
-
-
-
- SPA
-
-
- props.setStaticConfig('spa', selected)}
- >
- SPA (Single Page Application)
-
-
-
-
- )
-}
-
-export interface BuildConfigsProps {
- buildConfig: PlainMessage
-
- Type
-
-
-
-
-
- Context
-
- props.setBuildConfig('value', { context: e.target.value })}
- />
-
-
-
- Base image
-
- props.setBuildConfig('value', { baseImage: e.target.value })}
- />
-
-
-
- Build command
-
- props.setBuildConfig('value', { buildCmd: e.target.value })}
- />
-
-
-
- Dockerfile name
-
- props.setBuildConfig('value', { dockerfileName: e.target.value })}
- />
-
-
-
- Context
-
- props.setBuildConfig('value', { context: e.target.value })}
- />
-
-
-
- Context
-
- props.setBuildConfig('value', { context: e.target.value })}
- />
-
-
-
- Base image
-
- props.setBuildConfig('value', { baseImage: e.target.value })}
- />
-
-
-
- Build command
-
- props.setBuildConfig('value', { buildCmd: e.target.value })}
- />
-
-
- Dockerfile name
- props.setBuildConfig('value', { dockerfileName: e.target.value })}
- />
-
-
- Context
- props.setBuildConfig('value', { context: e.target.value })}
- />
-
- {shortSha(b.commit)}
- -
-
- {line} }
-
-
- {line} }
-
-
-
- )
-}
diff --git a/dashboard/src/components/Input.tsx b/dashboard/src/components/Input.tsx
deleted file mode 100644
index 8297a6c90..000000000
--- a/dashboard/src/components/Input.tsx
+++ /dev/null
@@ -1,111 +0,0 @@
-import { vars } from '/@/theme'
-import { ComplexStyleRule } from '@macaron-css/core'
-import { styled } from '@macaron-css/solid'
-import { Component, JSX, splitProps } from 'solid-js'
-import { tippy as tippyDir } from 'solid-tippy'
-
-// https://github.com/solidjs/solid/discussions/845
-const tippy = tippyDir
-
-export const InputLabel = styled('div', {
- base: {
- display: 'flex',
- alignItems: 'center',
- gap: '4px',
-
- fontSize: '16px',
- fontWeight: 700,
- color: vars.text.black1,
-
- marginBottom: '4px',
- },
-})
-
-const inputStyle: ComplexStyleRule = {
- padding: '8px 12px',
- borderRadius: '4px',
- border: `1px solid ${vars.bg.white4}`,
- fontSize: '14px',
-
- width: '100%',
-
- display: 'flex',
- flexDirection: 'column',
-
- '::placeholder': {
- color: vars.text.black3,
- },
-}
-
-const StyledInput = styled('input', {
- base: {
- ...inputStyle,
- },
- variants: {
- width: {
- full: {
- width: '100%',
- },
- middle: {
- width: '320px',
- },
- short: {
- width: '160px',
- },
- tiny: {
- width: '80px',
- },
- },
- },
- defaultVariants: {
- width: 'full',
- },
-})
-
-interface InputBarProps extends JSX.InputHTMLAttributes setFocused(true)} use:clickOutside={() => setFocused(false)}>
- {props.children(() => setFocused(true))}
-
-
-
-
- {(b) => props.onSetSuggestion(b)}>{b} }
-
-
-
-
-
- )
-}
diff --git a/dashboard/src/components/Modal.tsx b/dashboard/src/components/Modal.tsx
deleted file mode 100644
index ba02b24c2..000000000
--- a/dashboard/src/components/Modal.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { vars } from '/@/theme'
-import { styled } from '@macaron-css/solid'
-
-export const ModalContainer = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'column',
- gap: '24px',
- },
-})
-
-export const ModalButtonsContainer = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'row',
- gap: '16px',
- justifyContent: 'center',
- },
-})
-
-export const ModalText = styled('div', {
- base: {
- fontSize: '16px',
- fontWeight: 'bold',
- color: vars.text.black1,
- textAlign: 'center',
- },
-})
diff --git a/dashboard/src/components/Nav.tsx b/dashboard/src/components/Nav.tsx
deleted file mode 100644
index c48c298d9..000000000
--- a/dashboard/src/components/Nav.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import { style } from '@macaron-css/core'
-import { styled } from '@macaron-css/solid'
-import { vars } from '../theme'
-
-export const NavContainer = styled('div', {
- base: {
- marginTop: '48px',
- marginBottom: '24px',
- },
-})
-
-export const NavTitleContainer = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'row',
- gap: '14px',
- alignContent: 'center',
-
- fontSize: '32px',
- fontWeight: 'bold',
- color: vars.text.black1,
- },
-})
-
-export const NavTitle = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'row',
- gap: '8px',
- },
-})
-
-export const NavButtonsContainer = styled('nav', {
- base: {
- marginTop: '20px',
- display: 'flex',
- flexDirection: 'row',
- gap: '20px',
- },
-})
-
-export const NavAnchorStyle = style({
- fontSize: '24px',
- fontWeight: 'medium',
- color: vars.text.black3,
- textDecoration: 'none',
- padding: '4px 12px',
- selectors: {
- '&:hover': {
- color: vars.text.black2,
- },
- },
-})
-
-export const NavAnchorActiveStyle = style({
- color: vars.text.black1,
- borderBottom: `2px solid ${vars.text.black1}`,
-})
diff --git a/dashboard/src/components/PortPublications.tsx b/dashboard/src/components/PortPublications.tsx
deleted file mode 100644
index a37effa73..000000000
--- a/dashboard/src/components/PortPublications.tsx
+++ /dev/null
@@ -1,162 +0,0 @@
-import { PortPublication, PortPublicationProtocol } from '/@/api/neoshowcase/protobuf/gateway_pb'
-import { FormButton, FormSettings, FormSettingsButton, SettingsContainer } from '/@/components/AppsNew'
-import { Button } from '/@/components/Button'
-import { InputBar, InputLabel } from '/@/components/Input'
-import { Radio, RadioItem } from '/@/components/Radio'
-import { Select, SelectItem } from '/@/components/Select'
-import { pickRandom, randIntN } from '/@/libs/random'
-import { PlainMessage } from '@bufbuild/protobuf'
-import { styled } from '@macaron-css/solid'
-import { AiOutlinePlusCircle } from 'solid-icons/ai'
-import { FaRegularTrashCan } from 'solid-icons/fa'
-import { For } from 'solid-js'
-import { SetStoreFunction } from 'solid-js/store'
-import { systemInfo } from '../libs/api'
-import { portPublicationProtocolMap } from '../libs/application'
-import { vars } from '../theme'
-
-const AvailablePortContainer = styled('div', {
- base: {
- fontSize: '14px',
- color: vars.text.black2,
- padding: '8px',
- },
-})
-
-const AvailableDomainUl = styled('ul', {
- base: {
- margin: '8px 0',
- },
-})
-
-const PortVisualContainer = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'row',
- alignItems: 'center',
- gap: '2px',
- },
-})
-
-const protocolItems: SelectItem
- 認証方法
- props.setAuthConfig('auth', 'case', v)}
- />
-
-
- {(v) => (
- <>
- ユーザー名
-
- props.setAuthConfig('auth', 'value', {
- username: e.currentTarget.value,
- })
- }
- />
- パスワード
-
- props.setAuthConfig('auth', 'value', {
- password: e.currentTarget.value,
- })
- }
- />
-
- )}
-
-
-
- 以下のSSH公開鍵{!useTmpKey() && ' (システム共通) '}
- をリポジトリに登録してください。
-
-
- {publicKey()}
-
-
-
-
-
-
-
-
-
-
-
- )
-}
diff --git a/dashboard/src/components/RepositoryInfo.tsx b/dashboard/src/components/RepositoryInfo.tsx
deleted file mode 100644
index 01606b552..000000000
--- a/dashboard/src/components/RepositoryInfo.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import { Repository } from '/@/api/neoshowcase/protobuf/gateway_pb'
-import { providerToIcon, repositoryURLToProvider } from '/@/libs/application'
-import { vars } from '/@/theme'
-import { styled } from '@macaron-css/solid'
-import { JSXElement } from 'solid-js'
-
-const RepositoryInfoContainer = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'row',
- alignItems: 'center',
- gap: '10px',
- },
-})
-
-const RepoName = styled('div', {
- base: {
- fontSize: '16px',
- fontWeight: 500,
- color: vars.text.black1,
- },
-})
-
-const RepositoryInfoBackground = styled('div', {
- base: {
- display: 'flex',
-
- background: vars.bg.white3,
- border: `1px solid ${vars.bg.white4}`,
- borderRadius: '4px',
- padding: '8px 12px',
- },
-})
-
-const SmallText = styled('div', {
- base: {
- display: 'flex',
- fontSize: '11px',
- color: vars.text.black3,
- },
-})
-
-export interface RepositoryInfoProps {
- repo: Repository
-}
-
-export const RepositoryInfo = (props: RepositoryInfoProps): JSXElement => {
- const provider = repositoryURLToProvider(props.repo.url)
- return (
-
-
-
-
- {providerToIcon(provider)}
- {props.repo.name}
-
- {props.apps.length} {props.apps.length === 1 ? 'app' : 'apps'}
-
-
-
-
-
-
-
-
- {(app) =>
-
- )
-}
diff --git a/dashboard/src/components/Select.tsx b/dashboard/src/components/Select.tsx
deleted file mode 100644
index 47305b655..000000000
--- a/dashboard/src/components/Select.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import { vars } from '/@/theme'
-import { styled } from '@macaron-css/solid'
-import { For } from 'solid-js'
-
-const StyledSelect = styled('select', {
- base: {
- display: 'flex',
- flexDirection: 'column',
- gap: '2px',
-
- padding: '8px 12px',
- borderRadius: '4px',
- border: `1px solid ${vars.bg.white4}`,
- fontSize: '14px',
- marginLeft: '4px',
-
- selectors: {
- '&:focus': {
- border: `1px solid ${vars.bg.black1}`,
- },
- },
- },
-})
-
-export interface SelectItemNew App
-
- URL
-
-
-
- _ が含まれるホスト名は非推奨です
-
-
-
-
- 部員認証
-
-
-
- Advanced
-
- props.setWebsite('stripPrefix', selected)}
- >
- Strip Path Prefix
-
-
- props.setWebsite('h2c', selected)}>
- h2c
-
-
-
-
-
+
+
+ *
+
+
+
+
+ {props.helpText}
+
+
+ {props.children}
+
+ )
+}
diff --git a/dashboard/src/components/templates/Header.tsx b/dashboard/src/components/templates/Header.tsx
new file mode 100644
index 000000000..ad3661294
--- /dev/null
+++ b/dashboard/src/components/templates/Header.tsx
@@ -0,0 +1,98 @@
+import { styled } from '@macaron-css/solid'
+import { A } from '@solidjs/router'
+import { Component, Show } from 'solid-js'
+import LogoImage from '/@/assets/logo.svg?url'
+import SmallLogoImage from '/@/assets/logo_small.svg?url'
+import { systemInfo, user } from '/@/libs/api'
+import { colorVars, media } from '/@/theme'
+import { Button } from '../UI/Button'
+import { MaterialSymbols } from '../UI/MaterialSymbols'
+import { UserMenuButton } from '../UI/UserMenuButton'
+import MobileNavigation from './MobileNavigation'
+
+const Container = styled('div', {
+ base: {
+ width: '100%',
+ height: '64px',
+ padding: '10px 24px',
+ flexShrink: 0,
+ display: 'flex',
+ alignItems: 'center',
+ justifyContent: 'flex-start',
+ gap: '12px',
+ borderBottom: `1px solid ${colorVars.semantic.ui.border}`,
+ },
+})
+const NavigationContainer = styled('div', {
+ base: {
+ display: 'flex',
+ alignItems: 'center',
+ gap: '8px',
+
+ '@media': {
+ [media.mobile]: {
+ display: 'none',
+ },
+ },
+ },
+})
+const MobileNavigationContainer = styled('div', {
+ base: {
+ display: 'none',
+
+ '@media': {
+ [media.mobile]: {
+ display: 'flex',
+ alignItems: 'center',
+ },
+ },
+ },
+})
+const UserMenuButtonContainer = styled('div', {
+ base: {
+ marginLeft: 'auto',
+ },
+})
+
+export const Header: Component = () => {
+ return (
+ {props.title}
+ Gitブランチ名またはRef
+ 入力欄をクリックして候補を表示
+
+ ),
+ },
+ }}
+ {...fieldProps}
+ options={branches().map((branch) => ({
+ label: branch,
+ value: branch,
+ }))}
+ value={field.value}
+ error={field.error}
+ setValue={(v) => {
+ setValue(props.formStore, 'refName', v)
+ }}
+ readOnly={!props.hasPermission}
+ />
+ )}
+
-
+ データーベースを使用する場合はチェック
+
+ ),
+ },
+ }}
+ >
+ 静的ファイルが生成されるディレクトリ
+ (Contextからの相対パス)
+
+ ),
+ },
+ }}
+ {...fieldProps}
+ value={field.value ?? ''}
+ error={field.error}
+ readOnly={!props.hasPermission}
+ />
+ )}
+ 配信するファイルがSPAである
+ (いい感じのフォールバック設定が付きます)
+
+ ),
+ },
+ }}
+ {...fieldProps}
+ options={[
+ { value: 'true', label: 'Yes' },
+ { value: 'false', label: 'No' },
+ ]}
+ value={field.value ? 'true' : 'false'}
+ setValue={(v) => setValue(props.formStore, field.name, v === 'true')}
+ readOnly={!props.hasPermission}
+ />
+ )}
+ ビルド対象ディレクトリ
+ (リポジトリルートからの相対パス)
+
+ ),
+ },
+ }}
+ {...fieldProps}
+ value={field.value ?? ''}
+ error={field.error}
+ readOnly={!props.hasPermission}
+ />
+ )}
+ ベースとなるDocker Image
+ 「イメージ名:タグ名」の形式
+ ビルドが必要無い場合は空
+
+ ),
+ },
+ }}
+ {...fieldProps}
+ value={field.value ?? ''}
+ error={field.error}
+ readOnly={!props.hasPermission}
+ />
+ )}
+ イメージ上でビルド時に実行するコマンド
+ リポジトリルートで実行されます
+
+ ),
+ },
+ }}
+ {...fieldProps}
+ multiline
+ value={field.value ?? ''}
+ error={field.error}
+ readOnly={!props.hasPermission}
+ />
+ )}
+ ビルドContext
+ (リポジトリルートからの相対パス)
+
+ ),
+ },
+ }}
+ value={field.value ?? ''}
+ error={field.error}
+ readOnly={!props.hasPermission}
+ {...fieldProps}
+ />
+ )}
+ Dockerfileへのパス
+ (Contextからの相対パス)
+
+ ),
+ },
+ }}
+ value={field.value ?? ''}
+ error={field.error}
+ readOnly={!props.hasPermission}
+ {...fieldProps}
+ />
+ )}
+ + 公開リポジトリの場合は、この操作は不要です。 +
このリポジトリ専用のSSH用鍵ペアを生成します。
+
+ NeoShowcase全体で共通の公開鍵が、リポジトリに登録できない場合に生成してください。
+
+ GitHubプライベートリポジトリの場合は必ず生成が必要です。
+
+ ),
+ }}
+ style="left"
+ />
+
- {human()} {suffix()}
-
- )
+export const diffHuman = (target: Date) => {
+ const diff = new Date().getTime() - target.getTime()
+ const suffix = diff > 0 ? 'ago' : 'from now'
+ const human = durationHuman(Math.abs(diff))
+ const localeString = target.toLocaleString()
+ return {
+ diff: `${human} ${suffix}`,
+ localeString,
+ }
}
diff --git a/dashboard/src/libs/layout.tsx b/dashboard/src/libs/layout.tsx
deleted file mode 100644
index a4879d4f9..000000000
--- a/dashboard/src/libs/layout.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import { vars } from '/@/theme'
-import { styled } from '@macaron-css/solid'
-
-export const Container = styled('div', {
- base: {
- padding: '40px 72px',
- },
-})
-
-export const PageTitle = styled('div', {
- base: {
- marginTop: '48px',
- fontSize: '32px',
- fontWeight: 'bold',
- color: vars.text.black1,
- },
-})
-
-export const CenterInline = styled('div', {
- base: {
- display: 'flex',
- flexDirection: 'column',
- justifyContent: 'center',
- },
-})
diff --git a/dashboard/src/libs/useAllUsers.tsx b/dashboard/src/libs/useAllUsers.tsx
index ce20eb373..1246023c8 100644
--- a/dashboard/src/libs/useAllUsers.tsx
+++ b/dashboard/src/libs/useAllUsers.tsx
@@ -1,6 +1,6 @@
+import { createMemo, createResource, createRoot } from 'solid-js'
import { User } from '/@/api/neoshowcase/protobuf/gateway_pb'
import { client } from '/@/libs/api'
-import { createMemo, createResource, createRoot } from 'solid-js'
const [users, { mutate: mutateUsers, refetch: refetchUsers }] = createResource(async () => {
const getUsersRes = await client.getUsers({})
@@ -14,9 +14,13 @@ export { users, mutateUsers, refetchUsers }
// see: https://www.solidjs.com/docs/latest#createroot
const usersMap = createRoot(() =>
createMemo(() => {
- if (!users()) return new Map
+
+ )
+}
+
+export default () => {
+ const [scope, _setScope] = createLocalSignal('apps-scope', GetRepositoriesRequest_Scope.MINE)
+ const [isPending, start] = useTransition()
+
+ const setScope = (scope: GetRepositoriesRequest_Scope) => {
+ start(() => {
+ _setScope(scope)
+ })
+ }
+
+ const [statuses, setStatuses] = createLocalSignal(
+ 'apps-statuses',
+ allStatuses.map((s) => s.value),
+ )
+ const [provider, setProvider] = createLocalSignal
+
+
+ search
+ No Apps Found
+
+
+ }
+ >
+ {(vRow) => (
+
+
+
+
+ )}
+
+
+ 本当に削除しますか?
- データベースを利用している場合、中身のデータも削除されます
- {shortSha(app().commit)}
- {shortSha(app().currentBuild)}
-
-
-
- {(envVar) => {
- return
-
-
-
-
- key
- value
-
-
-
- General
- Build
- Website
-
- Port Forwarding
-
- Owner
- Environment Variable
-
-
-
- Key
+ Value
+ + 使用可能なポート： +
- Application Name
- setRequest('name', e.target.value)}
- required
- />
-
-
-
-
- Branch Name
-
- setRequest('refName', b)}>
- {(onFocus) => (
- setRequest('refName', e.target.value)}
- onFocus={onFocus}
- required
+ return (
+
+ Create Application - NeoShowcase
+
+
+
+
+
+
+
+
+ {(step) => (
+ step.step ? 'complete' : 'incomplete'
+ }
/>
)}
-
-
-
-
- Build Setting
-
-
-
-
- Website Setting
-
-
-
-
-
- Port Forwarding
-
-
-
-
- Start Immediately
-
+
+
+
+ mutateRepo(repo)} />
+
+
+
+ {(nonNullRepo) => (
+
+
+
+
-
- setRequest('startOnCreate', selected)}
- >
- 今すぐ起動する
-
-
-
-
-
-
- {(app) =>
-
-
-
-
- General
- Owner
-
-
-
-