Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 | 2x 2x 2x 2x 2x 1x 2x 1x 2x 1x 2x 1x | import RegistrationTokenIcon from "@mui/icons-material/ConfirmationNumber";
import {
BooleanInput,
Create,
CreateProps,
DataTable,
DateField,
DateTimeInput,
Edit,
EditProps,
List,
ListProps,
maxValue,
number,
NumberField,
NumberInput,
regex,
ResourceProps,
SaveButton,
SimpleForm,
TextInput,
TextField,
Toolbar,
} from "react-admin";
import { DATE_FORMAT, dateFormatter, dateParser } from "../components/date";
const validateToken = [regex(/^[A-Za-z0-9._~-]{0,64}$/)];
const validateUsesAllowed = [number()];
const validateLength = [number(), maxValue(64)];
const registrationTokenFilters = [<BooleanInput source="valid" alwaysOn />];
export const RegistrationTokenList = (props: ListProps) => (
<List
{...props}
filters={registrationTokenFilters}
filterDefaultValues={{ valid: true }}
pagination={false}
perPage={500}
>
<DataTable rowClick="edit">
<DataTable.Col source="token" />
<DataTable.Col source="uses_allowed" field={NumberField} />
<DataTable.Col source="pending" field={NumberField} />
<DataTable.Col source="completed" field={NumberField} />
<DataTable.Col source="expiry_time">
<DateField source="expiry_time" showTime options={DATE_FORMAT} />
</DataTable.Col>
</DataTable>
</List>
);
export const RegistrationTokenCreate = (props: CreateProps) => (
<Create {...props} redirect="list">
<SimpleForm
toolbar={
<Toolbar>
{/* It is possible to create tokens per default without input. */}
<SaveButton alwaysEnable />
</Toolbar>
}
>
<TextInput source="token" autoComplete="off" validate={validateToken} resettable />
<NumberInput
source="length"
validate={validateLength}
helperText="resources.registration_tokens.helper.length"
step={1}
/>
<NumberInput source="uses_allowed" validate={validateUsesAllowed} step={1} />
<DateTimeInput source="expiry_time" parse={dateParser} format={dateFormatter} />
</SimpleForm>
</Create>
);
export const RegistrationTokenEdit = (props: EditProps) => (
<Edit {...props}>
<SimpleForm>
<TextInput source="token" disabled />
<NumberInput source="pending" disabled />
<NumberInput source="completed" disabled />
<NumberInput source="uses_allowed" validate={validateUsesAllowed} step={1} />
<DateTimeInput source="expiry_time" parse={dateParser} format={dateFormatter} />
</SimpleForm>
</Edit>
);
const resource = {
name: "registration_tokens",
icon: RegistrationTokenIcon,
list: RegistrationTokenList,
edit: RegistrationTokenEdit,
create: RegistrationTokenCreate,
recordRepresentation: (record: { token: string }) => record.token,
} satisfies ResourceProps;
export default resource;
|