mirror of
https://github.com/Tria-plc/emaui.git
synced 2026-09-07 13:05:46 +00:00
remove LicenseTypesTab component and associated creation logic from licensing configuration
This commit is contained in:
estifanos
@@ -1,457 +0,0 @@
|
||||
import { useMemo, useState } from 'react';
|
||||
import {
|
||||
Alert,
|
||||
Anchor,
|
||||
Badge,
|
||||
Button,
|
||||
Card,
|
||||
Checkbox,
|
||||
Group,
|
||||
Modal,
|
||||
NumberInput,
|
||||
Select,
|
||||
SimpleGrid,
|
||||
Stack,
|
||||
Switch,
|
||||
Text,
|
||||
TextInput,
|
||||
Textarea,
|
||||
} from '@mantine/core';
|
||||
import { useForm } from '@mantine/form';
|
||||
import { IconInfoCircle, IconPlus } from '@tabler/icons-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Link } from 'react-router-dom';
|
||||
import {
|
||||
AdvancedTable,
|
||||
ErrorState,
|
||||
ModalFooter,
|
||||
notify,
|
||||
PageLoader,
|
||||
useServerTable,
|
||||
type AdvancedColumn,
|
||||
} from '@ema-platform/ui';
|
||||
import {
|
||||
extractErrorMessage,
|
||||
useCreateLicenseTypeMutation,
|
||||
useGetLicenseCategoriesQuery,
|
||||
useGetLicenseTypesQuery,
|
||||
useLocalized,
|
||||
useUpdateLicenseStatusMutation,
|
||||
type CreateLicenseTypeInput,
|
||||
type FamilyKind,
|
||||
type LicenseCategory,
|
||||
type LicenseType,
|
||||
type ServiceKind,
|
||||
type WorkflowProfile,
|
||||
} from '@ema-platform/api';
|
||||
import { LICENSE_PERMISSIONS, RequirePermission, usePermissions } from '@ema-platform/auth';
|
||||
|
||||
/** Upper snake case, as the server normalises and then requires. */
|
||||
const KEY_PATTERN = /^[A-Z][A-Z0-9_]*$/;
|
||||
|
||||
interface FormValues {
|
||||
key: string;
|
||||
nameEn: string;
|
||||
nameAm: string;
|
||||
descEn: string;
|
||||
descAm: string;
|
||||
category: LicenseCategory | '';
|
||||
familyKind: FamilyKind;
|
||||
serviceKind: ServiceKind;
|
||||
workflowProfile: WorkflowProfile;
|
||||
certificatePrefix: string;
|
||||
feeNewApplication: number | '';
|
||||
feeCurrency: string;
|
||||
validityMonths: number;
|
||||
issuesCertificate: boolean;
|
||||
renewalEnabled: boolean;
|
||||
inspectionRequired: boolean;
|
||||
}
|
||||
|
||||
const INITIAL: FormValues = {
|
||||
key: '',
|
||||
nameEn: '',
|
||||
nameAm: '',
|
||||
descEn: '',
|
||||
descAm: '',
|
||||
category: '',
|
||||
familyKind: 'LOGISTICS_LICENSE',
|
||||
serviceKind: 'LICENSE',
|
||||
workflowProfile: 'STANDARD',
|
||||
certificatePrefix: '',
|
||||
feeNewApplication: '',
|
||||
feeCurrency: 'ETB',
|
||||
validityMonths: 12,
|
||||
issuesCertificate: true,
|
||||
renewalEnabled: true,
|
||||
inspectionRequired: true,
|
||||
};
|
||||
|
||||
/**
|
||||
* The catalogue of licence types, with the one thing no other screen offers:
|
||||
* creating a new one, and switching one on or off.
|
||||
*
|
||||
* Deliberately thin. A type is created with only what it needs to exist and
|
||||
* be classified; its form, document slots, fees and behaviour rules each
|
||||
* have a dedicated screen, and this one links there rather than duplicating
|
||||
* them. Deactivating hides the type from the portal catalogue without
|
||||
* touching applications already in flight, which hold the type by id.
|
||||
*/
|
||||
export function LicenseTypesTab() {
|
||||
const { t } = useTranslation();
|
||||
const localized = useLocalized();
|
||||
const { can } = usePermissions();
|
||||
|
||||
const { data, isLoading, isFetching, isError, error, refetch } = useGetLicenseTypesQuery();
|
||||
const { data: categoriesRes } = useGetLicenseCategoriesQuery();
|
||||
const [createType, { isLoading: isCreating }] = useCreateLicenseTypeMutation();
|
||||
const [updateStatus, { isLoading: isToggling }] = useUpdateLicenseStatusMutation();
|
||||
|
||||
const [showForm, setShowForm] = useState(false);
|
||||
const [pendingToggle, setPendingToggle] = useState<LicenseType | null>(null);
|
||||
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable();
|
||||
|
||||
const types = useMemo(
|
||||
() => [...(data?.items ?? [])].sort((a, b) => a.sortOrder - b.sortOrder || a.key.localeCompare(b.key)),
|
||||
[data],
|
||||
);
|
||||
|
||||
const categoryOptions = useMemo(
|
||||
() =>
|
||||
[...(categoriesRes?.items ?? [])]
|
||||
.sort((a, b) => a.sortOrder - b.sortOrder)
|
||||
.map((c) => ({ value: c.key, label: localized(c.name) })),
|
||||
[categoriesRes, localized],
|
||||
);
|
||||
const categoryLabel = (key: string) => categoryOptions.find((c) => c.value === key)?.label ?? key;
|
||||
|
||||
const familyOptions: { value: FamilyKind; label: string }[] = [
|
||||
{ value: 'LOGISTICS_LICENSE', label: t('licenseTypeConfig.family.LOGISTICS_LICENSE', 'Logistics licence') },
|
||||
{ value: 'CERTIFICATE', label: t('licenseTypeConfig.family.CERTIFICATE', 'Seafarer certificate') },
|
||||
{ value: 'DOCUMENT', label: t('licenseTypeConfig.family.DOCUMENT', 'Identity / statutory document') },
|
||||
];
|
||||
const serviceOptions: { value: ServiceKind; label: string }[] = [
|
||||
{ value: 'LICENSE', label: t('licenseTypeConfig.service.LICENSE', 'Licence') },
|
||||
{ value: 'REGISTRATION', label: t('licenseTypeConfig.service.REGISTRATION', 'Registration') },
|
||||
];
|
||||
const workflowOptions: { value: WorkflowProfile; label: string }[] = [
|
||||
{ value: 'STANDARD', label: t('licenseTypeConfig.workflow.STANDARD', 'Standard (review → evaluation → inspection → approval)') },
|
||||
{ value: 'REGISTRATION', label: t('licenseTypeConfig.workflow.REGISTRATION', 'Registration (review → approval)') },
|
||||
];
|
||||
|
||||
const form = useForm<FormValues>({
|
||||
initialValues: INITIAL,
|
||||
transformValues: (v) => ({ ...v, key: v.key.trim().toUpperCase(), certificatePrefix: v.certificatePrefix.trim() }),
|
||||
validate: {
|
||||
key: (v) => {
|
||||
const key = v.trim().toUpperCase();
|
||||
if (!key) return t('licenseTypeConfig.validation.keyRequired', 'Key is required');
|
||||
if (key.length > 64) return t('licenseTypeConfig.validation.keyTooLong', 'Key must be at most 64 characters');
|
||||
if (!KEY_PATTERN.test(key)) {
|
||||
return t('licenseTypeConfig.validation.keyFormat', 'Use letters, digits and underscores, e.g. PORT_AGENT');
|
||||
}
|
||||
if (types.some((lt) => lt.key === key)) {
|
||||
return t('licenseTypeConfig.validation.keyTaken', 'A licence type with this key already exists');
|
||||
}
|
||||
return null;
|
||||
},
|
||||
nameEn: (v) => (v.trim() ? null : t('configuration.validation.nameEnRequired')),
|
||||
nameAm: (v) => (v.trim() ? null : t('configuration.validation.nameAmRequired')),
|
||||
certificatePrefix: (v) => {
|
||||
const prefix = v.trim();
|
||||
if (!prefix) return t('licenseTypeConfig.validation.prefixRequired', 'Certificate prefix is required');
|
||||
if (prefix.length > 12) return t('licenseTypeConfig.validation.prefixTooLong', 'Prefix must be at most 12 characters');
|
||||
return null;
|
||||
},
|
||||
feeCurrency: (v) => (v.trim().length > 8 ? t('licenseTypeConfig.validation.currencyTooLong', 'Use a short currency code') : null),
|
||||
validityMonths: (v) =>
|
||||
v >= 6 && v <= 240 ? null : t('licenseTypeConfig.validation.validityRange', 'Validity must be between 6 and 240 months'),
|
||||
},
|
||||
});
|
||||
|
||||
const closeForm = () => {
|
||||
form.reset();
|
||||
setShowForm(false);
|
||||
};
|
||||
|
||||
const submit = form.onSubmit(async (values) => {
|
||||
const body: CreateLicenseTypeInput = {
|
||||
key: values.key,
|
||||
name: { en: values.nameEn.trim(), am: values.nameAm.trim() },
|
||||
certificatePrefix: values.certificatePrefix,
|
||||
familyKind: values.familyKind,
|
||||
serviceKind: values.serviceKind,
|
||||
workflowProfile: values.workflowProfile,
|
||||
feeCurrency: values.feeCurrency.trim() || 'ETB',
|
||||
validityMonths: values.validityMonths,
|
||||
issuesCertificate: values.issuesCertificate,
|
||||
renewalEnabled: values.renewalEnabled,
|
||||
inspectionRequired: values.inspectionRequired,
|
||||
// The last row by default; the seeded order is EMA's and stays put.
|
||||
sortOrder: types.length,
|
||||
};
|
||||
if (values.descEn.trim() || values.descAm.trim()) {
|
||||
body.description = { en: values.descEn.trim(), am: values.descAm.trim() };
|
||||
}
|
||||
if (values.category) body.category = values.category;
|
||||
if (values.feeNewApplication !== '') body.feeNewApplication = values.feeNewApplication;
|
||||
|
||||
try {
|
||||
await createType(body).unwrap();
|
||||
notify.success(t('licenseTypeConfig.created', 'Licence type created. Configure its form, documents and fees next.'));
|
||||
closeForm();
|
||||
} catch (e) {
|
||||
notify.error(extractErrorMessage(e, t('configuration.error')));
|
||||
}
|
||||
});
|
||||
|
||||
const confirmToggle = async () => {
|
||||
if (!pendingToggle) return;
|
||||
const next = !pendingToggle.isActive;
|
||||
try {
|
||||
await updateStatus({ id: pendingToggle.id, isActive: next }).unwrap();
|
||||
notify.success(
|
||||
next
|
||||
? t('licenseTypeConfig.activated', 'Licence type is now accepting applications')
|
||||
: t('licenseTypeConfig.deactivated', 'Licence type is closed to new applications'),
|
||||
);
|
||||
setPendingToggle(null);
|
||||
} catch (e) {
|
||||
notify.error(extractErrorMessage(e, t('configuration.error')));
|
||||
}
|
||||
};
|
||||
|
||||
if (isError) {
|
||||
return (
|
||||
<ErrorState
|
||||
title={t('certReq.loadFailed', 'Could not load licence types')}
|
||||
description={extractErrorMessage(error)}
|
||||
onRetry={() => refetch()}
|
||||
/>
|
||||
);
|
||||
}
|
||||
if (isLoading) return <PageLoader label={t('certReq.loading', 'Loading licence types…')} height={300} />;
|
||||
|
||||
const canToggle = can([LICENSE_PERMISSIONS.UPDATE_LICENSE_TYPE]);
|
||||
|
||||
const columns: AdvancedColumn<LicenseType>[] = [
|
||||
{ header: t('configuration.name'), cell: ({ row }) => localized(row.original.name) },
|
||||
{ header: t('configuration.key', 'Key'), cell: ({ row }) => <Text ff="monospace" size="sm">{row.original.key}</Text> },
|
||||
{ header: t('licenseTypeConfig.columns.category', 'Category'), cell: ({ row }) => categoryLabel(row.original.category) },
|
||||
{
|
||||
header: t('licenseTypeConfig.columns.family', 'Family'),
|
||||
cell: ({ row }) => familyOptions.find((f) => f.value === row.original.familyKind)?.label ?? row.original.familyKind,
|
||||
},
|
||||
{ header: t('licenseTypeConfig.columns.prefix', 'Prefix'), cell: ({ row }) => row.original.certificatePrefix },
|
||||
{
|
||||
header: t('licenseTypeConfig.columns.status', 'Status'),
|
||||
size: 110,
|
||||
cell: ({ row }) => (
|
||||
<Badge color={row.original.isActive ? 'green' : 'gray'} variant="light">
|
||||
{row.original.isActive ? t('licenseTypeConfig.active', 'Active') : t('licenseTypeConfig.inactive', 'Inactive')}
|
||||
</Badge>
|
||||
),
|
||||
},
|
||||
{
|
||||
header: '',
|
||||
label: t('licenseTypeConfig.columns.actions', 'Actions'),
|
||||
size: 140,
|
||||
cell: ({ row }) => (
|
||||
<Switch
|
||||
size="sm"
|
||||
checked={row.original.isActive}
|
||||
disabled={!canToggle || isToggling}
|
||||
onChange={() => setPendingToggle(row.original)}
|
||||
label={row.original.isActive ? t('licenseTypeConfig.deactivate', 'Deactivate') : t('licenseTypeConfig.activate', 'Activate')}
|
||||
aria-label={t('licenseTypeConfig.toggleAria', 'Toggle whether this licence type accepts applications')}
|
||||
/>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
const page = paginate(types);
|
||||
|
||||
return (
|
||||
<Stack gap="md">
|
||||
<Alert variant="light" color="blue" icon={<IconInfoCircle size={16} />}>
|
||||
<Text size="sm">
|
||||
{t(
|
||||
'licenseTypeConfig.notice',
|
||||
'A new type starts empty. After creating it, set up its form and document slots under Certificate Requirements, and its fees under Payment Configuration.',
|
||||
)}{' '}
|
||||
<Anchor component={Link} to="/certificate-requirements" size="sm">
|
||||
{t('licenseTypeConfig.goToRequirements', 'Certificate requirements')}
|
||||
</Anchor>
|
||||
{' · '}
|
||||
<Anchor component={Link} to="/payment-config" size="sm">
|
||||
{t('licenseTypeConfig.goToFees', 'Payment configuration')}
|
||||
</Anchor>
|
||||
</Text>
|
||||
</Alert>
|
||||
|
||||
<Group justify="flex-end">
|
||||
<RequirePermission anyOf={[LICENSE_PERMISSIONS.CREATE_LICENSE_TYPE]} hideOnly>
|
||||
<Button variant="light" size="sm" leftSection={<IconPlus size={16} />} onClick={() => setShowForm(true)}>
|
||||
{t('licenseTypeConfig.add', 'Add licence type')}
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
</Group>
|
||||
|
||||
<Card withBorder padding={0}>
|
||||
<AdvancedTable
|
||||
columns={columns}
|
||||
data={page.rows}
|
||||
tableName="configuration-license-types"
|
||||
itemCount={page.itemCount}
|
||||
pageIndex={page.pageIndex}
|
||||
onPageChange={setPageIndex}
|
||||
pageSize={pageSize}
|
||||
onPageSizeChange={setPageSize}
|
||||
refresh={refetch}
|
||||
isLoading={isFetching}
|
||||
emptyText={t('licenseTypeConfig.empty', 'No licence types yet')}
|
||||
/>
|
||||
</Card>
|
||||
|
||||
<Modal opened={showForm} onClose={closeForm} title={t('licenseTypeConfig.add', 'Add licence type')} size="lg">
|
||||
<form onSubmit={submit}>
|
||||
<Stack gap="sm">
|
||||
<SimpleGrid cols={{ base: 1, sm: 2 }}>
|
||||
<TextInput
|
||||
label={t('configuration.key', 'Key')}
|
||||
description={t('licenseTypeConfig.keyHint', 'Stable identifier, upper snake case. Cannot change once applications exist.')}
|
||||
placeholder="PORT_AGENT"
|
||||
required
|
||||
{...form.getInputProps('key')}
|
||||
onChange={(e) => form.setFieldValue('key', e.currentTarget.value.toUpperCase())}
|
||||
/>
|
||||
<TextInput
|
||||
label={t('licenseTypeConfig.prefix', 'Certificate number prefix')}
|
||||
description={t('licenseTypeConfig.prefixHint', 'e.g. FF → FF-2026-000123')}
|
||||
placeholder="PA"
|
||||
required
|
||||
maxLength={12}
|
||||
{...form.getInputProps('certificatePrefix')}
|
||||
/>
|
||||
</SimpleGrid>
|
||||
|
||||
<SimpleGrid cols={{ base: 1, sm: 2 }}>
|
||||
<TextInput label={t('configuration.nameEn')} required {...form.getInputProps('nameEn')} />
|
||||
<TextInput label={t('configuration.nameAm')} required {...form.getInputProps('nameAm')} />
|
||||
<Textarea label={t('configuration.descEn')} autosize minRows={2} {...form.getInputProps('descEn')} />
|
||||
<Textarea label={t('configuration.descAm')} autosize minRows={2} {...form.getInputProps('descAm')} />
|
||||
</SimpleGrid>
|
||||
|
||||
<SimpleGrid cols={{ base: 1, sm: 2 }}>
|
||||
<Select
|
||||
label={t('licenseTypeConfig.columns.category', 'Category')}
|
||||
description={t('licenseTypeConfig.categoryHint', 'The group the applicant browses by.')}
|
||||
data={categoryOptions}
|
||||
clearable
|
||||
searchable
|
||||
{...form.getInputProps('category')}
|
||||
/>
|
||||
<Select
|
||||
label={t('licenseTypeConfig.columns.family', 'Family')}
|
||||
description={t('licenseTypeConfig.familyHint', 'Decides which desk owns it and which portal catalogue lists it.')}
|
||||
data={familyOptions}
|
||||
allowDeselect={false}
|
||||
{...form.getInputProps('familyKind')}
|
||||
/>
|
||||
<Select
|
||||
label={t('certReq.behavior.serviceKind', 'Service kind')}
|
||||
data={serviceOptions}
|
||||
allowDeselect={false}
|
||||
{...form.getInputProps('serviceKind')}
|
||||
/>
|
||||
<Select
|
||||
label={t('certReq.behavior.workflowProfile', 'Workflow profile')}
|
||||
data={workflowOptions}
|
||||
allowDeselect={false}
|
||||
{...form.getInputProps('workflowProfile')}
|
||||
/>
|
||||
</SimpleGrid>
|
||||
|
||||
<SimpleGrid cols={{ base: 1, sm: 3 }}>
|
||||
<NumberInput
|
||||
label={t('licenseTypeConfig.fee', 'New application fee')}
|
||||
description={t('licenseTypeConfig.feeHint', 'Leave blank for no charge.')}
|
||||
min={0}
|
||||
decimalScale={2}
|
||||
thousandSeparator=","
|
||||
{...form.getInputProps('feeNewApplication')}
|
||||
/>
|
||||
<TextInput label={t('licenseTypeConfig.currency', 'Currency')} maxLength={8} {...form.getInputProps('feeCurrency')} />
|
||||
<NumberInput
|
||||
label={t('licenseTypeConfig.validity', 'Validity (months)')}
|
||||
min={6}
|
||||
max={240}
|
||||
allowDecimal={false}
|
||||
required
|
||||
{...form.getInputProps('validityMonths')}
|
||||
/>
|
||||
</SimpleGrid>
|
||||
|
||||
<Group gap="lg">
|
||||
<Checkbox
|
||||
label={t('licenseTypeConfig.issuesCertificate', 'Issues a certificate')}
|
||||
{...form.getInputProps('issuesCertificate', { type: 'checkbox' })}
|
||||
/>
|
||||
<Checkbox
|
||||
label={t('licenseTypeConfig.renewalEnabled', 'Renewable')}
|
||||
{...form.getInputProps('renewalEnabled', { type: 'checkbox' })}
|
||||
/>
|
||||
<Checkbox
|
||||
label={t('licenseTypeConfig.inspectionRequired', 'Inspection required')}
|
||||
{...form.getInputProps('inspectionRequired', { type: 'checkbox' })}
|
||||
/>
|
||||
</Group>
|
||||
|
||||
<ModalFooter>
|
||||
<Button variant="default" size="sm" onClick={closeForm}>
|
||||
{t('configuration.cancel')}
|
||||
</Button>
|
||||
<Button type="submit" size="sm" loading={isCreating}>
|
||||
{t('configuration.create')}
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</Stack>
|
||||
</form>
|
||||
</Modal>
|
||||
|
||||
<Modal
|
||||
opened={pendingToggle !== null}
|
||||
onClose={() => setPendingToggle(null)}
|
||||
title={
|
||||
pendingToggle?.isActive
|
||||
? t('licenseTypeConfig.deactivateTitle', 'Deactivate licence type')
|
||||
: t('licenseTypeConfig.activateTitle', 'Activate licence type')
|
||||
}
|
||||
size="sm"
|
||||
>
|
||||
<Text size="sm" mb="md">
|
||||
{pendingToggle?.isActive
|
||||
? t('licenseTypeConfig.deactivateText', {
|
||||
name: pendingToggle ? localized(pendingToggle.name) : '',
|
||||
defaultValue:
|
||||
'{{name}} will disappear from the applicant catalogue. Applications already in progress continue unaffected.',
|
||||
})
|
||||
: t('licenseTypeConfig.activateText', {
|
||||
name: pendingToggle ? localized(pendingToggle.name) : '',
|
||||
defaultValue: '{{name}} will be offered to applicants again.',
|
||||
})}
|
||||
</Text>
|
||||
<ModalFooter>
|
||||
<Button variant="default" size="sm" onClick={() => setPendingToggle(null)}>
|
||||
{t('configuration.cancel')}
|
||||
</Button>
|
||||
<Button size="sm" color={pendingToggle?.isActive ? 'red' : 'green'} loading={isToggling} onClick={confirmToggle}>
|
||||
{pendingToggle?.isActive
|
||||
? t('licenseTypeConfig.deactivate', 'Deactivate')
|
||||
: t('licenseTypeConfig.activate', 'Activate')}
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</Modal>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
Select,
|
||||
Stack,
|
||||
Switch,
|
||||
Text,
|
||||
Textarea,
|
||||
TextInput,
|
||||
Title,
|
||||
@@ -26,9 +27,11 @@ import {
|
||||
} from "@ema-platform/ui";
|
||||
import { LICENSE_PERMISSIONS, usePermissions } from "@ema-platform/auth";
|
||||
import {
|
||||
extractErrorMessage,
|
||||
useCreateLicenseTypeMutation,
|
||||
useGetLicenseTypesQuery,
|
||||
useLocalized,
|
||||
useUpdateLicenseStatusMutation,
|
||||
useUpdateLicenseTypeMutation,
|
||||
type FamilyKind,
|
||||
type LicenseCategory,
|
||||
@@ -109,9 +112,15 @@ export function LicenseTypesTab() {
|
||||
useCreateLicenseTypeMutation();
|
||||
const [updateLicenseType, { isLoading: isUpdating }] =
|
||||
useUpdateLicenseTypeMutation();
|
||||
// The narrow `PATCH :id/status` rather than the whole-row PUT: switching a
|
||||
// type off is the one change made in a hurry, and it must not carry every
|
||||
// other field of the form along with it.
|
||||
const [updateLicenseStatus, { isLoading: isToggling }] =
|
||||
useUpdateLicenseStatusMutation();
|
||||
|
||||
const [editing, setEditing] = useState<LicenseType | null>(null);
|
||||
const [showForm, setShowForm] = useState(false);
|
||||
const [pendingToggle, setPendingToggle] = useState<LicenseType | null>(null);
|
||||
|
||||
const form = useForm<FormValues>({
|
||||
initialValues: EMPTY,
|
||||
@@ -200,6 +209,29 @@ export function LicenseTypesTab() {
|
||||
}
|
||||
});
|
||||
|
||||
const confirmToggle = useCallback(async () => {
|
||||
if (!pendingToggle) return;
|
||||
const next = !pendingToggle.isActive;
|
||||
try {
|
||||
await updateLicenseStatus({ id: pendingToggle.id, isActive: next }).unwrap();
|
||||
notify.success(
|
||||
next
|
||||
? t(
|
||||
"configuration.licenseTypes.activated",
|
||||
"Licence type is now accepting applications",
|
||||
)
|
||||
: t(
|
||||
"configuration.licenseTypes.deactivated",
|
||||
"Licence type is closed to new applications",
|
||||
),
|
||||
);
|
||||
setPendingToggle(null);
|
||||
} catch (e) {
|
||||
notify.error(extractErrorMessage(e, t("configuration.error")));
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [pendingToggle, updateLicenseStatus]);
|
||||
|
||||
const items = [...(data?.items ?? [])].sort(
|
||||
(a, b) => a.sortOrder - b.sortOrder,
|
||||
);
|
||||
@@ -245,16 +277,29 @@ export function LicenseTypesTab() {
|
||||
},
|
||||
{
|
||||
header: "actions",
|
||||
size: 90,
|
||||
size: 170,
|
||||
cell: ({ row }) => (
|
||||
<Button
|
||||
variant="subtle"
|
||||
size="xs"
|
||||
onClick={() => openEdit(row.original)}
|
||||
disabled={!canEdit}
|
||||
>
|
||||
{t("configuration.edit", "Edit")}
|
||||
</Button>
|
||||
<Group gap="xs" wrap="nowrap">
|
||||
<Button
|
||||
variant="subtle"
|
||||
size="xs"
|
||||
onClick={() => openEdit(row.original)}
|
||||
disabled={!canEdit}
|
||||
>
|
||||
{t("configuration.edit", "Edit")}
|
||||
</Button>
|
||||
<Button
|
||||
variant="subtle"
|
||||
size="xs"
|
||||
color={row.original.isActive ? "red" : "teal"}
|
||||
onClick={() => setPendingToggle(row.original)}
|
||||
disabled={!canEdit || isToggling}
|
||||
>
|
||||
{row.original.isActive
|
||||
? t("configuration.licenseTypes.deactivate", "Deactivate")
|
||||
: t("configuration.licenseTypes.activate", "Activate")}
|
||||
</Button>
|
||||
</Group>
|
||||
),
|
||||
},
|
||||
];
|
||||
@@ -458,6 +503,55 @@ export function LicenseTypesTab() {
|
||||
</Stack>
|
||||
</form>
|
||||
</Modal>
|
||||
|
||||
<Modal
|
||||
opened={pendingToggle !== null}
|
||||
onClose={() => setPendingToggle(null)}
|
||||
title={
|
||||
pendingToggle?.isActive
|
||||
? t(
|
||||
"configuration.licenseTypes.deactivateTitle",
|
||||
"Deactivate licence type",
|
||||
)
|
||||
: t(
|
||||
"configuration.licenseTypes.activateTitle",
|
||||
"Activate licence type",
|
||||
)
|
||||
}
|
||||
size="sm"
|
||||
>
|
||||
<Text size="sm" mb="md">
|
||||
{pendingToggle?.isActive
|
||||
? t("configuration.licenseTypes.deactivateText", {
|
||||
name: pendingToggle ? localized(pendingToggle.name) : "",
|
||||
defaultValue:
|
||||
"{{name}} will disappear from the applicant catalogue. Applications already in progress continue unaffected.",
|
||||
})
|
||||
: t("configuration.licenseTypes.activateText", {
|
||||
name: pendingToggle ? localized(pendingToggle.name) : "",
|
||||
defaultValue: "{{name}} will be offered to applicants again.",
|
||||
})}
|
||||
</Text>
|
||||
<ModalFooter>
|
||||
<Button
|
||||
variant="default"
|
||||
size="sm"
|
||||
onClick={() => setPendingToggle(null)}
|
||||
>
|
||||
{t("configuration.cancel")}
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
color={pendingToggle?.isActive ? "red" : "teal"}
|
||||
loading={isToggling}
|
||||
onClick={confirmToggle}
|
||||
>
|
||||
{pendingToggle?.isActive
|
||||
? t("configuration.licenseTypes.deactivate", "Deactivate")
|
||||
: t("configuration.licenseTypes.activate", "Activate")}
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</Modal>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -42,7 +42,7 @@ import { LocationPage } from "../../../location/pages/LocationPage";
|
||||
import { PersonalDocumentsCard } from "../../../certificate-requirements/components/PersonalDocumentsCard";
|
||||
import { CertificationPage } from "../../../certification/pages/CertificationPage";
|
||||
import { NumberFormatTab } from "../../components/NumberFormatTab";
|
||||
import { LicenseTypesTab } from "../../components/LicenseTypesTab";
|
||||
import { LicenseTypesTab } from "./LicenseTypesTab";
|
||||
import { RankDepartmentTab } from "./RankDepartmentTab";
|
||||
import {
|
||||
useGetOrganizationsQuery,
|
||||
@@ -409,9 +409,6 @@ export function ConfigurationPage() {
|
||||
>
|
||||
{t("certification.title")}
|
||||
</Tabs.Tab>
|
||||
<Tabs.Tab value="licenseTypes" leftSection={<IconLicense size={16} />}>
|
||||
{t("configuration.licenseTypesTab", "Licence types")}
|
||||
</Tabs.Tab>
|
||||
<Tabs.Tab value="numberFormats" leftSection={<IconHash size={16} />}>
|
||||
{t("numberFormat.title", "Number Formats")}
|
||||
</Tabs.Tab>
|
||||
@@ -431,10 +428,6 @@ export function ConfigurationPage() {
|
||||
<LocationPage />
|
||||
</Tabs.Panel>
|
||||
|
||||
<Tabs.Panel value="licenseTypes" pt="md">
|
||||
<LicenseTypesTab />
|
||||
</Tabs.Panel>
|
||||
|
||||
<Tabs.Panel value="certifications" pt="md">
|
||||
<CertificationPage />
|
||||
</Tabs.Panel>
|
||||
|
||||
@@ -885,8 +885,43 @@ export const am: Translations = {
|
||||
configuration: {
|
||||
title: "ውቅረት",
|
||||
licenseTypesTab: "የፈቃድ አይነቶች",
|
||||
licenseTypes: {
|
||||
add: "የፈቃድ ዓይነት ያክሉ",
|
||||
edit: "የፈቃድ ዓይነት አስተካክል",
|
||||
key: "ቁልፍ",
|
||||
keyHint:
|
||||
"ቋሚ መለያ፣ ለምሳሌ CUSTOMS_BROKER። ማመልከቻዎች ከጠቀሱት በኋላ ሊቀየር አይችልም።",
|
||||
keyInvalid: "አቢይ ፊደላት፣ አሃዞችና ከስር መስመር፣ ከ3 እስከ 64 ቁምፊዎች",
|
||||
category: "ምድብ",
|
||||
categoryHint:
|
||||
"እነማን ማመልከት እንደሚችሉና የትኞቹ የሹመት ደረጃዎች እርምጃ መውሰድ እንደሚችሉ ይወስናል።",
|
||||
familyKind: "ዓይነት",
|
||||
familyKindHint:
|
||||
"ፈቃድ፣ የምስክር ወረቀት ወይም ሰነድ። አጠቃቀሙን፣ የአመልካች ካታሎጉንና ወረፋው ድርጅት እንደሚያሳይ ይወስናል።",
|
||||
prefix: "የምስክር ወረቀት ቅድመ ቅጥያ",
|
||||
prefixHint:
|
||||
"የእያንዳንዱ ማመልከቻና የምስክር ወረቀት ቁጥር መጀመሪያ፣ ለምሳሌ CB → CB-2026-000042።",
|
||||
prefixInvalid: "ያስፈልጋል፣ ቢበዛ 12 ቁምፊዎች",
|
||||
status: "ሁኔታ",
|
||||
active: "ንቁ",
|
||||
inactive: "እንቅስቃሴ የሌለ",
|
||||
isActive: "ለአመልካቾች ይታያል",
|
||||
isActiveHint: "ቅጹና የሰነድ መስፈርቶቹ እስኪዘጋጁ ድረስ አጥፍተው ይተዉት።",
|
||||
activate: "አንቃ",
|
||||
deactivate: "አሰናክል",
|
||||
activateTitle: "የፈቃድ ዓይነት አንቃ",
|
||||
deactivateTitle: "የፈቃድ ዓይነት አሰናክል",
|
||||
activateText: "{{name}} ለአመልካቾች እንደገና ይቀርባል።",
|
||||
deactivateText:
|
||||
"{{name}} ከአመልካች ካታሎግ ይጠፋል። በሂደት ላይ ያሉ ማመልከቻዎች ሳይነኩ ይቀጥላሉ።",
|
||||
activated: "የፈቃድ ዓይነቱ አሁን ማመልከቻዎችን ይቀበላል",
|
||||
deactivated: "የፈቃድ ዓይነቱ ለአዲስ ማመልከቻዎች ተዘግቷል",
|
||||
noPermission: "የፈቃድ ዓይነት ለመፍጠር ፈቃድ የለዎትም።",
|
||||
nextStepsTitle: "ዓይነቱን ከፈጠሩ በኋላ",
|
||||
nextSteps:
|
||||
"ቅጹን፣ የሰነድ መስፈርቶቹንና ባህሪውን በምስክር ወረቀት መስፈርቶች፣ ክፍያዎቹን በክፍያ ውቅረት፣ የምስክር ወረቀት ንድፉን ደግሞ በንድፍ ሰሪው ያዘጋጁ — ከዚያ እዚህ ንቁ ያድርጉት።",
|
||||
},
|
||||
personalDocumentsTab: "የግል ሰነዶች",
|
||||
licenseTypesTab: "የፈቃድ ዓይነቶች",
|
||||
departments: "ክፍሎች",
|
||||
professions: "ሙያዎች",
|
||||
departmentsList: "ክፍሎች",
|
||||
@@ -921,69 +956,6 @@ export const am: Translations = {
|
||||
},
|
||||
},
|
||||
|
||||
licenseTypeConfig: {
|
||||
add: "የፈቃድ አይነት ያክሉ",
|
||||
empty: "እስካሁን ምንም የፈቃድ አይነቶች የሉም",
|
||||
notice:
|
||||
"አዲስ አይነት ባዶ ሆኖ ይጀምራል። ከፈጠሩ በኋላ ቅጹንና የሰነድ መስፈርቶቹን በምስክር ወረቀት መስፈርቶች ስር፣ ክፍያዎቹን ደግሞ በክፍያ ውቅረት ስር ያዘጋጁ።",
|
||||
goToRequirements: "የምስክር ወረቀት መስፈርቶች",
|
||||
goToFees: "የክፍያ ውቅረት",
|
||||
created: "የፈቃድ አይነት ተፈጥሯል። በመቀጠል ቅጹን፣ ሰነዶቹንና ክፍያዎቹን ያዘጋጁ።",
|
||||
activated: "የፈቃድ አይነቱ አሁን ማመልከቻዎችን ይቀበላል",
|
||||
deactivated: "የፈቃድ አይነቱ ለአዲስ ማመልከቻዎች ተዘግቷል",
|
||||
active: "ንቁ",
|
||||
inactive: "እንቅስቃሴ የሌለ",
|
||||
activate: "አንቃ",
|
||||
deactivate: "አሰናክል",
|
||||
activateTitle: "የፈቃድ አይነት አንቃ",
|
||||
deactivateTitle: "የፈቃድ አይነት አሰናክል",
|
||||
activateText: "{{name}} ለአመልካቾች እንደገና ይቀርባል።",
|
||||
deactivateText:
|
||||
"{{name}} ከአመልካች ካታሎግ ይጠፋል። በሂደት ላይ ያሉ ማመልከቻዎች ሳይነኩ ይቀጥላሉ።",
|
||||
toggleAria: "ይህ የፈቃድ አይነት ማመልከቻ መቀበል አለመቀበሉን ይቀያይሩ",
|
||||
keyHint: "ቋሚ መለያ፣ በትልቅ ፊደል እና ከስር መስመር ጋር። ማመልከቻዎች ከተፈጠሩ በኋላ ሊቀየር አይችልም።",
|
||||
prefix: "የምስክር ወረቀት ቁጥር ቅድመ ቅጥያ",
|
||||
prefixHint: "ለምሳሌ FF → FF-2026-000123",
|
||||
categoryHint: "አመልካቹ የሚያስስበት ቡድን።",
|
||||
familyHint: "የትኛው ክፍል እንደሚያስተዳድረው እና በየትኛው የፖርታል ካታሎግ እንደሚታይ ይወስናል።",
|
||||
fee: "የአዲስ ማመልከቻ ክፍያ",
|
||||
feeHint: "ክፍያ ከሌለው ባዶ ይተዉት።",
|
||||
currency: "ምንዛሪ",
|
||||
validity: "የአገልግሎት ጊዜ (በወራት)",
|
||||
issuesCertificate: "የምስክር ወረቀት ይሰጣል",
|
||||
renewalEnabled: "ሊታደስ የሚችል",
|
||||
inspectionRequired: "ምርመራ ያስፈልጋል",
|
||||
columns: {
|
||||
category: "ምድብ",
|
||||
family: "ቤተሰብ",
|
||||
prefix: "ቅድመ ቅጥያ",
|
||||
status: "ሁኔታ",
|
||||
actions: "እርምጃዎች",
|
||||
},
|
||||
family: {
|
||||
LOGISTICS_LICENSE: "የሎጂስቲክስ ፈቃድ",
|
||||
CERTIFICATE: "የባህርተኛ የምስክር ወረቀት",
|
||||
DOCUMENT: "የማንነት / ህጋዊ ሰነድ",
|
||||
},
|
||||
service: {
|
||||
LICENSE: "ፈቃድ",
|
||||
REGISTRATION: "ምዝገባ",
|
||||
},
|
||||
workflow: {
|
||||
STANDARD: "መደበኛ (ግምገማ → ምዘና → ምርመራ → ማጽደቅ)",
|
||||
REGISTRATION: "ምዝገባ (ግምገማ → ማጽደቅ)",
|
||||
},
|
||||
validation: {
|
||||
keyRequired: "ቁልፍ ያስፈልጋል",
|
||||
keyTooLong: "ቁልፍ ከ64 ቁምፊዎች መብለጥ የለበትም",
|
||||
keyFormat: "ፊደላት፣ አሃዞችና ከስር መስመር ብቻ ይጠቀሙ፣ ለምሳሌ PORT_AGENT",
|
||||
keyTaken: "በዚህ ቁልፍ የፈቃድ አይነት ቀድሞ አለ",
|
||||
prefixRequired: "የምስክር ወረቀት ቅድመ ቅጥያ ያስፈልጋል",
|
||||
prefixTooLong: "ቅድመ ቅጥያ ከ12 ቁምፊዎች መብለጥ የለበትም",
|
||||
currencyTooLong: "አጭር የምንዛሪ ኮድ ይጠቀሙ",
|
||||
validityRange: "የአገልግሎት ጊዜ በ6 እና 240 ወራት መካከል መሆን አለበት",
|
||||
},
|
||||
},
|
||||
|
||||
queue: {
|
||||
title: "የፈቃድ ማመልከቻዎች",
|
||||
|
||||
@@ -890,8 +890,44 @@ export const en = {
|
||||
configuration: {
|
||||
title: 'Configuration',
|
||||
licenseTypesTab: 'Licence Types',
|
||||
licenseTypes: {
|
||||
add: 'Add licence type',
|
||||
edit: 'Edit licence type',
|
||||
key: 'Key',
|
||||
keyHint:
|
||||
'Permanent identifier, e.g. CUSTOMS_BROKER. Cannot be changed once applications reference it.',
|
||||
keyInvalid: 'Upper-case letters, digits and underscores, 3–64 characters',
|
||||
category: 'Category',
|
||||
categoryHint:
|
||||
'Decides which applicants may apply and which officer positions can act on it.',
|
||||
familyKind: 'Kind',
|
||||
familyKindHint:
|
||||
'Licence, certificate or document. Drives the wording, the applicant catalogue and whether the queue shows a company.',
|
||||
prefix: 'Certificate prefix',
|
||||
prefixHint:
|
||||
'Front of every application and certificate number, e.g. CB → CB-2026-000042.',
|
||||
prefixInvalid: 'Required, at most 12 characters',
|
||||
status: 'Status',
|
||||
active: 'Active',
|
||||
inactive: 'Inactive',
|
||||
isActive: 'Visible to applicants',
|
||||
isActiveHint:
|
||||
'Leave off until the form and document requirements are configured.',
|
||||
activate: 'Activate',
|
||||
deactivate: 'Deactivate',
|
||||
activateTitle: 'Activate licence type',
|
||||
deactivateTitle: 'Deactivate licence type',
|
||||
activateText: '{{name}} will be offered to applicants again.',
|
||||
deactivateText:
|
||||
'{{name}} will disappear from the applicant catalogue. Applications already in progress continue unaffected.',
|
||||
activated: 'Licence type is now accepting applications',
|
||||
deactivated: 'Licence type is closed to new applications',
|
||||
noPermission: 'You do not have permission to create licence types.',
|
||||
nextStepsTitle: 'After creating a type',
|
||||
nextSteps:
|
||||
'Configure its form, document requirements and behaviour on Certificate requirements, its fees on Payment configuration, and its certificate design in the designer — then switch it active here.',
|
||||
},
|
||||
personalDocumentsTab: 'Personal Documents',
|
||||
licenseTypesTab: 'Licence types',
|
||||
departments: 'Departments',
|
||||
professions: 'Professions',
|
||||
departmentsList: 'Departments',
|
||||
@@ -926,70 +962,6 @@ export const en = {
|
||||
},
|
||||
},
|
||||
|
||||
licenseTypeConfig: {
|
||||
add: 'Add licence type',
|
||||
empty: 'No licence types yet',
|
||||
notice:
|
||||
'A new type starts empty. After creating it, set up its form and document slots under Certificate Requirements, and its fees under Payment Configuration.',
|
||||
goToRequirements: 'Certificate requirements',
|
||||
goToFees: 'Payment configuration',
|
||||
created: 'Licence type created. Configure its form, documents and fees next.',
|
||||
activated: 'Licence type is now accepting applications',
|
||||
deactivated: 'Licence type is closed to new applications',
|
||||
active: 'Active',
|
||||
inactive: 'Inactive',
|
||||
activate: 'Activate',
|
||||
deactivate: 'Deactivate',
|
||||
activateTitle: 'Activate licence type',
|
||||
deactivateTitle: 'Deactivate licence type',
|
||||
activateText: '{{name}} will be offered to applicants again.',
|
||||
deactivateText:
|
||||
'{{name}} will disappear from the applicant catalogue. Applications already in progress continue unaffected.',
|
||||
toggleAria: 'Toggle whether this licence type accepts applications',
|
||||
keyHint: 'Stable identifier, upper snake case. Cannot change once applications exist.',
|
||||
prefix: 'Certificate number prefix',
|
||||
prefixHint: 'e.g. FF → FF-2026-000123',
|
||||
categoryHint: 'The group the applicant browses by.',
|
||||
familyHint: 'Decides which desk owns it and which portal catalogue lists it.',
|
||||
fee: 'New application fee',
|
||||
feeHint: 'Leave blank for no charge.',
|
||||
currency: 'Currency',
|
||||
validity: 'Validity (months)',
|
||||
issuesCertificate: 'Issues a certificate',
|
||||
renewalEnabled: 'Renewable',
|
||||
inspectionRequired: 'Inspection required',
|
||||
columns: {
|
||||
category: 'Category',
|
||||
family: 'Family',
|
||||
prefix: 'Prefix',
|
||||
status: 'Status',
|
||||
actions: 'Actions',
|
||||
},
|
||||
family: {
|
||||
LOGISTICS_LICENSE: 'Logistics licence',
|
||||
CERTIFICATE: 'Seafarer certificate',
|
||||
DOCUMENT: 'Identity / statutory document',
|
||||
},
|
||||
service: {
|
||||
LICENSE: 'Licence',
|
||||
REGISTRATION: 'Registration',
|
||||
},
|
||||
workflow: {
|
||||
STANDARD: 'Standard (review → evaluation → inspection → approval)',
|
||||
REGISTRATION: 'Registration (review → approval)',
|
||||
},
|
||||
validation: {
|
||||
keyRequired: 'Key is required',
|
||||
keyTooLong: 'Key must be at most 64 characters',
|
||||
keyFormat: 'Use letters, digits and underscores, e.g. PORT_AGENT',
|
||||
keyTaken: 'A licence type with this key already exists',
|
||||
prefixRequired: 'Certificate prefix is required',
|
||||
prefixTooLong: 'Prefix must be at most 12 characters',
|
||||
currencyTooLong: 'Use a short currency code',
|
||||
validityRange: 'Validity must be between 6 and 240 months',
|
||||
},
|
||||
},
|
||||
|
||||
queue: {
|
||||
title: 'Licence applications',
|
||||
// {{family}} is "Certificate"/"Document"/"Licence" — used only on a
|
||||
|
||||
@@ -29,8 +29,6 @@ import type {
|
||||
DocumentDecision,
|
||||
DocumentReview,
|
||||
ExportResult,
|
||||
FamilyKind,
|
||||
LicenseCategory,
|
||||
LicenseTemplate,
|
||||
Paginated,
|
||||
PickupAppointment,
|
||||
@@ -113,28 +111,6 @@ const TAGS = [
|
||||
const listTag = (type: (typeof TAGS)[number]) => ({ type, id: 'LIST' }) as const;
|
||||
const itemTag = (type: (typeof TAGS)[number], id: string) => ({ type, id }) as const;
|
||||
|
||||
/** What `POST /license-types` accepts. Mirrors the server's create DTO. */
|
||||
export interface CreateLicenseTypeInput {
|
||||
key: string;
|
||||
name: { en: string; am: string };
|
||||
description?: { en: string; am: string };
|
||||
category?: LicenseCategory;
|
||||
familyKind?: FamilyKind;
|
||||
serviceKind?: ServiceKind;
|
||||
workflowProfile?: WorkflowProfile;
|
||||
certificatePrefix: string;
|
||||
feeNewApplication?: number;
|
||||
feeRenewal?: number;
|
||||
feeCurrency?: string;
|
||||
capitalThreshold?: number;
|
||||
validityMonths?: number;
|
||||
inspectionRequired?: boolean;
|
||||
issuesCertificate?: boolean;
|
||||
renewalEnabled?: boolean;
|
||||
sortOrder?: number;
|
||||
isActive?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* Typed licensing endpoints, shared by the portal and the backoffice.
|
||||
*
|
||||
@@ -311,18 +287,6 @@ export const licensingApi = baseApi
|
||||
error ? [] : [listTag('LicenseType'), itemTag('LicenseType', id)],
|
||||
}),
|
||||
|
||||
/**
|
||||
* Creates a licence type. The bare minimum a type needs to exist and
|
||||
* be classified; its form, documents, fees and behaviour are configured
|
||||
* afterwards on their own screens. The server upper-cases and trims the
|
||||
* key, refuses a taken one with 409 `license_type_key_taken`, and lints
|
||||
* a form schema if one is supplied.
|
||||
*/
|
||||
createLicenseType: builder.mutation<LicenseType, CreateLicenseTypeInput>({
|
||||
query: (body) => ({ url: '/license-types', method: 'POST', body }),
|
||||
invalidatesTags: (_r, error) => (error ? [] : [listTag('LicenseType')]),
|
||||
}),
|
||||
|
||||
/**
|
||||
* Opens or closes a type to new applications. Applications already in
|
||||
* flight hold the type by id and keep running; only the portal
|
||||
|
||||
Reference in New Issue
Block a user