Skip to content

Commit 89a751d

Browse files
MeierschlumpfMeierschlumpf
authored
docs(integrations): add opnsense and firewall widget (#351)
1 parent 1205225 commit 89a751d

File tree

9 files changed

+195
-2
lines changed

9 files changed

+195
-2
lines changed

‎docs/integrations/opnsense/index.mdx

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
---
2+
title: 'OPNsense'
3+
description: "OPNsense is an open-source, easy-to-use, and easy-to-build firewall and routing platform."
4+
hide_title: true
5+
---
6+
7+
import { IntegrationHeader } from '@site/src/components/integrations/header';
8+
import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
9+
import { AddingIntegration } from '@site/src/components/integrations/adding';
10+
import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
11+
import { IconHeartRateMonitor } from "@tabler/icons-react";
12+
import { opnsenseIntegration } from '.';
13+
import Alert from '@theme/Admonition'
14+
import { firewallWidget } from '../../widgets/firewall';
15+
16+
<IntegrationHeader
17+
integration={opnsenseIntegration}
18+
categories={['Firewall']}
19+
/>
20+
21+
### Widgets & Capabilities
22+
<IntegrationCapabilites
23+
items={[{
24+
widget: firewallWidget,
25+
}]}
26+
/>
27+
28+
### Adding the integration
29+
<AddingIntegration />
30+
31+
### Secrets
32+
<IntegrationSecrets secrets={[{
33+
tabLabel: "ApiKey (Key & Secret)",
34+
credentials: ['opnsenseApiKey', 'opnsenseApiSecret'],
35+
steps: [],
36+
}]} />

‎docs/integrations/opnsense/index.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { IntegrationDefinition } from '@site/src/types';
2+
export const opnsenseIntegration: IntegrationDefinition = {
3+
name: 'OPNsense',
4+
description:
5+
'OPNsense is an open-source, easy-to-use, and easy-to-build firewall and routing platform',
6+
iconUrl: 'https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/opnsense.svg',
7+
path: '../../integrations/opnsense',
8+
};

‎docs/widgets/firewall/index.mdx

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
---
2+
title: 'Firewall Monitoring'
3+
description: 'Displays a summary of firewalls.'
4+
hide_title: true
5+
---
6+
7+
import { WidgetHeader } from '@site/src/components/widgets/header';
8+
import { AddingWidget } from '@site/src/components/widgets/adding';
9+
import { WidgetIntegrations } from '@site/src/components/widgets/integrations';
10+
import Tabs from '@theme/Tabs';
11+
import TabItem from '@theme/TabItem';
12+
import { firewallWidget } from '.';
13+
import { opnsenseIntegration } from '../../integrations/opnsense';
14+
15+
16+
<WidgetHeader
17+
widget={firewallWidget}
18+
categories={['Firewall']}
19+
/>
20+
21+
### Screenshots
22+
23+
:::note
24+
Screenshots will follow soon.
25+
:::
26+
27+
### Supported Integrations
28+
29+
<WidgetIntegrations items={[{
30+
integration: opnsenseIntegration,
31+
}]} />
32+
33+
### Adding the widget
34+
35+
<AddingWidget />

‎docs/widgets/firewall/index.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { WidgetDefinition } from '@site/src/types';
2+
import { IconWall } from '@tabler/icons-react';
3+
4+
export const firewallWidget: WidgetDefinition = {
5+
icon: IconWall,
6+
name: 'Firewall Monitoring',
7+
description: 'Displays a summary of firewalls.',
8+
path: '../../widgets/firewall',
9+
configuration: {
10+
items: [],
11+
},
12+
};

‎src/components/integrations/secrets.tsx

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,16 @@ const secretKinds = {
3737
description: 'A personal access token for authentication.',
3838
icon: IconKey,
3939
},
40+
opnsenseApiKey: {
41+
name: 'Api Key (Key)',
42+
description: 'The Key part of the API Key for authentication.',
43+
icon: IconKey,
44+
},
45+
opnsenseApiSecret: {
46+
name: 'Api Key (Secret)',
47+
description: 'The Secret part of the API Key for authentication.',
48+
icon: IconPassword,
49+
},
4050
};
4151

