Skip to content

Commit

Permalink
feat(config): show interface ip addresses in interface select
Browse files Browse the repository at this point in the history
  • Loading branch information
kunish committed Jun 19, 2023
1 parent d837090 commit 8279137
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 8 deletions.
2 changes: 2 additions & 0 deletions src/apis/query.ts
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@ export const getInterfacesRequest = (gqlClient: GraphQLClient) => {
interfaces(up: $up) {
name
ifindex
ip
flag {
default {
gateway
Expand Down Expand Up @@ -129,6 +130,7 @@ export const useGeneralQuery = () => {
interfaces(up: $up) {
name
ifindex
ip
flag {
default {
gateway
Expand Down
22 changes: 20 additions & 2 deletions src/components/ConfigFormModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
Select,
Slider,
Stack,
Text,
TextInput,
Title,
} from '@mantine/core'
Expand Down Expand Up @@ -46,6 +47,7 @@ import {
import { GlobalInput } from '~/schemas/gql/graphql'

import { FormActions } from './FormActions'
import { SelectItemWithDescription } from './SelectItemWithDescription'

const schema = z.object({
name: z.string().nonempty(),
Expand Down Expand Up @@ -174,9 +176,16 @@ export const ConfigFormDrawer = forwardRef(({ opened, onClose }: { opened: boole
if (interfaces) {
return interfaces
.filter(({ flag }) => !!flag.default)
.map(({ name }) => ({
.map(({ name, ip }) => ({
label: name,
value: name,
description: (
<Stack spacing="xs">
{ip.map((addr, i) => (
<Text key={i}>{addr}</Text>
))}
</Stack>
),
}))
}

Expand All @@ -187,9 +196,16 @@ export const ConfigFormDrawer = forwardRef(({ opened, onClose }: { opened: boole
const interfaces = generalQuery?.general.interfaces

if (interfaces) {
return interfaces.map(({ name }) => ({
return interfaces.map(({ name, ip }) => ({
label: name,
value: name,
description: (
<Stack spacing="xs">
{ip.map((addr, i) => (
<Text key={i}>{addr}</Text>
))}
</Stack>
),
}))
}

Expand Down Expand Up @@ -313,13 +329,15 @@ export const ConfigFormDrawer = forwardRef(({ opened, onClose }: { opened: boole
<MultiSelect
label={t('lanInterface')}
description={t('descriptions.config.lanInterface')}
itemComponent={SelectItemWithDescription}
data={lanInterfacesData}
{...form.getInputProps('lanInterface')}
/>

<MultiSelect
label={t('wanInterface')}
description={t('descriptions.config.wanInterface')}
itemComponent={SelectItemWithDescription}
withAsterisk
data={wanInterfacesData}
{...form.getInputProps('wanInterface')}
Expand Down
12 changes: 6 additions & 6 deletions src/schemas/gql/gql.ts
Original file line number Diff line number Diff line change
Expand Up @@ -82,11 +82,11 @@ const documents = {
types.ModeDocument,
'\n query Defaults($paths: [String!]) {\n jsonStorage(paths: $paths)\n }\n ':
types.DefaultsDocument,
'\n query Interfaces($up: Boolean) {\n general {\n interfaces(up: $up) {\n name\n ifindex\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ':
'\n query Interfaces($up: Boolean) {\n general {\n interfaces(up: $up) {\n name\n ifindex\n ip\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ':
types.InterfacesDocument,
'\n query JsonStorage($paths: [String!]) {\n jsonStorage(paths: $paths)\n }\n ':
types.JsonStorageDocument,
'\n query General($up: Boolean) {\n general {\n dae {\n running\n modified\n }\n interfaces(up: $up) {\n name\n ifindex\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ':
'\n query General($up: Boolean) {\n general {\n dae {\n running\n modified\n }\n interfaces(up: $up) {\n name\n ifindex\n ip\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ':
types.GeneralDocument,
'\n query Nodes {\n nodes {\n edges {\n id\n name\n link\n address\n protocol\n tag\n }\n }\n }\n ':
types.NodesDocument,
Expand Down Expand Up @@ -337,8 +337,8 @@ export function graphql(
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(
source: '\n query Interfaces($up: Boolean) {\n general {\n interfaces(up: $up) {\n name\n ifindex\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n '
): (typeof documents)['\n query Interfaces($up: Boolean) {\n general {\n interfaces(up: $up) {\n name\n ifindex\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ']
source: '\n query Interfaces($up: Boolean) {\n general {\n interfaces(up: $up) {\n name\n ifindex\n ip\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n '
): (typeof documents)['\n query Interfaces($up: Boolean) {\n general {\n interfaces(up: $up) {\n name\n ifindex\n ip\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ']
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
Expand All @@ -349,8 +349,8 @@ export function graphql(
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(
source: '\n query General($up: Boolean) {\n general {\n dae {\n running\n modified\n }\n interfaces(up: $up) {\n name\n ifindex\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n '
): (typeof documents)['\n query General($up: Boolean) {\n general {\n dae {\n running\n modified\n }\n interfaces(up: $up) {\n name\n ifindex\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ']
source: '\n query General($up: Boolean) {\n general {\n dae {\n running\n modified\n }\n interfaces(up: $up) {\n name\n ifindex\n ip\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n '
): (typeof documents)['\n query General($up: Boolean) {\n general {\n dae {\n running\n modified\n }\n interfaces(up: $up) {\n name\n ifindex\n ip\n flag {\n default {\n gateway\n }\n }\n }\n }\n }\n ']
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
Expand Down
4 changes: 4 additions & 0 deletions src/schemas/gql/graphql.ts
Original file line number Diff line number Diff line change
Expand Up @@ -885,6 +885,7 @@ export type InterfacesQuery = {
__typename?: 'Interface'
name: string
ifindex: number
ip: Array<string>
flag: {
__typename?: 'InterfaceFlag'
default?: Array<{ __typename?: 'DefaultRoute'; gateway?: string | null }> | null
Expand Down Expand Up @@ -912,6 +913,7 @@ export type GeneralQuery = {
__typename?: 'Interface'
name: string
ifindex: number
ip: Array<string>
flag: {
__typename?: 'InterfaceFlag'
default?: Array<{ __typename?: 'DefaultRoute'; gateway?: string | null }> | null
Expand Down Expand Up @@ -2665,6 +2667,7 @@ export const InterfacesDocument = {
selections: [
{ kind: 'Field', name: { kind: 'Name', value: 'name' } },
{ kind: 'Field', name: { kind: 'Name', value: 'ifindex' } },
{ kind: 'Field', name: { kind: 'Name', value: 'ip' } },
{
kind: 'Field',
name: { kind: 'Name', value: 'flag' },
Expand Down Expand Up @@ -2778,6 +2781,7 @@ export const GeneralDocument = {
selections: [
{ kind: 'Field', name: { kind: 'Name', value: 'name' } },
{ kind: 'Field', name: { kind: 'Name', value: 'ifindex' } },
{ kind: 'Field', name: { kind: 'Name', value: 'ip' } },
{
kind: 'Field',
name: { kind: 'Name', value: 'flag' },
Expand Down

0 comments on commit 8279137

Please sign in to comment.