@shipfox/client-projects 21.0.0 → 22.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +1 -1
- package/CHANGELOG.md +31 -0
- package/dist/components/source-strip.d.ts.map +1 -1
- package/dist/components/source-strip.js +49 -45
- package/dist/components/source-strip.js.map +1 -1
- package/dist/pages/create-project-page.d.ts.map +1 -1
- package/dist/pages/create-project-page.js +161 -175
- package/dist/pages/create-project-page.js.map +1 -1
- package/dist/pages/project-settings-page.d.ts.map +1 -1
- package/dist/pages/project-settings-page.js +82 -84
- package/dist/pages/project-settings-page.js.map +1 -1
- package/dist/pages/projects-hub-page.d.ts.map +1 -1
- package/dist/pages/projects-hub-page.js +160 -159
- package/dist/pages/projects-hub-page.js.map +1 -1
- package/dist/pages/projects-hub-page.stories.d.ts +22 -0
- package/dist/pages/projects-hub-page.stories.d.ts.map +1 -0
- package/dist/pages/projects-hub-page.stories.js +214 -0
- package/dist/pages/projects-hub-page.stories.js.map +1 -0
- package/dist/tsconfig.test.tsbuildinfo +1 -1
- package/package.json +7 -7
- package/src/components/source-strip.tsx +29 -26
- package/src/pages/create-project-page.test.tsx +85 -1
- package/src/pages/create-project-page.tsx +165 -153
- package/src/pages/home-router.test.tsx +2 -1
- package/src/pages/project-settings-page.test.tsx +10 -1
- package/src/pages/project-settings-page.tsx +88 -76
- package/src/pages/projects-hub-page.stories.tsx +203 -0
- package/src/pages/projects-hub-page.test.tsx +90 -10
- package/src/pages/projects-hub-page.tsx +136 -125
- package/tsconfig.build.tsbuildinfo +1 -1
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
$ shipfox-swc
|
|
2
|
-
Successfully compiled:
|
|
2
|
+
Successfully compiled: 28 files with swc (113.44ms)
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,36 @@
|
|
|
1
1
|
# @shipfox/client-projects
|
|
2
2
|
|
|
3
|
+
## 22.0.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [e92517f]
|
|
8
|
+
- @shipfox/client-agent@22.0.1
|
|
9
|
+
- @shipfox/client-integrations@22.0.1
|
|
10
|
+
- @shipfox/client-shell@22.0.1
|
|
11
|
+
- @shipfox/client-auth@22.0.1
|
|
12
|
+
|
|
13
|
+
## 22.0.0
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- 7693eb3: Render empty and load-error states inside bordered panel bodies and keep loading placeholders aligned with their data regions.
|
|
18
|
+
- 00c1cb8: Panels across these surfaces share one hover, focus, and elevation treatment. Grids of openable things, including the integration gallery, the available providers grid, and the harness picker, render as cells inside a single panel divided by hairlines instead of separate bordered tiles.
|
|
19
|
+
- 00c1cb8: Rework the projects index into one Panel with header controls, two-column hairline cells, and preserved loading, empty, error, integration connection, and pagination states.
|
|
20
|
+
- 56f4526: Project settings and project creation now use shared panels, with source integrations presented as button-style radio choices.
|
|
21
|
+
- Updated dependencies [50b3867]
|
|
22
|
+
- Updated dependencies [00c1cb8]
|
|
23
|
+
- Updated dependencies [7693eb3]
|
|
24
|
+
- Updated dependencies [00c1cb8]
|
|
25
|
+
- Updated dependencies [00c1cb8]
|
|
26
|
+
- Updated dependencies [56f4526]
|
|
27
|
+
- @shipfox/client-agent@22.0.0
|
|
28
|
+
- @shipfox/client-auth@22.0.0
|
|
29
|
+
- @shipfox/client-integrations@22.0.0
|
|
30
|
+
- @shipfox/client-shell@22.0.0
|
|
31
|
+
- @shipfox/react-ui@2.1.0
|
|
32
|
+
- @shipfox/client-ui@22.0.0
|
|
33
|
+
|
|
3
34
|
## 21.0.0
|
|
4
35
|
|
|
5
36
|
### Patch Changes
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"source-strip.d.ts","sourceRoot":"","sources":["../../src/components/source-strip.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"source-strip.d.ts","sourceRoot":"","sources":["../../src/components/source-strip.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,qBAAqB,CAAC;AAE/D;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAC1B,YAAY,EACZ,oBAAoB,EACpB,IAAI,EACJ,SAAS,GACV,EAAE;IACD,YAAY,EAAE,MAAM,CAAC;IACrB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,IAAI,EAAE,qBAAqB,GAAG,IAAI,GAAG,SAAS,CAAC;IAC/C,SAAS,EAAE,OAAO,CAAC;CACpB,+BAqCA"}
|
|
@@ -3,6 +3,7 @@ import { useActiveWorkspace } from '@shipfox/client-auth';
|
|
|
3
3
|
import { useSourceConnectionsQuery } from '@shipfox/client-integrations';
|
|
4
4
|
import { StatusBadge } from '@shipfox/react-ui/badge';
|
|
5
5
|
import { Icon } from '@shipfox/react-ui/icon';
|
|
6
|
+
import { Panel } from '@shipfox/react-ui/panel';
|
|
6
7
|
import { Skeleton } from '@shipfox/react-ui/skeleton';
|
|
7
8
|
import { Tooltip, TooltipContent, TooltipTrigger } from '@shipfox/react-ui/tooltip';
|
|
8
9
|
import { Code, Text } from '@shipfox/react-ui/typography';
|
|
@@ -15,55 +16,58 @@ import { Code, Text } from '@shipfox/react-ui/typography';
|
|
|
15
16
|
const workspace = useActiveWorkspace();
|
|
16
17
|
const connectionsQuery = useSourceConnectionsQuery(workspace.id);
|
|
17
18
|
const connection = connectionsQuery.data?.find((c)=>c.id === connectionId);
|
|
18
|
-
return /*#__PURE__*/
|
|
19
|
-
|
|
20
|
-
"
|
|
21
|
-
children:
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
19
|
+
return /*#__PURE__*/ _jsx(Panel, {
|
|
20
|
+
asChild: true,
|
|
21
|
+
className: "gap-inline px-row py-row sm:flex-row sm:items-center sm:justify-between",
|
|
22
|
+
children: /*#__PURE__*/ _jsxs("section", {
|
|
23
|
+
"aria-label": "Project source",
|
|
24
|
+
children: [
|
|
25
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
26
|
+
className: "flex min-w-0 items-center gap-inline",
|
|
27
|
+
children: [
|
|
28
|
+
/*#__PURE__*/ _jsx(Icon, {
|
|
29
|
+
name: providerIconName(connection?.provider),
|
|
30
|
+
className: "size-20 shrink-0"
|
|
31
|
+
}),
|
|
32
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
33
|
+
className: "flex min-w-0 flex-col gap-tight sm:flex-row sm:items-center sm:gap-inline",
|
|
34
|
+
children: [
|
|
35
|
+
connectionsQuery.isPending ? /*#__PURE__*/ _jsx(Skeleton, {
|
|
36
|
+
className: "h-16 w-160"
|
|
37
|
+
}) : /*#__PURE__*/ _jsx(Text, {
|
|
38
|
+
size: "sm",
|
|
39
|
+
bold: true,
|
|
40
|
+
className: "truncate",
|
|
41
|
+
children: connection?.displayName ?? 'Connected source'
|
|
42
|
+
}),
|
|
43
|
+
/*#__PURE__*/ _jsxs(Tooltip, {
|
|
44
|
+
children: [
|
|
45
|
+
/*#__PURE__*/ _jsx(TooltipTrigger, {
|
|
46
|
+
asChild: true,
|
|
47
|
+
children: /*#__PURE__*/ _jsx(Code, {
|
|
48
|
+
variant: "label",
|
|
49
|
+
className: "truncate text-foreground-neutral-muted",
|
|
50
|
+
children: externalRepositoryId
|
|
51
|
+
})
|
|
52
|
+
}),
|
|
53
|
+
/*#__PURE__*/ _jsx(TooltipContent, {
|
|
47
54
|
children: externalRepositoryId
|
|
48
55
|
})
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
+
]
|
|
57
|
+
})
|
|
58
|
+
]
|
|
59
|
+
})
|
|
60
|
+
]
|
|
61
|
+
}),
|
|
62
|
+
/*#__PURE__*/ _jsx("div", {
|
|
63
|
+
className: "shrink-0",
|
|
64
|
+
children: /*#__PURE__*/ _jsx(SyncBadge, {
|
|
65
|
+
sync: sync,
|
|
66
|
+
isPending: isPending
|
|
56
67
|
})
|
|
57
|
-
]
|
|
58
|
-
}),
|
|
59
|
-
/*#__PURE__*/ _jsx("div", {
|
|
60
|
-
className: "shrink-0",
|
|
61
|
-
children: /*#__PURE__*/ _jsx(SyncBadge, {
|
|
62
|
-
sync: sync,
|
|
63
|
-
isPending: isPending
|
|
64
68
|
})
|
|
65
|
-
|
|
66
|
-
|
|
69
|
+
]
|
|
70
|
+
})
|
|
67
71
|
});
|
|
68
72
|
}
|
|
69
73
|
function providerIconName(provider) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/source-strip.tsx"],"sourcesContent":["import {useActiveWorkspace} from '@shipfox/client-auth';\nimport {useSourceConnectionsQuery} from '@shipfox/client-integrations';\nimport {StatusBadge} from '@shipfox/react-ui/badge';\nimport {Icon, type IconName} from '@shipfox/react-ui/icon';\nimport {Skeleton} from '@shipfox/react-ui/skeleton';\nimport {Tooltip, TooltipContent, TooltipTrigger} from '@shipfox/react-ui/tooltip';\nimport {Code, Text} from '@shipfox/react-ui/typography';\nimport type {DefinitionSyncSummary} from '#core/definition.js';\n\n/**\n * We cannot cheaply resolve `external_repository_id` → `owner/repo`\n * (no by-id endpoint; `listRepositories` is paginated by connection).\n * The strip surfaces the raw id as a `<Code>` chip with a tooltip carrying the\n * full string.\n */\nexport function SourceStrip({\n connectionId,\n externalRepositoryId,\n sync,\n isPending,\n}: {\n connectionId: string;\n externalRepositoryId: string;\n sync: DefinitionSyncSummary | null | undefined;\n isPending: boolean;\n}) {\n const workspace = useActiveWorkspace();\n const connectionsQuery = useSourceConnectionsQuery(workspace.id);\n const connection = connectionsQuery.data?.find((c) => c.id === connectionId);\n\n return (\n <
|
|
1
|
+
{"version":3,"sources":["../../src/components/source-strip.tsx"],"sourcesContent":["import {useActiveWorkspace} from '@shipfox/client-auth';\nimport {useSourceConnectionsQuery} from '@shipfox/client-integrations';\nimport {StatusBadge} from '@shipfox/react-ui/badge';\nimport {Icon, type IconName} from '@shipfox/react-ui/icon';\nimport {Panel} from '@shipfox/react-ui/panel';\nimport {Skeleton} from '@shipfox/react-ui/skeleton';\nimport {Tooltip, TooltipContent, TooltipTrigger} from '@shipfox/react-ui/tooltip';\nimport {Code, Text} from '@shipfox/react-ui/typography';\nimport type {DefinitionSyncSummary} from '#core/definition.js';\n\n/**\n * We cannot cheaply resolve `external_repository_id` → `owner/repo`\n * (no by-id endpoint; `listRepositories` is paginated by connection).\n * The strip surfaces the raw id as a `<Code>` chip with a tooltip carrying the\n * full string.\n */\nexport function SourceStrip({\n connectionId,\n externalRepositoryId,\n sync,\n isPending,\n}: {\n connectionId: string;\n externalRepositoryId: string;\n sync: DefinitionSyncSummary | null | undefined;\n isPending: boolean;\n}) {\n const workspace = useActiveWorkspace();\n const connectionsQuery = useSourceConnectionsQuery(workspace.id);\n const connection = connectionsQuery.data?.find((c) => c.id === connectionId);\n\n return (\n <Panel\n asChild\n className=\"gap-inline px-row py-row sm:flex-row sm:items-center sm:justify-between\"\n >\n <section aria-label=\"Project source\">\n <div className=\"flex min-w-0 items-center gap-inline\">\n <Icon name={providerIconName(connection?.provider)} className=\"size-20 shrink-0\" />\n <div className=\"flex min-w-0 flex-col gap-tight sm:flex-row sm:items-center sm:gap-inline\">\n {connectionsQuery.isPending ? (\n <Skeleton className=\"h-16 w-160\" />\n ) : (\n <Text size=\"sm\" bold className=\"truncate\">\n {connection?.displayName ?? 'Connected source'}\n </Text>\n )}\n <Tooltip>\n <TooltipTrigger asChild>\n <Code variant=\"label\" className=\"truncate text-foreground-neutral-muted\">\n {externalRepositoryId}\n </Code>\n </TooltipTrigger>\n <TooltipContent>{externalRepositoryId}</TooltipContent>\n </Tooltip>\n </div>\n </div>\n <div className=\"shrink-0\">\n <SyncBadge sync={sync} isPending={isPending} />\n </div>\n </section>\n </Panel>\n );\n}\n\nfunction providerIconName(provider: string | undefined): IconName {\n if (provider === 'github') return 'github' as IconName;\n return 'componentLine' as IconName;\n}\n\nfunction SyncBadge({\n sync,\n isPending,\n}: {\n sync: DefinitionSyncSummary | null | undefined;\n isPending: boolean;\n}) {\n if (isPending) return <StatusBadge variant=\"neutral\">Loading</StatusBadge>;\n if (sync === undefined) return <StatusBadge variant=\"neutral\">Unavailable</StatusBadge>;\n if (sync === null) return <StatusBadge variant=\"neutral\">No sync</StatusBadge>;\n\n const variantByStatus = {\n pending: 'neutral',\n syncing: 'info',\n succeeded: 'success',\n failed: 'error',\n } as const;\n\n return (\n <StatusBadge variant={variantByStatus[sync.status as keyof typeof variantByStatus]}>\n {sync.status}\n </StatusBadge>\n );\n}\n"],"names":["useActiveWorkspace","useSourceConnectionsQuery","StatusBadge","Icon","Panel","Skeleton","Tooltip","TooltipContent","TooltipTrigger","Code","Text","SourceStrip","connectionId","externalRepositoryId","sync","isPending","workspace","connectionsQuery","id","connection","data","find","c","asChild","className","section","aria-label","div","name","providerIconName","provider","size","bold","displayName","variant","SyncBadge","undefined","variantByStatus","pending","syncing","succeeded","failed","status"],"mappings":";AAAA,SAAQA,kBAAkB,QAAO,uBAAuB;AACxD,SAAQC,yBAAyB,QAAO,+BAA+B;AACvE,SAAQC,WAAW,QAAO,0BAA0B;AACpD,SAAQC,IAAI,QAAsB,yBAAyB;AAC3D,SAAQC,KAAK,QAAO,0BAA0B;AAC9C,SAAQC,QAAQ,QAAO,6BAA6B;AACpD,SAAQC,OAAO,EAAEC,cAAc,EAAEC,cAAc,QAAO,4BAA4B;AAClF,SAAQC,IAAI,EAAEC,IAAI,QAAO,+BAA+B;AAGxD;;;;;CAKC,GACD,OAAO,SAASC,YAAY,EAC1BC,YAAY,EACZC,oBAAoB,EACpBC,IAAI,EACJC,SAAS,EAMV;IACC,MAAMC,YAAYhB;IAClB,MAAMiB,mBAAmBhB,0BAA0Be,UAAUE,EAAE;IAC/D,MAAMC,aAAaF,iBAAiBG,IAAI,EAAEC,KAAK,CAACC,IAAMA,EAAEJ,EAAE,KAAKN;IAE/D,qBACE,KAACR;QACCmB,OAAO;QACPC,WAAU;kBAEV,cAAA,MAACC;YAAQC,cAAW;;8BAClB,MAACC;oBAAIH,WAAU;;sCACb,KAACrB;4BAAKyB,MAAMC,iBAAiBV,YAAYW;4BAAWN,WAAU;;sCAC9D,MAACG;4BAAIH,WAAU;;gCACZP,iBAAiBF,SAAS,iBACzB,KAACV;oCAASmB,WAAU;mDAEpB,KAACd;oCAAKqB,MAAK;oCAAKC,IAAI;oCAACR,WAAU;8CAC5BL,YAAYc,eAAe;;8CAGhC,MAAC3B;;sDACC,KAACE;4CAAee,OAAO;sDACrB,cAAA,KAACd;gDAAKyB,SAAQ;gDAAQV,WAAU;0DAC7BX;;;sDAGL,KAACN;sDAAgBM;;;;;;;;8BAIvB,KAACc;oBAAIH,WAAU;8BACb,cAAA,KAACW;wBAAUrB,MAAMA;wBAAMC,WAAWA;;;;;;AAK5C;AAEA,SAASc,iBAAiBC,QAA4B;IACpD,IAAIA,aAAa,UAAU,OAAO;IAClC,OAAO;AACT;AAEA,SAASK,UAAU,EACjBrB,IAAI,EACJC,SAAS,EAIV;IACC,IAAIA,WAAW,qBAAO,KAACb;QAAYgC,SAAQ;kBAAU;;IACrD,IAAIpB,SAASsB,WAAW,qBAAO,KAAClC;QAAYgC,SAAQ;kBAAU;;IAC9D,IAAIpB,SAAS,MAAM,qBAAO,KAACZ;QAAYgC,SAAQ;kBAAU;;IAEzD,MAAMG,kBAAkB;QACtBC,SAAS;QACTC,SAAS;QACTC,WAAW;QACXC,QAAQ;IACV;IAEA,qBACE,KAACvC;QAAYgC,SAASG,eAAe,CAACvB,KAAK4B,MAAM,CAAiC;kBAC/E5B,KAAK4B,MAAM;;AAGlB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create-project-page.d.ts","sourceRoot":"","sources":["../../src/pages/create-project-page.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"create-project-page.d.ts","sourceRoot":"","sources":["../../src/pages/create-project-page.tsx"],"names":[],"mappings":"AAoCA,wBAAgB,iBAAiB,gCAyXhC"}
|
|
@@ -7,7 +7,9 @@ import { displayNameFieldError, SlugField } from '@shipfox/client-ui';
|
|
|
7
7
|
import { Button } from '@shipfox/react-ui/button';
|
|
8
8
|
import { Callout } from '@shipfox/react-ui/callout';
|
|
9
9
|
import { FormField, FormFieldInput, fieldError } from '@shipfox/react-ui/form-field';
|
|
10
|
+
import { Input } from '@shipfox/react-ui/input';
|
|
10
11
|
import { FullPageLoader } from '@shipfox/react-ui/loader';
|
|
12
|
+
import { Panel, PanelActions, PanelBody, PanelHeader, PanelTitle } from '@shipfox/react-ui/panel';
|
|
11
13
|
import { toast } from '@shipfox/react-ui/toast';
|
|
12
14
|
import { Header, Text } from '@shipfox/react-ui/typography';
|
|
13
15
|
import { useForm } from '@tanstack/react-form';
|
|
@@ -185,20 +187,10 @@ export function CreateProjectPage() {
|
|
|
185
187
|
return /*#__PURE__*/ _jsxs("div", {
|
|
186
188
|
className: "flex w-full flex-col gap-section",
|
|
187
189
|
children: [
|
|
188
|
-
/*#__PURE__*/
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
id: "create-project-title",
|
|
193
|
-
variant: "h1",
|
|
194
|
-
children: "Create project"
|
|
195
|
-
}),
|
|
196
|
-
/*#__PURE__*/ _jsx(Text, {
|
|
197
|
-
size: "sm",
|
|
198
|
-
className: "text-foreground-neutral-muted",
|
|
199
|
-
children: "A Shipfox project starts from a Git repository. Choose the repository Shipfox should track, then give the project a name."
|
|
200
|
-
})
|
|
201
|
-
]
|
|
190
|
+
/*#__PURE__*/ _jsx(Header, {
|
|
191
|
+
id: "create-project-title",
|
|
192
|
+
variant: "h1",
|
|
193
|
+
children: "Create project"
|
|
202
194
|
}),
|
|
203
195
|
/*#__PURE__*/ _jsx(ModelProviderReminderBanner, {
|
|
204
196
|
workspaceId: workspace.id
|
|
@@ -237,184 +229,178 @@ export function CreateProjectPage() {
|
|
|
237
229
|
/*#__PURE__*/ _jsxs("div", {
|
|
238
230
|
className: "flex min-w-0 flex-col gap-region",
|
|
239
231
|
children: [
|
|
240
|
-
/*#__PURE__*/
|
|
241
|
-
className: "flex flex-col gap-group",
|
|
232
|
+
connections.length > 0 ? /*#__PURE__*/ _jsx("section", {
|
|
242
233
|
"aria-label": "Source integration",
|
|
243
|
-
children:
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
/*#__PURE__*/ _jsx(Text, {
|
|
234
|
+
children: /*#__PURE__*/ _jsxs(Panel, {
|
|
235
|
+
children: [
|
|
236
|
+
/*#__PURE__*/ _jsxs(PanelHeader, {
|
|
237
|
+
children: [
|
|
238
|
+
/*#__PURE__*/ _jsx(PanelTitle, {
|
|
239
|
+
children: "Source integration"
|
|
240
|
+
}),
|
|
241
|
+
connections.length === 1 ? /*#__PURE__*/ _jsx(PanelActions, {
|
|
242
|
+
children: /*#__PURE__*/ _jsx(Button, {
|
|
243
|
+
asChild: true,
|
|
244
|
+
variant: "transparent",
|
|
255
245
|
size: "sm",
|
|
256
|
-
className: "
|
|
257
|
-
children:
|
|
246
|
+
className: "shrink-0",
|
|
247
|
+
children: /*#__PURE__*/ _jsx(Link, {
|
|
248
|
+
to: "/w/$workspaceSlug/integrations",
|
|
249
|
+
params: {
|
|
250
|
+
workspaceSlug: workspace.slug
|
|
251
|
+
},
|
|
252
|
+
children: "Add another integration"
|
|
253
|
+
})
|
|
258
254
|
})
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
}) : null
|
|
274
|
-
]
|
|
275
|
-
}),
|
|
276
|
-
connections.length > 0 ? /*#__PURE__*/ _jsx(ConnectionPicker, {
|
|
277
|
-
connections: connections,
|
|
278
|
-
selectedConnectionId: effectiveSelectedConnectionId,
|
|
279
|
-
onSelect: selectConnection
|
|
280
|
-
}) : null
|
|
281
|
-
]
|
|
282
|
-
}),
|
|
283
|
-
showRepoPicker ? /*#__PURE__*/ _jsxs("section", {
|
|
284
|
-
className: "flex flex-col gap-group",
|
|
255
|
+
}) : null
|
|
256
|
+
]
|
|
257
|
+
}),
|
|
258
|
+
/*#__PURE__*/ _jsx(PanelBody, {
|
|
259
|
+
children: /*#__PURE__*/ _jsx(ConnectionPicker, {
|
|
260
|
+
connections: connections,
|
|
261
|
+
selectedConnectionId: effectiveSelectedConnectionId,
|
|
262
|
+
onSelect: selectConnection
|
|
263
|
+
})
|
|
264
|
+
})
|
|
265
|
+
]
|
|
266
|
+
})
|
|
267
|
+
}) : null,
|
|
268
|
+
showRepoPicker ? /*#__PURE__*/ _jsx("section", {
|
|
285
269
|
"aria-label": "Repository",
|
|
286
|
-
children:
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
270
|
+
children: /*#__PURE__*/ _jsxs(Panel, {
|
|
271
|
+
children: [
|
|
272
|
+
/*#__PURE__*/ _jsxs(PanelHeader, {
|
|
273
|
+
className: "flex-wrap",
|
|
274
|
+
children: [
|
|
275
|
+
/*#__PURE__*/ _jsx(PanelTitle, {
|
|
276
|
+
children: "Repository"
|
|
277
|
+
}),
|
|
278
|
+
/*#__PURE__*/ _jsx(PanelActions, {
|
|
279
|
+
className: "min-w-0 max-[640px]:ml-0 max-[640px]:basis-full",
|
|
280
|
+
children: /*#__PURE__*/ _jsx(Input, {
|
|
281
|
+
type: "search",
|
|
282
|
+
placeholder: "Search repositories…",
|
|
283
|
+
"aria-label": "Search repositories",
|
|
284
|
+
value: repoFilter,
|
|
285
|
+
onChange: (event)=>setRepoFilter(event.target.value),
|
|
286
|
+
className: "w-full max-w-[320px]"
|
|
287
|
+
})
|
|
288
|
+
})
|
|
289
|
+
]
|
|
290
|
+
}),
|
|
291
|
+
/*#__PURE__*/ _jsx(PanelBody, {
|
|
292
|
+
children: /*#__PURE__*/ _jsx(RepositoryPicker, {
|
|
293
|
+
repositories: repositories,
|
|
294
|
+
selectedRepositoryId: selectedRepositoryId,
|
|
295
|
+
onSelect: setSelectedRepositoryId,
|
|
296
|
+
isLoading: repositoriesQuery.isPending,
|
|
297
|
+
isFetchingNextPage: repositoriesQuery.isFetchingNextPage,
|
|
298
|
+
hasNextPage: repositoriesQuery.hasNextPage,
|
|
299
|
+
onLoadMore: ()=>repositoriesQuery.fetchNextPage(),
|
|
300
|
+
emptyMessage: filteredEmptyMessage
|
|
298
301
|
})
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
repositories: repositories,
|
|
303
|
-
selectedRepositoryId: selectedRepositoryId,
|
|
304
|
-
onSelect: setSelectedRepositoryId,
|
|
305
|
-
isLoading: repositoriesQuery.isPending,
|
|
306
|
-
isFetchingNextPage: repositoriesQuery.isFetchingNextPage,
|
|
307
|
-
hasNextPage: repositoriesQuery.hasNextPage,
|
|
308
|
-
onLoadMore: ()=>repositoriesQuery.fetchNextPage(),
|
|
309
|
-
emptyMessage: filteredEmptyMessage,
|
|
310
|
-
searchValue: repoFilter,
|
|
311
|
-
onSearchChange: setRepoFilter
|
|
312
|
-
})
|
|
313
|
-
]
|
|
302
|
+
})
|
|
303
|
+
]
|
|
304
|
+
})
|
|
314
305
|
}) : null
|
|
315
306
|
]
|
|
316
307
|
}),
|
|
317
308
|
/*#__PURE__*/ _jsx("aside", {
|
|
318
309
|
className: "lg:sticky lg:top-32",
|
|
319
|
-
children: /*#__PURE__*/ _jsxs(
|
|
320
|
-
className: "flex flex-col gap-group rounded-8 border border-border-neutral-base bg-background-neutral-base p-panel",
|
|
310
|
+
children: /*#__PURE__*/ _jsxs(Panel, {
|
|
321
311
|
children: [
|
|
322
|
-
/*#__PURE__*/
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
/*#__PURE__*/ _jsx(Header, {
|
|
326
|
-
variant: "h3",
|
|
327
|
-
children: "Project details"
|
|
328
|
-
}),
|
|
329
|
-
/*#__PURE__*/ _jsx(Text, {
|
|
330
|
-
size: "sm",
|
|
331
|
-
className: "text-foreground-neutral-muted",
|
|
332
|
-
children: "Confirm the source and create the project."
|
|
333
|
-
})
|
|
334
|
-
]
|
|
335
|
-
}),
|
|
336
|
-
formError ? /*#__PURE__*/ _jsx(Callout, {
|
|
337
|
-
role: "alert",
|
|
338
|
-
type: "error",
|
|
339
|
-
children: /*#__PURE__*/ _jsx("div", {
|
|
340
|
-
ref: errorRef,
|
|
341
|
-
tabIndex: -1,
|
|
342
|
-
children: formError
|
|
312
|
+
/*#__PURE__*/ _jsx(PanelHeader, {
|
|
313
|
+
children: /*#__PURE__*/ _jsx(PanelTitle, {
|
|
314
|
+
children: "Project details"
|
|
343
315
|
})
|
|
344
|
-
}) : null,
|
|
345
|
-
/*#__PURE__*/ _jsx(ProjectSummary, {
|
|
346
|
-
connection: selectedConnection,
|
|
347
|
-
repositoryName: selectedRepository?.fullName
|
|
348
316
|
}),
|
|
349
|
-
/*#__PURE__*/
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
children: /*#__PURE__*/ _jsx(FormFieldInput, {
|
|
360
|
-
name: "name",
|
|
361
|
-
type: "text",
|
|
362
|
-
value: field.state.value,
|
|
363
|
-
onChange: (event)=>{
|
|
364
|
-
const nextName = event.target.value;
|
|
365
|
-
setNameTouched(true);
|
|
366
|
-
field.handleChange(nextName);
|
|
367
|
-
if (!slugManuallyEdited) {
|
|
368
|
-
setSlugCheckEnabled(true);
|
|
369
|
-
setSlugConflict(false);
|
|
370
|
-
form.setFieldValue('slug', slugifyName(nextName, {
|
|
371
|
-
fallback: 'project'
|
|
372
|
-
}));
|
|
373
|
-
}
|
|
374
|
-
},
|
|
375
|
-
onBlur: field.handleBlur,
|
|
376
|
-
placeholder: "Platform"
|
|
317
|
+
/*#__PURE__*/ _jsxs(PanelBody, {
|
|
318
|
+
className: "gap-group p-panel",
|
|
319
|
+
children: [
|
|
320
|
+
formError ? /*#__PURE__*/ _jsx(Callout, {
|
|
321
|
+
role: "alert",
|
|
322
|
+
type: "error",
|
|
323
|
+
children: /*#__PURE__*/ _jsx("div", {
|
|
324
|
+
ref: errorRef,
|
|
325
|
+
tabIndex: -1,
|
|
326
|
+
children: formError
|
|
377
327
|
})
|
|
378
|
-
})
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
328
|
+
}) : null,
|
|
329
|
+
/*#__PURE__*/ _jsx(ProjectSummary, {
|
|
330
|
+
connection: selectedConnection,
|
|
331
|
+
repositoryName: selectedRepository?.fullName
|
|
332
|
+
}),
|
|
333
|
+
/*#__PURE__*/ _jsx(form.Field, {
|
|
334
|
+
name: "name",
|
|
335
|
+
validators: {
|
|
336
|
+
onBlur: ({ value })=>displayNameFieldError(value, 'Project name', createProjectBodySchema.shape.name),
|
|
337
|
+
onSubmit: ({ value })=>displayNameFieldError(value, 'Project name', createProjectBodySchema.shape.name)
|
|
338
|
+
},
|
|
339
|
+
children: (field)=>/*#__PURE__*/ _jsx(FormField, {
|
|
340
|
+
label: "Project name",
|
|
341
|
+
id: "project-name",
|
|
342
|
+
error: fieldError(field),
|
|
343
|
+
children: /*#__PURE__*/ _jsx(FormFieldInput, {
|
|
344
|
+
name: "name",
|
|
345
|
+
type: "text",
|
|
346
|
+
value: field.state.value,
|
|
347
|
+
onChange: (event)=>{
|
|
348
|
+
const nextName = event.target.value;
|
|
349
|
+
setNameTouched(true);
|
|
350
|
+
field.handleChange(nextName);
|
|
351
|
+
if (!slugManuallyEdited) {
|
|
352
|
+
setSlugCheckEnabled(true);
|
|
353
|
+
setSlugConflict(false);
|
|
354
|
+
form.setFieldValue('slug', slugifyName(nextName, {
|
|
355
|
+
fallback: 'project'
|
|
356
|
+
}));
|
|
357
|
+
}
|
|
358
|
+
},
|
|
359
|
+
onBlur: field.handleBlur,
|
|
360
|
+
placeholder: "Platform"
|
|
361
|
+
})
|
|
362
|
+
})
|
|
363
|
+
}),
|
|
364
|
+
/*#__PURE__*/ _jsx(form.Field, {
|
|
389
365
|
name: "slug",
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
setSlugCheckEnabled(true);
|
|
394
|
-
setSlugConflict(false);
|
|
395
|
-
field.handleChange(value);
|
|
366
|
+
validators: {
|
|
367
|
+
onBlur: createProjectBodySchema.shape.slug,
|
|
368
|
+
onSubmit: createProjectBodySchema.shape.slug
|
|
396
369
|
},
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
370
|
+
children: (field)=>/*#__PURE__*/ _jsx(SlugField, {
|
|
371
|
+
id: "project-slug",
|
|
372
|
+
label: "Project slug",
|
|
373
|
+
name: "slug",
|
|
374
|
+
value: field.state.value,
|
|
375
|
+
onChange: (value)=>{
|
|
376
|
+
setSlugManuallyEdited(true);
|
|
377
|
+
setSlugCheckEnabled(true);
|
|
378
|
+
setSlugConflict(false);
|
|
379
|
+
field.handleChange(value);
|
|
380
|
+
},
|
|
381
|
+
onBlur: field.handleBlur,
|
|
382
|
+
error: slugConflict ? 'This project slug is already in use.' : fieldError(field),
|
|
383
|
+
description: /*#__PURE__*/ _jsx("span", {
|
|
384
|
+
className: "font-code",
|
|
385
|
+
children: `/w/${workspace.slug}/p/${field.state.value}`
|
|
386
|
+
}),
|
|
387
|
+
placeholder: "platform",
|
|
388
|
+
className: "font-code",
|
|
389
|
+
checkEnabled: slugCheckEnabled,
|
|
390
|
+
debounceMs: 0,
|
|
391
|
+
isValid: isSlugValid,
|
|
392
|
+
checkAvailability: checkProjectSlugAvailability
|
|
393
|
+
})
|
|
394
|
+
}),
|
|
395
|
+
/*#__PURE__*/ _jsx(Button, {
|
|
396
|
+
type: "submit",
|
|
397
|
+
iconRight: "chevronRight",
|
|
398
|
+
isLoading: createProject.isPending,
|
|
399
|
+
disabled: !selectedConnection || !selectedRepository,
|
|
400
|
+
className: "w-full",
|
|
401
|
+
children: "Create project"
|
|
409
402
|
})
|
|
410
|
-
|
|
411
|
-
/*#__PURE__*/ _jsx(Button, {
|
|
412
|
-
type: "submit",
|
|
413
|
-
iconRight: "chevronRight",
|
|
414
|
-
isLoading: createProject.isPending,
|
|
415
|
-
disabled: !selectedConnection || !selectedRepository,
|
|
416
|
-
className: "w-full",
|
|
417
|
-
children: "Create project"
|
|
403
|
+
]
|
|
418
404
|
})
|
|
419
405
|
]
|
|
420
406
|
})
|