Skip to content

Commit 1ce82bd

Browse files
authored
2695 Add pending suggestions to top of org edit page (#2812)
1 parent 9fdb043 commit 1ce82bd

2 files changed

Lines changed: 103 additions & 97 deletions

File tree

client/src/components/Admin/OrganizationEdit.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1031,7 +1031,7 @@ const OrganizationEdit = () => {
10311031
suggestions={stakeholderSuggestions}
10321032
editedSuggestions={editedSuggestions}
10331033
onEdit={handleSuggestionEdit}
1034-
showNewOnly={true}
1034+
showOpenOnly={true}
10351035
/>
10361036
<Stack direction="row" justifyContent="space-between">
10371037
<Typography component="h1" variant="h5">

client/src/components/Admin/OrganizationEdit/SuggestionHistory.tsx

Lines changed: 102 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ interface SuggestionHistoryProps {
1818
suggestions?: Suggestion[];
1919
editedSuggestions: EditedSuggestions;
2020
onEdit?: (id: number, changes: Partial<Suggestion>) => void;
21-
showNewOnly?: boolean;
21+
showOpenOnly?: boolean;
2222
confirmationErrors?: Record<string, string>;
2323
}
2424

@@ -29,12 +29,14 @@ function formatDate(dateStr?: string) {
2929
return date.toISOString().slice(0, 10);
3030
}
3131

32+
const OPEN_SUGGESTION_STATUS_IDS = [1, 2];
33+
3234
export default function SuggestionHistory({
3335
tabPage = 0,
3436
suggestions = [],
3537
editedSuggestions,
3638
onEdit,
37-
showNewOnly = false,
39+
showOpenOnly = false,
3840
}: SuggestionHistoryProps) {
3941
const handleInputChange = (
4042
id: number,
@@ -46,111 +48,115 @@ export default function SuggestionHistory({
4648

4749
const safeSuggestions = Array.isArray(suggestions) ? suggestions : [];
4850

49-
const filteredSuggestions = showNewOnly
51+
const filteredSuggestions = showOpenOnly
5052
? safeSuggestions.filter(
51-
(suggestion) => suggestion.suggestionStatusId === 1
53+
(suggestion) =>
54+
suggestion.suggestionStatusId !== undefined &&
55+
OPEN_SUGGESTION_STATUS_IDS.includes(suggestion.suggestionStatusId)
5256
)
5357
: safeSuggestions;
5458

55-
if (showNewOnly && filteredSuggestions.length === 0) return null;
59+
if (showOpenOnly && filteredSuggestions.length === 0) return null;
5660

57-
return (
58-
<TabPanel value={tabPage} index={showNewOnly ? -1 : 6}>
59-
<Stack spacing={3}>
60-
{filteredSuggestions.map((suggestion) => (
61-
<Paper
62-
key={suggestion.id}
63-
sx={(theme: any) => ({
64-
backgroundColor: theme.palette.primary.extralight,
65-
px: 4,
66-
py: 2,
67-
})}
61+
const content = (
62+
<Stack spacing={3}>
63+
{filteredSuggestions.map((suggestion) => (
64+
<Paper
65+
key={suggestion.id}
66+
sx={(theme: any) => ({
67+
backgroundColor: theme.palette.primary.extralight,
68+
px: 4,
69+
py: 2,
70+
})}
71+
>
72+
<Typography variant="subtitle1" gutterBottom>
73+
Suggestion ({formatDate(suggestion.createdDate)}
74+
{suggestion.tipsterName && <> | {suggestion.tipsterName}</>}
75+
{suggestion.tipsterEmail && <> | {suggestion.tipsterEmail}</>}
76+
{suggestion.tipsterPhone && <> | {suggestion.tipsterPhone}</>})
77+
</Typography>
78+
<Typography variant="body1" sx={{ mb: 1 }}>
79+
{suggestion.notes}
80+
</Typography>
81+
<Stack
82+
direction={{ xs: "column", sm: "row" }}
83+
spacing={2}
84+
alignItems="center"
6885
>
69-
<Typography variant="subtitle1" gutterBottom>
70-
Suggestion ({formatDate(suggestion.createdDate)}
71-
{suggestion.tipsterName && <> | {suggestion.tipsterName}</>}
72-
{suggestion.tipsterEmail && <> | {suggestion.tipsterEmail}</>}
73-
{suggestion.tipsterPhone && <> | {suggestion.tipsterPhone}</>})
74-
</Typography>
75-
<Typography variant="body1" sx={{ mb: 1 }}>
76-
{suggestion.notes}
77-
</Typography>
7886
<Stack
79-
direction={{ xs: "column", sm: "row" }}
87+
direction="row"
8088
spacing={2}
81-
alignItems="center"
89+
sx={{ mb: 1, width: "100%" }}
90+
flex={1}
8291
>
83-
<Stack
84-
direction="row"
85-
spacing={2}
86-
sx={{ mb: 1, width: "100%" }}
87-
flex={1}
92+
<InputLabel
93+
htmlFor={`suggestionAdminNotes-${suggestion.id}`}
94+
sx={{ minWidth: "fit-content" }}
8895
>
89-
<InputLabel
90-
htmlFor={`suggestionAdminNotes-${suggestion.id}`}
91-
sx={{ minWidth: "fit-content" }}
92-
>
93-
Note:
94-
</InputLabel>
95-
<Textarea
96-
placeholder="Admin Notes"
97-
id={`suggestionAdminNotes-${suggestion.id}`}
98-
name={`suggestionAdminNotes-${suggestion.id}`}
99-
fullWidth
100-
value={
101-
editedSuggestions[suggestion.id]?.adminNotes ??
102-
suggestion.adminNotes ??
103-
""
104-
}
105-
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
106-
handleInputChange(
107-
suggestion.id,
108-
"adminNotes",
109-
e.target.value
110-
)
111-
}
112-
/>
113-
</Stack>
114-
<Box sx={{ minWidth: 200 }}>
115-
<RadioGroup
116-
value={
117-
editedSuggestions[suggestion.id]?.suggestionStatusId ??
118-
suggestion.suggestionStatusId ??
119-
""
120-
}
121-
onChange={(e) =>
122-
handleInputChange(
123-
suggestion.id,
124-
"suggestionStatusId",
125-
Number(e.target.value)
126-
)
127-
}
128-
>
129-
{FILTERS.map((status: { id: number; name: string }) => (
130-
<FormControlLabel
131-
key={status.id}
132-
value={status.id}
133-
control={
134-
<Radio
135-
sx={(theme) => ({
136-
"&.Mui-checked": {
137-
color: theme.palette.secondary.main,
138-
},
139-
})}
140-
/>
141-
}
142-
label={status.name}
143-
/>
144-
))}
145-
</RadioGroup>
146-
</Box>
96+
Note:
97+
</InputLabel>
98+
<Textarea
99+
placeholder="Admin Notes"
100+
id={`suggestionAdminNotes-${suggestion.id}`}
101+
name={`suggestionAdminNotes-${suggestion.id}`}
102+
fullWidth
103+
value={
104+
editedSuggestions[suggestion.id]?.adminNotes ??
105+
suggestion.adminNotes ??
106+
""
107+
}
108+
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
109+
handleInputChange(suggestion.id, "adminNotes", e.target.value)
110+
}
111+
/>
147112
</Stack>
148-
</Paper>
149-
))}
150-
{filteredSuggestions.length === 0 && (
151-
<Typography>No suggestions found.</Typography>
152-
)}
153-
</Stack>
113+
<Box sx={{ minWidth: 200 }}>
114+
<RadioGroup
115+
value={
116+
editedSuggestions[suggestion.id]?.suggestionStatusId ??
117+
suggestion.suggestionStatusId ??
118+
""
119+
}
120+
onChange={(e) =>
121+
handleInputChange(
122+
suggestion.id,
123+
"suggestionStatusId",
124+
Number(e.target.value)
125+
)
126+
}
127+
>
128+
{FILTERS.map((status: { id: number; name: string }) => (
129+
<FormControlLabel
130+
key={status.id}
131+
value={status.id}
132+
control={
133+
<Radio
134+
sx={(theme) => ({
135+
"&.Mui-checked": {
136+
color: theme.palette.secondary.main,
137+
},
138+
})}
139+
/>
140+
}
141+
label={status.name}
142+
/>
143+
))}
144+
</RadioGroup>
145+
</Box>
146+
</Stack>
147+
</Paper>
148+
))}
149+
{filteredSuggestions.length === 0 && (
150+
<Typography>No suggestions found.</Typography>
151+
)}
152+
</Stack>
153+
);
154+
155+
if (showOpenOnly) return <Box sx={{ m: 3 }}>{content}</Box>;
156+
157+
return (
158+
<TabPanel value={tabPage} index={6}>
159+
{content}
154160
</TabPanel>
155161
);
156162
}

0 commit comments

Comments
 (0)