Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Enum custom field UI #2210

Open
wants to merge 17 commits into
base: main
Choose a base branch
from
Open

Enum custom field UI #2210

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
26beb6c
Update ZetkinCustomField type and associated types to reflect new enu…
niklasva82 Sep 28, 2024
04b859b
Map enum value (key) to proper label in PersonDetailsCard
niklasva82 Sep 28, 2024
b0be7ed
Edit person enum field select box
niklasva82 Sep 29, 2024
43d4e6b
Import with enum fields
niklasva82 Oct 2, 2024
a2ffcdb
Fix code formatting.
niklasva82 Oct 2, 2024
d326a04
Add enum_text smart search
niklasva82 Oct 3, 2024
0a1d389
Add missing type fixes
niklasva82 Oct 3, 2024
4367150
Add mapping of enum choice keys to labels in view column. SimpleColum…
niklasva82 Oct 15, 2024
1d0dffb
Update enum_text to enum
niklasva82 Oct 17, 2024
e3e5469
Submit null instead of '' for empty enum value
niklasva82 Oct 17, 2024
31d681a
Implement cellToString for PersonFeildColumnType
niklasva82 Oct 17, 2024
9faecf9
Fix enum preview
niklasva82 Oct 17, 2024
2f136fe
Fix message
niklasva82 Oct 17, 2024
c6f88b5
Use CUSTOM_FIELD_TYPE
niklasva82 Oct 17, 2024
56adf2d
Separate DATE and ENUM conditionals in useColumn
niklasva82 Oct 18, 2024
660e657
Add mapping button in EnumConfigRow
niklasva82 Oct 18, 2024
d641dd6
Remove enumChoices from Option and instead load the custom fields in …
niklasva82 Oct 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions src/features/profile/components/EditPersonDialog/EditPersonFields.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
IconButton,
InputLabel,
MenuItem,
NativeSelect,

Check failure on line 10 in src/features/profile/components/EditPersonDialog/EditPersonFields.tsx

View workflow job for this annotation

GitHub Actions / lint / Test (18, ubuntu-latest) 

'NativeSelect' is defined but never used
Select,
} from '@mui/material';
import dayjs, { Dayjs } from 'dayjs';
Expand Down Expand Up @@ -221,6 +222,31 @@
value={fieldValues[field.slug]?.toString() ?? ''}
/>
);
} else if (field.type === CUSTOM_FIELD_TYPE.ENUM_TEXT) {
return (
<Box alignItems="flex-start" display="flex" flex={1}>
<FormControl fullWidth>
<InputLabel>{field.title}</InputLabel>
<Select
fullWidth
value={fieldValues[field.slug]?.toString() ?? ''}
onChange={(ev) => {

Check failure on line 233 in src/features/profile/components/EditPersonDialog/EditPersonFields.tsx

View workflow job for this annotation

GitHub Actions / lint / Test (18, ubuntu-latest) 

Props should be sorted alphabetically
onChange(field.slug, ev.target.value);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here we need to translate from "" to null.

}}
label={field.title}

Check failure on line 236 in src/features/profile/components/EditPersonDialog/EditPersonFields.tsx

View workflow job for this annotation

GitHub Actions / lint / Test (18, ubuntu-latest) 

Props should be sorted alphabetically
>
<MenuItem key="" value="">
<em>None</em>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missing internationalization here.

Comment on lines +244 to +245
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can using <em> like this be a bad idea? As far as I know, we don't usually use "normal HTML" in the middle MUI components like this.

Is it not possible to do this?

Suggested change
<MenuItem key="" value="">
<em>None</em>
<MenuItem key="" value="" sx={{ fontStyle: 'italic' }}>
<Msg id={/* message ID goes here */}/>

</MenuItem>
{field.enum_choices.map((c) => (
<MenuItem key={c.key} value={c.key}>
{c.label}
</MenuItem>
))}
</Select>
</FormControl>
</Box>
);
} else {
return (
<EditPersonField
Expand Down
5 changes: 5 additions & 0 deletions src/features/profile/components/PersonDetailsCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,11 @@ const PersonDetailsCard: React.FunctionComponent<{
value = (
<PersonDetailLink href={value as string}>{value}</PersonDetailLink>
);
} else if (value && field.type == 'enum_text') {
const enumItem = field.enum_choices.find((c) => c.key == value);
if (enumItem) {
value = enumItem.label;
}
}

return {
Expand Down
7 changes: 7 additions & 0 deletions src/utils/types/zetkin.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,13 +179,19 @@ export interface ZetkinPersonNativeFields {
export type ZetkinPerson = ZetkinPersonNativeFields &
Record<string, string | number | boolean | Record<string, unknown> | null>;

export interface EnumChoice {
key: string;
label: string;
}

export interface ZetkinCustomField {
id: number;
title: string;
slug: string;
description: string | null;
type: CUSTOM_FIELD_TYPE;
organization: Pick<ZetkinOrganization, 'id' | 'title'>;
enum_choices: EnumChoice[];
}

export interface ZetkinSession {
Expand Down Expand Up @@ -448,6 +454,7 @@ export enum CUSTOM_FIELD_TYPE {
DATE = 'date',
TEXT = 'text',
JSON = 'json',
ENUM_TEXT = 'enum_text',
richardolsson marked this conversation as resolved.
Show resolved Hide resolved
}

export interface ZetkinJourney {
Expand Down
Loading