Skip to content

Commit cffc087

Browse files
committed
ui update for image discovery
1 parent 4ef412a commit cffc087

7 files changed

Lines changed: 71 additions & 49 deletions

File tree

gql-queries-generator/doc/queries.graphql

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4496,6 +4496,7 @@ query consoleGetRegistryImageUrl {
44964496
url
44974497
urlExample
44984498
scriptUrlExample
4499+
klWebhookAuthToken
44994500
}
45004501
}
45014502

src/apps/console/routes/_main+/$account+/infra+/vpn-devices/route.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ const Devices = () => {
108108
onClick={() => {
109109
setVisible(true);
110110
}}
111-
// LinkComponent={Link}
111+
// LinkComponent={Link}
112112
/>
113113
),
114114
}}

src/apps/console/routes/_main+/$account+/infra+/vpn-devices/vpn-resources-v2.tsx

Lines changed: 11 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
1-
import { Eye, Trash } from '~/console/components/icons';
21
import { Link, useOutletContext, useParams } from '@remix-run/react';
2+
import { useState } from 'react';
3+
import { Button } from '~/components/atoms/button';
4+
import { toast } from '~/components/molecule/toast';
35
import { generateKey, titleCase } from '~/components/utils';
6+
import { CopyContentToClipboard } from '~/console/components/common-console-components';
47
import { CopyButton, listRender } from '~/console/components/commons';
58
import ConsoleAvatar from '~/console/components/console-avatar';
69
import {
@@ -10,28 +13,25 @@ import {
1013
ListTitleV2,
1114
listClass,
1215
} from '~/console/components/console-list-components';
16+
import DeleteDialog from '~/console/components/delete-dialog';
1317
import Grid from '~/console/components/grid';
18+
import { Eye, Trash } from '~/console/components/icons';
1419
import ListGridView from '~/console/components/list-grid-view';
20+
import ListV2 from '~/console/components/listV2';
1521
import ResourceExtraAction from '~/console/components/resource-extra-action';
22+
import { ShowWireguardConfig } from '~/console/page-components/handle-console-devices';
23+
import { IAccountContext } from '~/console/routes/_main+/$account+/_layout';
24+
import { useConsoleApi } from '~/console/server/gql/api-provider';
25+
import { IGlobalVpnDevices } from '~/console/server/gql/queries/global-vpn-queries';
1626
import {
1727
ExtractNodeType,
1828
parseName,
1929
parseUpdateOrCreatedBy,
2030
parseUpdateOrCreatedOn,
2131
} from '~/console/server/r-utils/common';
22-
import { IAccountContext } from '~/console/routes/_main+/$account+/_layout';
2332
import { useWatchReload } from '~/lib/client/helpers/socket/useWatch';
24-
import ListV2 from '~/console/components/listV2';
25-
import { IGlobalVpnDevices } from '~/console/server/gql/queries/global-vpn-queries';
26-
import { useState } from 'react';
27-
import { Button } from '~/components/atoms/button';
28-
import { useConsoleApi } from '~/console/server/gql/api-provider';
2933
import { useReload } from '~/root/lib/client/helpers/reloader';
30-
import DeleteDialog from '~/console/components/delete-dialog';
31-
import { toast } from '~/components/molecule/toast';
3234
import { handleError } from '~/root/lib/utils/common';
33-
import { CopyContentToClipboard } from '~/console/components/common-console-components';
34-
import { ShowWireguardConfig } from '~/console/page-components/handle-console-devices';
3535

3636
type BaseType = ExtractNodeType<IGlobalVpnDevices>;
3737
const RESOURCE_NAME = 'global-vpn';
@@ -223,21 +223,6 @@ const ListView = ({ items = [], onDelete, showWgConfig }: IResource) => {
223223
<DeviceHostView hostName={`${parseName(i)}.device.local`} />
224224
</div>
225225
),
226-
// render: () => (
227-
// <ListItem
228-
// noTooltip
229-
// data={
230-
// <CopyButton
231-
// title={
232-
// <span className="text-sm">
233-
// {parseName(i)}.device.local
234-
// </span>
235-
// }
236-
// value={`${parseName(i)}.device.local`}
237-
// />
238-
// }
239-
// />
240-
// ),
241226
},
242227
ip: {
243228
render: () => (

src/apps/console/routes/_main+/$account+/settings+/images/handle-image-discovery.tsx

Lines changed: 45 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import { useParams } from '@remix-run/react';
22
import { useState } from 'react';
33
import { Button } from '~/components/atoms/button';
4+
import { Chip } from '~/components/atoms/chips';
45
import Banner from '~/components/molecule/banner';
56
import Popup from '~/components/molecule/popup';
67
import CodeView from '~/console/components/code-view';
8+
import { CopyContentToClipboard } from '~/console/components/common-console-components';
79
import ExtendedFilledTab from '~/console/components/extended-filled-tab';
810
import { LoadingPlaceHolder } from '~/console/components/loading';
911
import { useConsoleApi } from '~/console/server/gql/api-provider';
@@ -39,7 +41,7 @@ export const RegistryImageInstruction = ({
3941
<Popup.Content>
4042
<form className="flex flex-col gap-2xl">
4143
{error && (
42-
<span className="bodyMd-medium text-text-strong">
44+
<span className="flex justify-center items-center bodyMd-medium text-text-strong">
4345
Error while fetching instructions
4446
</span>
4547
)}
@@ -48,6 +50,20 @@ export const RegistryImageInstruction = ({
4850
) : (
4951
data && (
5052
<div className="flex flex-col gap-xl">
53+
<div className="flex flex-row gap-lg">
54+
<span className="bodySm-semibold text-sm py-md">
55+
Copy your Webhook Token:
56+
</span>
57+
<Chip
58+
item={{ name: 'web token' }}
59+
label={
60+
<CopyContentToClipboard
61+
content={data.klWebhookAuthToken}
62+
toastMessage="Webhook token copied successfully."
63+
/>
64+
}
65+
/>
66+
</div>
5167
<ExtendedFilledTab
5268
value={active}
5369
onChange={setActive}
@@ -60,10 +76,11 @@ export const RegistryImageInstruction = ({
6076
{ label: 'cURL Command', to: 'url', value: 'url' },
6177
]}
6278
/>
63-
{active === 'url' && (
79+
80+
{active === 'script-url' && (
6481
<div className="flex flex-col gap-3xl">
65-
{data.url &&
66-
data.url.map((u) => (
82+
{data.scriptUrl &&
83+
data.scriptUrl.map((u) => (
6784
<CodeView
6885
key={u}
6986
preClassName="!overflow-none text-wrap break-words"
@@ -77,18 +94,27 @@ export const RegistryImageInstruction = ({
7794
body={
7895
<div className="flex flex-col gap-md">
7996
<span className="bodyMd-medium">
80-
Webhook Image Metadata Push Example:
97+
Shell Script Example with Image and Meta
98+
Information:
8199
</span>
82-
<span className="bodyMd">{data.urlExample}</span>
100+
{data.scriptUrlExample &&
101+
data.scriptUrlExample.map((d) => (
102+
<span
103+
className="font-mono text-text-default"
104+
key={d}
105+
>
106+
{d}
107+
</span>
108+
))}
83109
</div>
84110
}
85111
/>
86112
</div>
87113
)}
88-
{active === 'script-url' && (
114+
{active === 'url' && (
89115
<div className="flex flex-col gap-3xl">
90-
{data.scriptUrl &&
91-
data.scriptUrl.map((u) => (
116+
{data.url &&
117+
data.url.map((u) => (
92118
<CodeView
93119
key={u}
94120
preClassName="!overflow-none text-wrap break-words"
@@ -102,12 +128,17 @@ export const RegistryImageInstruction = ({
102128
body={
103129
<div className="flex flex-col gap-md">
104130
<span className="bodyMd-medium">
105-
Shell Script Example with Image and Meta
106-
Information:
107-
</span>
108-
<span className="bodyMd">
109-
{data.scriptUrlExample}
131+
Webhook Image Metadata Push Example:
110132
</span>
133+
{data.urlExample &&
134+
data.urlExample.map((d) => (
135+
<span
136+
className="font-mono text-text-default"
137+
key={d}
138+
>
139+
{d}
140+
</span>
141+
))}
111142
</div>
112143
}
113144
/>

src/apps/console/server/gql/queries/registry-image-queries.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ export const registryImagesQueries = (executor: IExecutor) => ({
6464
url
6565
urlExample
6666
scriptUrlExample
67+
klWebhookAuthToken
6768
}
6869
}
6970
`,

src/generated/gql/sdl.graphql

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3886,17 +3886,19 @@ type RegistryImagePaginatedRecords {
38863886
}
38873887

38883888
type RegistryImageURL {
3889+
klWebhookAuthToken: String!
38893890
scriptUrl: [String!]!
3890-
scriptUrlExample: String!
3891+
scriptUrlExample: [String!]!
38913892
url: [String!]!
3892-
urlExample: String!
3893+
urlExample: [String!]!
38933894
}
38943895

38953896
input RegistryImageURLIn {
3897+
klWebhookAuthToken: String!
38963898
scriptUrl: [String!]!
3897-
scriptUrlExample: String!
3899+
scriptUrlExample: [String!]!
38983900
url: [String!]!
3899-
urlExample: String!
3901+
urlExample: [String!]!
39003902
}
39013903

39023904
type RemoteLogin {

src/generated/gql/server.ts

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1701,10 +1701,11 @@ export type RegistryImageIn = {
17011701
};
17021702

17031703
export type RegistryImageUrlIn = {
1704+
klWebhookAuthToken: Scalars['String']['input'];
17041705
scriptUrl: Array<Scalars['String']['input']>;
1705-
scriptUrlExample: Scalars['String']['input'];
1706+
scriptUrlExample: Array<Scalars['String']['input']>;
17061707
url: Array<Scalars['String']['input']>;
1707-
urlExample: Scalars['String']['input'];
1708+
urlExample: Array<Scalars['String']['input']>;
17081709
};
17091710

17101711
export type SearchProjectManagedService = {
@@ -6074,8 +6075,9 @@ export type ConsoleGetRegistryImageUrlQuery = {
60746075
core_getRegistryImageURL: {
60756076
scriptUrl: Array<string>;
60766077
url: Array<string>;
6077-
urlExample: string;
6078-
scriptUrlExample: string;
6078+
urlExample: Array<string>;
6079+
scriptUrlExample: Array<string>;
6080+
klWebhookAuthToken: string;
60796081
};
60806082
};
60816083

0 commit comments

Comments
 (0)