4252
type SecretKind = keyof typeof secretKinds;
@@ -63,9 +73,10 @@ export const IntegrationSecrets = ({ secrets }: IntegrationSecretsProps) => {
6373
secret.credentials.map((value) => secretKinds[value]).find((value) => 'icon' in value)
6474
?.icon || IconKeyOff;
6575
const tabLabel =
66-
secret.tabLabel ?? secret.credentials.length === 0
76+
secret.tabLabel ??
77+
(secret.credentials.length === 0
6778
? 'No Authentication'
68-
: secret.credentials.map((value) => secretKinds[value].name).join(' & ');
79+
: secret.credentials.map((value) => secretKinds[value].name).join(' & '));
6980

7081
return (
7182
<TabItem

‎versioned_docs/version-1.31.0/integrations/opnsense/index.mdx

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
---
2+
title: 'OPNsense'
3+
description: "OPNsense is an open-source, easy-to-use, and easy-to-build firewall and routing platform."
4+
hide_title: true
5+
---
6+
7+
import { IntegrationHeader } from '@site/src/components/integrations/header';
8+
import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
9+
import { AddingIntegration } from '@site/src/components/integrations/adding';
10+
import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
11+
import { IconHeartRateMonitor } from "@tabler/icons-react";
12+
import { opnsenseIntegration } from '.';
13+
import Alert from '@theme/Admonition'
14+
import { firewallWidget } from '../../widgets/firewall';
15+
16+
<IntegrationHeader
17+
integration={opnsenseIntegration}
18+
categories={['Firewall']}
19+
/>
20+
21+
### Widgets & Capabilities
22+
<IntegrationCapabilites
23+
items={[{
24+
widget: firewallWidget,
25+
}]}
26+
/>
27+
28+
### Adding the integration
29+
<AddingIntegration />
30+
31+
### Secrets
32+
<IntegrationSecrets secrets={[{
33+
tabLabel: "ApiKey (Key & Secret)",
34+
credentials: ['opnsenseApiKey', 'opnsenseApiSecret'],
35+
steps: [],
36+
}]} />

‎versioned_docs/version-1.31.0/integrations/opnsense/index.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { IntegrationDefinition } from '@site/src/types';
2+
export const opnsenseIntegration: IntegrationDefinition = {
3+
name: 'OPNsense',
4+
description:
5+
'OPNsense is an open-source, easy-to-use, and easy-to-build firewall and routing platform',
6+
iconUrl: 'https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/opnsense.svg',
7+
path: '../../integrations/opnsense',
8+
};

‎versioned_docs/version-1.31.0/widgets/firewall/index.mdx

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
---
2+
title: 'Firewall Monitoring'
3+
description: 'Displays a summary of firewalls.'
4+
hide_title: true
5+
---
6+
7+
import { WidgetHeader } from '@site/src/components/widgets/header';
8+
import { AddingWidget } from '@site/src/components/widgets/adding';
9+
import { WidgetIntegrations } from '@site/src/components/widgets/integrations';
10+
import Tabs from '@theme/Tabs';
11+
import TabItem from '@theme/TabItem';
12+
import { firewallWidget } from '.';
13+
import { opnsenseIntegration } from '../../integrations/opnsense';
14+
15+
16+
<WidgetHeader
17+
widget={firewallWidget}
18+
categories={['Firewall']}
19+
/>
20+
21+
### Screenshots
22+
23+
:::note
24+
Screenshots will follow soon.
25+
:::
26+
27+
### Supported Integrations
28+
29+
<WidgetIntegrations items={[{
30+
integration: opnsenseIntegration,
31+
}]} />
32+
33+
### Adding the widget
34+
35+
<AddingWidget />

‎versioned_docs/version-1.31.0/widgets/firewall/index.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { WidgetDefinition } from '@site/src/types';
2+
import { IconWall } from '@tabler/icons-react';
3+
4+
export const firewallWidget: WidgetDefinition = {
5+
icon: IconWall,
6+
name: 'Firewall Monitoring',
7+
description: 'Displays a summary of firewalls.',
8+
path: '../../widgets/firewall',
9+
configuration: {
10+
items: [],
11+
},
12+
};

0 commit comments

Comments
 (0)