Skip to content

Commit

Permalink
Release fixes vol. 3 (OIDC dashboard, links) (#957)
Browse files Browse the repository at this point in the history 
* fix oidc UI

* change link
  • Loading branch information
@t-aleksander
t-aleksander authored Jan 17, 2025
1 parent 0cec317 commit c157695
Show file tree
Hide file tree
Showing 7 changed files with 120 additions and 137 deletions.
3 changes: 2 additions & 1 deletion web/src/pages/devices/modals/AddStandaloneDeviceModal/steps/MethodStep/MethodStep.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import {
} from '../../../../../../shared/defguard-ui/components/Layout/Button/types';
import { SelectOption } from '../../../../../../shared/defguard-ui/components/Layout/Select/types';
import useApi from '../../../../../../shared/hooks/useApi';
import { externalLink } from '../../../../../../shared/links';
import { QueryKeys } from '../../../../../../shared/queries';
import { Network } from '../../../../../../shared/types';
import { DeviceSetupMethodCard } from '../../../../../addDevice/steps/AddDeviceSetupMethodStep/components/DeviceSetupMethodCard/DeviceSetupMethodCard';
Expand Down Expand Up @@ -111,7 +112,7 @@ export const MethodStep = () => {
<DeviceSetupMethodCard
title={localLL.cards.cli.title()}
subtitle={localLL.cards.cli.subtitle()}
link={'https://defguard.net/download'}
link={externalLink.defguardCliDownload}
linkText={localLL.cards.cli.download()}
logo={<DefguardIcon />}
selected={choice === AddStandaloneDeviceModalChoice.CLI}
Expand Down
18 changes: 3 additions & 15 deletions .../settings/components/GatewayNotificationsSettings/components/GatewayNotificationsForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,17 +86,11 @@ export const GatewayNotificationsForm = () => {
return res;
}, [settings]);

const { control, handleSubmit, watch } = useForm<FormFields>({
const { control, handleSubmit } = useForm<FormFields>({
defaultValues,
mode: 'all',
resolver: zodResolver(zodSchema),
});
const gatewayDisconnectNotificationsEnabled = watch(
'gateway_disconnect_notifications_enabled',
);
const gatewayDisconnectNotificationsReconnectNotificationEnabled = watch(
'gateway_disconnect_notifications_reconnect_notification_enabled',
);

const onSubmit: SubmitHandler<FormFields> = (data) => {
mutate(data);
Expand Down Expand Up @@ -127,7 +121,6 @@ export const GatewayNotificationsForm = () => {
<FormCheckBox
disabled={isLoading || !smtpConfigured}
label={localLL.form.fields.disconnectNotificationsEnabled.label()}
value={gatewayDisconnectNotificationsEnabled}
controller={{
control,
name: 'gateway_disconnect_notifications_enabled',
Expand All @@ -148,18 +141,13 @@ export const GatewayNotificationsForm = () => {
labelExtras={
<Helper>{parse(localLL.form.fields.inactivityThreshold.help())}</Helper>
}
disabled={
isLoading || !gatewayDisconnectNotificationsEnabled || !smtpConfigured
}
disabled={isLoading || !smtpConfigured}
required
/>
<div className="checkbox-row">
<FormCheckBox
disabled={
isLoading || !gatewayDisconnectNotificationsEnabled || !smtpConfigured
}
disabled={isLoading || !smtpConfigured}
label={localLL.form.fields.reconnectNotificationsEnabled.label()}
value={gatewayDisconnectNotificationsReconnectNotificationEnabled}
controller={{
control,
name: 'gateway_disconnect_notifications_reconnect_notification_enabled',
Expand Down
29 changes: 11 additions & 18 deletions web/src/pages/settings/components/OpenIdSettings/components/DirectorySyncSettings.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,11 @@ const SUPPORTED_SYNC_PROVIDERS = ['Google'];
export const DirsyncSettings = ({
currentProvider,
formControl,
isLoading,
}: {
currentProvider: OpenIdProvider | null;
currentProvider?: OpenIdProvider;
formControl: UseFormReturn<FormFields>;
isLoading: boolean;
}) => {
const { LL } = useI18nContext();
const localLL = LL.settingsPage.openIdSettings;
Expand Down Expand Up @@ -101,7 +103,7 @@ export const DirsyncSettings = ({
<>
<div id="enable-dir-sync">
<FormCheckBox
disabled={!enterpriseEnabled}
disabled={isLoading}
label={localLL.form.labels.enable_directory_sync.label()}
labelPlacement="right"
controller={{ control, name: 'directory_sync_enabled' }}
Expand All @@ -118,7 +120,7 @@ export const DirsyncSettings = ({
labelExtras={
<Helper>{parse(localLL.form.labels.sync_target.helper())}</Helper>
}
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<FormInput
value={currentProvider?.directory_sync_interval ?? ''}
Expand All @@ -130,7 +132,7 @@ export const DirsyncSettings = ({
labelExtras={
<Helper>{parse(localLL.form.labels.sync_interval.helper())}</Helper>
}
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<FormSelect
controller={{ control, name: 'directory_sync_user_behavior' }}
Expand All @@ -143,7 +145,7 @@ export const DirsyncSettings = ({
labelExtras={
<Helper>{parse(localLL.form.labels.user_behavior.helper())}</Helper>
}
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<FormSelect
controller={{ control, name: 'directory_sync_admin_behavior' }}
Expand All @@ -156,26 +158,17 @@ export const DirsyncSettings = ({
labelExtras={
<Helper>{parse(localLL.form.labels.admin_behavior.helper())}</Helper>
}
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<FormInput
controller={{ control, name: 'admin_email' }}
label={localLL.form.labels.admin_email.label()}
disabled={!enterpriseEnabled}
disabled={isLoading}
labelExtras={
<Helper>{parse(localLL.form.labels.admin_email.helper())}</Helper>
}
required={enabled}
/>
<div className="hidden-input">
<FormInput
value={currentProvider?.google_service_account_key ?? ''}
type="text"
name="google_service_account_key"
controller={{ control, name: 'google_service_account_key' }}
readOnly
/>
</div>
<FormInput
value={currentProvider?.google_service_account_email ?? ''}
controller={{ control, name: 'google_service_account_email' }}
Expand All @@ -188,7 +181,7 @@ export const DirsyncSettings = ({
{parse(localLL.form.labels.service_account_used.helper())}
</Helper>
}
disabled={!enterpriseEnabled}
disabled={isLoading}
required={enabled}
/>
<div className="input">
Expand Down Expand Up @@ -221,7 +214,7 @@ export const DirsyncSettings = ({
reader.readAsText(file);
}
}}
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<div className="upload-label">
<SvgIconDownload />{' '}
Expand Down
9 changes: 3 additions & 6 deletions web/src/pages/settings/components/OpenIdSettings/components/OpenIdGeneralSettings.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,24 +6,21 @@ import { UseFormReturn } from 'react-hook-form';
import { useI18nContext } from '../../../../../i18n/i18n-react';
import { FormCheckBox } from '../../../../../shared/defguard-ui/components/Form/FormCheckBox/FormCheckBox';
import { Helper } from '../../../../../shared/defguard-ui/components/Layout/Helper/Helper';
import { useAppStore } from '../../../../../shared/hooks/store/useAppStore';
import { OpenIdProvider } from '../../../../../shared/types';
import { useSettingsPage } from '../../../hooks/useSettingsPage';

export const OpenIdGeneralSettings = ({
formControl,
isLoading,
}: {
formControl: UseFormReturn<
OpenIdProvider & {
create_account: boolean;
}
>;
isLoading: boolean;
}) => {
const { LL } = useI18nContext();
const localLL = LL.settingsPage.openIdSettings;
const settings = useSettingsPage((state) => state.settings);
const enterpriseEnabled = useAppStore((s) => s.appInfo?.license_info.enterprise);
if (!settings) return null;

return (
<section id="openid-settings">
Expand All @@ -35,13 +32,13 @@ export const OpenIdGeneralSettings = ({
<div>
<div className="checkbox-row">
<FormCheckBox
disabled={!enterpriseEnabled}
label={localLL.general.createAccount.label()}
controller={{
control: formControl.control,
name: 'create_account',
}}
labelPlacement="right"
disabled={isLoading}
/>
<Helper>{localLL.general.createAccount.helper()}</Helper>
</div>
Expand Down
64 changes: 28 additions & 36 deletions web/src/pages/settings/components/OpenIdSettings/components/OpenIdProviderSettings.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,25 +13,25 @@ import {
SelectSelectedValue,
SelectSizeVariant,
} from '../../../../../shared/defguard-ui/components/Layout/Select/types';
import { useAppStore } from '../../../../../shared/hooks/store/useAppStore';
import { OpenIdProvider } from '../../../../../shared/types';

type FormFields = OpenIdProvider & {
create_account: boolean;
};

export const OpenIdSettingsForm = ({
setCurrentProvider,
currentProvider,
formControl,
isLoading,
}: {
setCurrentProvider: (provider: OpenIdProvider | null) => void;
currentProvider: OpenIdProvider | null;
formControl: UseFormReturn<
OpenIdProvider & {
create_account: boolean;
}
>;
setCurrentProvider: (provider?: OpenIdProvider) => void;
currentProvider?: OpenIdProvider;
formControl: UseFormReturn<FormFields>;
isLoading: boolean;
}) => {
const { LL } = useI18nContext();
const localLL = LL.settingsPage.openIdSettings;
const enterpriseEnabled = useAppStore((s) => s.appInfo?.license_info.enterprise);
const { control } = formControl;

const options: SelectOption<string>[] = useMemo(
Expand Down Expand Up @@ -94,28 +94,20 @@ export const OpenIdSettingsForm = ({
[],
);

const handleChange = useCallback(
const handleProviderChange = useCallback(
(val: string) => {
setCurrentProvider({
...currentProvider,
id: currentProvider?.id ?? 0,
name: val,
base_url: getProviderUrl({ name: val }) ?? '',
client_id: currentProvider?.client_id ?? '',
client_secret: currentProvider?.client_secret ?? '',
display_name:
getProviderDisplayName({ name: val }) ?? currentProvider?.display_name ?? '',
google_service_account_email: currentProvider?.google_service_account_email ?? '',
google_service_account_key: currentProvider?.google_service_account_key ?? '',
admin_email: currentProvider?.admin_email ?? '',
directory_sync_enabled: currentProvider?.directory_sync_enabled ?? false,
directory_sync_interval: currentProvider?.directory_sync_interval ?? 600,
directory_sync_user_behavior:
currentProvider?.directory_sync_user_behavior ?? 'keep',
directory_sync_admin_behavior:
currentProvider?.directory_sync_admin_behavior ?? 'keep',
directory_sync_target: currentProvider?.directory_sync_target ?? 'all',
});
if (currentProvider) {
setCurrentProvider({
...currentProvider,
id: currentProvider?.id ?? 0,
name: val,
base_url: getProviderUrl({ name: val }) ?? '',
client_id: currentProvider?.client_id ?? '',
client_secret: currentProvider?.client_secret ?? '',
display_name:
getProviderDisplayName({ name: val }) ?? currentProvider?.display_name ?? '',
});
}
},
[currentProvider, getProviderUrl, getProviderDisplayName, setCurrentProvider],
);
Expand All @@ -131,23 +123,23 @@ export const OpenIdSettingsForm = ({
selected={currentProvider?.name ?? undefined}
options={options}
renderSelected={renderSelected}
onChangeSingle={(res) => handleChange(res)}
onChangeSingle={(res) => handleProviderChange(res)}
label={localLL.form.labels.provider.label()}
labelExtras={<Helper>{parse(localLL.form.labels.provider.helper())}</Helper>}
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<FormInput
controller={{ control, name: 'base_url' }}
label={localLL.form.labels.base_url.label()}
labelExtras={<Helper>{parse(localLL.form.labels.base_url.helper())}</Helper>}
disabled={currentProvider?.name === 'Google' || !enterpriseEnabled}
disabled={currentProvider?.name === 'Google' || isLoading}
required
/>
<FormInput
controller={{ control, name: 'client_id' }}
label={localLL.form.labels.client_id.label()}
labelExtras={<Helper>{parse(localLL.form.labels.client_id.helper())}</Helper>}
disabled={!enterpriseEnabled}
disabled={isLoading}
required
/>
<FormInput
Expand All @@ -156,13 +148,13 @@ export const OpenIdSettingsForm = ({
labelExtras={<Helper>{parse(localLL.form.labels.client_secret.helper())}</Helper>}
required
type="password"
disabled={!enterpriseEnabled}
disabled={isLoading}
/>
<FormInput
controller={{ control, name: 'display_name' }}
label={localLL.form.labels.display_name.label()}
labelExtras={<Helper>{parse(localLL.form.labels.display_name.helper())}</Helper>}
disabled={!enterpriseEnabled || currentProvider?.name !== 'Custom'}
disabled={isLoading || currentProvider?.name !== 'Custom'}
/>
<a
href={
Expand Down
Loading

0 comments on commit c157695

Please sign in to comment.