Muse
1bd63e6625
Per SETTINGS-AUDIT (all three tiers approved 2026-10-23): Dead settings: - panelOutbound, ipLimitAllowlist (+ orphan parser job), outboundDownThreshold - tg fake events outbound.down/outbound.up/xray.crash (no publisher in lite) - phantom routing sub-tabs (Happ/Clash/Incy) and subJsonRules direct-rules tab (no backend keys); subHideSettings moved to the subscription info tab first Upstream remnants: - ldap* / smtp* model+schema keys, EmailNotifications orphan component - twoFactorEnable/twoFactorToken + login-page probe (no backend handler) - externalTrafficInform* Newly approved removals: - JSON subscription family (producer, routes, UA auto-detect, mux/finalmask/ observatory) and Clash subscription family (producer, routes, UA detect) - SubBalancer (table, service, controller, settings tab) - subThemeDir (subscription page falls back to the built-in template) - datepicker jalalian option (gregorian only; Persian picker removed) JSON/Clash endpoints now 404; link-format output pinned by regression tests. Guarded keys untouched: webListen/webPort/webBasePath/certs, tg* chain, expireDiff/trafficDiff/tgBotProxy, subHideSettings, pageSize/tgLang.
78 lines
2.1 KiB
TypeScript
78 lines
2.1 KiB
TypeScript
import { useState } from 'react';
|
|
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
import { InputNumber } from 'antd';
|
|
|
|
import { NotificationEvent } from './NotificationEvent';
|
|
|
|
const meta = {
|
|
title: 'UI/Notifications/NotificationEvent',
|
|
component: NotificationEvent,
|
|
tags: ['autodocs'],
|
|
parameters: {
|
|
layout: 'padded',
|
|
docs: {
|
|
description: {
|
|
component:
|
|
'Single toggleable notification event row used inside the Telegram and email notification groups on the settings page. Renders a checkbox with a translated label and, when checked, an optional indented extra control such as a threshold input.',
|
|
},
|
|
},
|
|
},
|
|
argTypes: {
|
|
label: { description: 'i18n key (or already-translated text) shown next to the checkbox.' },
|
|
checked: { description: 'Whether the event notification is enabled.' },
|
|
onToggle: { description: 'Called when the checkbox is clicked.' },
|
|
children: { description: 'Extra control rendered indented below the label while checked.' },
|
|
},
|
|
} satisfies Meta<typeof NotificationEvent>;
|
|
|
|
export default meta;
|
|
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
function CpuThresholdDemo() {
|
|
const [checked, setChecked] = useState(true);
|
|
const [threshold, setThreshold] = useState(80);
|
|
return (
|
|
<NotificationEvent
|
|
label="pages.settings.eventCPUHigh"
|
|
checked={checked}
|
|
onToggle={() => setChecked((prev) => !prev)}
|
|
>
|
|
<InputNumber
|
|
size="small"
|
|
min={0}
|
|
max={100}
|
|
value={threshold}
|
|
onChange={(v) => setThreshold(v ?? 0)}
|
|
aria-label="CPU usage threshold percent"
|
|
style={{ width: 80 }}
|
|
/>
|
|
</NotificationEvent>
|
|
);
|
|
}
|
|
|
|
export const Unchecked: Story = {
|
|
args: {
|
|
label: 'pages.settings.eventLoginAttempt',
|
|
checked: false,
|
|
onToggle: () => undefined,
|
|
},
|
|
};
|
|
|
|
export const Checked: Story = {
|
|
args: {
|
|
label: 'pages.settings.eventNodeDown',
|
|
checked: true,
|
|
onToggle: () => undefined,
|
|
},
|
|
};
|
|
|
|
export const CpuThreshold: Story = {
|
|
args: {
|
|
label: 'pages.settings.eventCPUHigh',
|
|
checked: true,
|
|
onToggle: () => undefined,
|
|
},
|
|
render: () => <CpuThresholdDemo />,
|
|
};
|