Skip to content

Commit 4b47465

Browse files
committed
fixup! fix(clean-up): code clean up
1 parent 9d7d783 commit 4b47465

File tree

16 files changed

+127
-95
lines changed

16 files changed

+127
-95
lines changed

app/root/config/routes.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,14 +86,14 @@ const highlight: RouteConfig = {
8686
visibility: 'is-authenticated',
8787
};
8888

89-
const addHighlight: RouteConfig = {
89+
const editHighlight: RouteConfig = {
9090
index: true,
9191
path: 'highlights/:id/edit',
9292
load: () => import('#views/Highlight/HighlightForm'),
9393
visibility: 'is-authenticated',
9494
};
9595

96-
const editHighlight: RouteConfig = {
96+
const addHighlight: RouteConfig = {
9797
index: true,
9898
path: 'highlights/add',
9999
load: () => import('#views/Highlight/HighlightForm'),

app/views/Blog/BlogForm/index.tsx

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ import {
2424
import {
2525
createSubmitHandler,
2626
getErrorObject,
27+
getErrorString,
2728
ObjectSchema,
2829
PartialForm,
2930
removeNull,
@@ -103,7 +104,7 @@ function BlogForm() {
103104

104105
const navigate = useRouting();
105106
const [{ data, fetching: blogDetailFetch }] = useBlogDetailQueryQuery({
106-
variables: { id: id || '' }, pause: !id,
107+
variables: { id: (id ?? '') }, pause: !id,
107108
});
108109
const [{ data: departmentAndDirective }] = useDepartmentAndDirectiveQuery();
109110
const [{ fetching: createPending }, createBlogMutate] = useCreateBlogMutation();
@@ -250,14 +251,14 @@ function BlogForm() {
250251
</Activity>
251252
<InputSection
252253
title="Title"
253-
description="Enter the title name of the Blog"
254+
description="Enter the title of the Blog"
254255
withAsteriskOnTitle
255256
>
256257
<TextInput
257258
name="title"
258259
autoFocus
259260
value={value.title}
260-
error={error?.title as string}
261+
error={error?.title}
261262
onChange={setFieldValue}
262263
placeholder="title"
263264
/>
@@ -272,7 +273,7 @@ function BlogForm() {
272273
value={value.publishedDate}
273274
onChange={setFieldValue}
274275
placeholder="Select Date"
275-
error={error?.publishedDate as string}
276+
error={getErrorString(error?.publishedDate)}
276277
/>
277278
</InputSection>
278279
<InputSection
@@ -284,7 +285,7 @@ function BlogForm() {
284285
name="author"
285286
value={value.author}
286287
onChange={setFieldValue}
287-
error={error?.author as string}
288+
error={error?.author}
288289
placeholder="author"
289290
/>
290291
</InputSection>
@@ -297,7 +298,7 @@ function BlogForm() {
297298
name="coverImage"
298299
onChange={setFieldValue}
299300
value={value.coverImage}
300-
error={error?.coverImage as string}
301+
error={getErrorString(error?.coverImage)}
301302
/>
302303
</InputSection>
303304
<InputSection

app/views/Department/DepartmentForm/index.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ function DepartmentForm() {
8282
const alert = useAlert();
8383

8484
const [{ data, fetching: departmentDetailFetch }] = useDepartmentDetailQuery({
85-
variables: { id: id || '' }, pause: !id,
85+
variables: { id: (id ?? '') }, pause: !id,
8686
});
8787
const [{ data: directive }] = useDirectiveQuery();
8888
const [{ fetching: createPending }, createDepartmentMutate] = useCreateDepartmentMutation();
@@ -186,28 +186,28 @@ function DepartmentForm() {
186186
</Activity>
187187
<InputSection
188188
title="Title"
189-
description="Enter the title name of the Department"
189+
description="Enter the title of the Department"
190190
withAsteriskOnTitle
191191
>
192192
<TextInput
193193
name="title"
194194
value={value.title}
195195
autoFocus
196-
error={error?.title as string}
196+
error={error?.title}
197197
onChange={setFieldValue}
198198
placeholder="title"
199199
/>
200200
</InputSection>
201201
<InputSection
202-
title="Department"
202+
title="Description"
203203
description="Write a short description about the roles and responsibilities of the department"
204204
withAsteriskOnTitle
205205
>
206206
<TextArea
207-
name="department"
207+
name="description"
208208
value={value.description}
209209
placeholder="description"
210-
error={error?.description as string}
210+
error={error?.description}
211211
onChange={(val) => setFieldValue(val, 'description')}
212212
/>
213213
</InputSection>
@@ -221,7 +221,7 @@ function DepartmentForm() {
221221
placeholder="contact person name"
222222
value={value.contactPersonName}
223223
onChange={setFieldValue}
224-
error={error?.contactPersonName as string}
224+
error={error?.contactPersonName}
225225
/>
226226
</InputSection>
227227
<InputSection

app/views/FAQs/FAQsForm/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ function FAQsForm() {
6666
const alert = useAlert();
6767

6868
const [{ data, fetching: faqDetailFetch }] = useFaqDetailQuery({
69-
variables: { id: id || '' }, pause: !id,
69+
variables: { id: (id ?? '') }, pause: !id,
7070
});
7171
const [{ fetching: createPending }, createFaqMutate] = useCreateFaqMutation();
7272
const [{ fetching: updatePending }, updateFaqMutate] = useUpdateFaqMutation();
@@ -170,7 +170,7 @@ function FAQsForm() {
170170
<TextArea
171171
name="question"
172172
value={value.question}
173-
error={error?.question as string}
173+
error={error?.question}
174174
onChange={setFieldValue}
175175
placeholder="question"
176176
autoFocus
@@ -185,7 +185,7 @@ function FAQsForm() {
185185
name="answer"
186186
value={value.answer}
187187
onChange={setFieldValue}
188-
error={error?.answer as string}
188+
error={error?.answer}
189189
placeholder="answer"
190190
/>
191191
</InputSection>

app/views/Highlight/HighlightForm/actionLinkInput.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {
44
ListView,
55
TextInput,
66
} from '@ifrc-go/ui';
7+
import { randomString } from '@togglecorp/fujs';
78
import {
89
Error,
910
getErrorObject,
@@ -20,16 +21,18 @@ interface ActionLinkFormValue extends ActionLinkType {
2021
clientId: string;
2122
}
2223

24+
type PartialActionLinkForm = PartialForm<ActionLinkFormValue, 'clientId'>;
25+
2326
interface ActionInputProps {
24-
value: PartialForm<ActionLinkFormValue>;
27+
value: PartialActionLinkForm;
2528
error: Error<ActionLinkFormValue> | undefined;
26-
onChange: (value: SetValueArg<PartialForm<ActionLinkFormValue>>, index: number) => void;
29+
onChange: (value: SetValueArg<PartialActionLinkForm>, index: number) => void;
2730
onRemove: (index: number) => void;
2831
index: number;
2932

3033
}
3134

32-
const defaultActionLinkValue: PartialForm<ActionLinkFormValue> = { clientId: '' };
35+
const defaultActionLinkValue: PartialActionLinkForm = { clientId: randomString() };
3336

3437
function ActionLinkInputComponent(props: ActionInputProps) {
3538
const {
@@ -50,13 +53,13 @@ function ActionLinkInputComponent(props: ActionInputProps) {
5053
name="url"
5154
value={value.url ?? ''}
5255
placeholder="URL"
53-
error={error?.url as string}
56+
error={error?.url}
5457
onChange={onFieldChange}
5558
/>
5659
<TextInput
5760
name="label"
5861
value={value.label ?? ''}
59-
error={error?.label as string}
62+
error={error?.label}
6063
placeholder="Label"
6164
onChange={onFieldChange}
6265
/>

app/views/Highlight/HighlightForm/index.tsx

Lines changed: 25 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import {
2323
ArraySchema,
2424
createSubmitHandler,
2525
getErrorObject,
26+
getErrorString,
2627
ObjectSchema,
2728
PartialForm,
2829
removeNull,
@@ -52,16 +53,19 @@ import ActionLinkInputComponent from './actionLinkInput';
5253
interface ActionLinkFormValue extends ActionLinkType {
5354
clientId: string;
5455
}
55-
type PartialFormType = Omit<PartialForm<HighlightCreateInput>, 'actionLinks'> & {
56-
actionLinks?: PartialForm<ActionLinkFormValue>[];
56+
57+
type PartialActionLinkForm = PartialForm<ActionLinkFormValue, 'clientId'>;
58+
59+
type PartialFormType = Omit<PartialForm<HighlightCreateInput>, 'actionLinks'> &
60+
{ actionLinks?: PartialActionLinkForm[];
5761
};
5862

5963
type FormSchema = ObjectSchema<PartialFormType>;
6064
type FormSchemaFields = ReturnType<FormSchema['fields']>;
6165

62-
type ActionLinkSchema = ObjectSchema<PartialForm<ActionLinkFormValue>, PartialFormType>;
66+
type ActionLinkSchema = ObjectSchema<PartialActionLinkForm, PartialFormType>;
6367
type ActionLinkSchemaFields = ReturnType<ActionLinkSchema['fields']>;
64-
type ActionLinksSchema = ArraySchema<PartialForm<ActionLinkFormValue>, PartialFormType>;
68+
type ActionLinksSchema = ArraySchema<PartialActionLinkForm, PartialFormType>;
6569
type ActionLinksSchemaMember = ReturnType<ActionLinksSchema['member']>;
6670

6771
const HighlightSchema: FormSchema = {
@@ -78,10 +82,10 @@ const HighlightSchema: FormSchema = {
7882
required: true,
7983
},
8084
actionLinks: {
81-
keySelector: (col) => col.clientId ?? '',
85+
keySelector: (col) => col.clientId,
8286
member: (): ActionLinksSchemaMember => ({
8387
fields: (): ActionLinkSchemaFields => ({
84-
clientId: {},
88+
clientId: { required: true },
8589
id: {},
8690
label: {
8791
required: true,
@@ -102,17 +106,15 @@ const HighlightSchema: FormSchema = {
102106
}),
103107
};
104108

105-
const defaultEditFormValue: PartialFormType = {
106-
actionLinks: [{ clientId: randomString() }],
107-
};
109+
const defaultEditFormValue: PartialFormType = {};
108110

109111
function HighlightForm() {
110112
const { id } = useParams();
111113
const navigate = useRouting();
112114
const alert = useAlert();
113115

114116
const [{ data, fetching: highlightDetailFetch }] = useHighlightDetailQuery({
115-
variables: { id: id || '' }, pause: !id,
117+
variables: { id: (id ?? '') }, pause: !id,
116118
});
117119
const [{ fetching: createPending }, createHighlightMutate] = useCreateHighlightMutation();
118120
const [{ fetching: updatePending }, updateHighlightMutate] = useUpdateHighlightMutation();
@@ -132,7 +134,7 @@ function HighlightForm() {
132134
const {
133135
setValue: onActionLinkChange,
134136
removeValue: onActionLinkRemove,
135-
} = useFormArray<'actionLinks', PartialForm<ActionLinkFormValue>>('actionLinks', setFieldValue);
137+
} = useFormArray<'actionLinks', PartialActionLinkForm>('actionLinks', setFieldValue);
136138

137139
const handleMutation = useCallback(async (mutationData: PartialFormType) => {
138140
const redirectPath = 'highlight';
@@ -215,10 +217,16 @@ function HighlightForm() {
215217
}
216218
const {
217219
image,
220+
actionLinks,
218221
...other
219222
} = removeNull(data.highlight);
220223

221-
setValue({ ...other });
224+
const actionLinksWithClientId = (actionLinks ?? []).map((link) => ({
225+
...link,
226+
clientId: randomString(),
227+
}));
228+
229+
setValue({ ...other, actionLinks: actionLinksWithClientId });
222230

223231
if (image) {
224232
urlToFile(image.url, image.name).then((file) => {
@@ -233,12 +241,12 @@ function HighlightForm() {
233241
const handleCollectionAdd = useCallback(
234242
() => {
235243
const clientId = randomString();
236-
const newActionLink: PartialForm<ActionLinkFormValue> = {
244+
const newActionLink: PartialActionLinkForm = {
237245
clientId,
238246
};
239247

240248
setFieldValue(
241-
(oldValue: PartialForm<ActionLinkFormValue>[] | undefined) => (
249+
(oldValue: PartialActionLinkForm[] | undefined) => (
242250
[...(oldValue ?? []), newActionLink]
243251
),
244252
'actionLinks',
@@ -287,7 +295,7 @@ function HighlightForm() {
287295
name="heading"
288296
autoFocus
289297
value={value.heading}
290-
error={error?.heading as string}
298+
error={error?.heading}
291299
onChange={setFieldValue}
292300
placeholder="heading"
293301
/>
@@ -300,7 +308,7 @@ function HighlightForm() {
300308
<TextArea
301309
name="description"
302310
value={value.description}
303-
error={error?.description as string}
311+
error={error?.description}
304312
onChange={setFieldValue}
305313
placeholder="description"
306314

@@ -327,7 +335,7 @@ function HighlightForm() {
327335
name="image"
328336
onChange={setFieldValue}
329337
value={value.image}
330-
error={error?.image as string}
338+
error={getErrorString(error?.image)}
331339
/>
332340
</InputSection>
333341
<InputSection

app/views/News/NewsForm/index.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import {
2323
import {
2424
createSubmitHandler,
2525
getErrorObject,
26+
getErrorString,
2627
ObjectSchema,
2728
PartialForm,
2829
removeNull,
@@ -98,7 +99,7 @@ function NewsForm() {
9899
const [{ data: directives }] = useDirectiveQuery();
99100

100101
const [{ data, fetching: newsDetailFetch }] = useNewsDetailQuery({
101-
variables: { id: id || '' }, pause: !id,
102+
variables: { id: (id ?? '') }, pause: !id,
102103
});
103104
const [{ fetching: createPending }, createNewsMutate] = useCreateNewsMutation();
104105
const [{ fetching: updatePending }, updateNewsMutate] = useUpdateNewsMutation();
@@ -246,7 +247,7 @@ function NewsForm() {
246247
<TextInput
247248
name="title"
248249
value={value.title}
249-
error={error?.title as string}
250+
error={error?.title}
250251
onChange={setFieldValue}
251252
autoFocus
252253
placeholder="title"
@@ -262,7 +263,7 @@ function NewsForm() {
262263
value={value.publishedDate}
263264
onChange={setFieldValue}
264265
placeholder="Select Date"
265-
error={error?.publishedDate as string}
266+
error={getErrorString(error?.publishedDate)}
266267
/>
267268
</InputSection>
268269
<InputSection
@@ -289,7 +290,7 @@ function NewsForm() {
289290
name="coverImage"
290291
onChange={setFieldValue}
291292
value={value.coverImage}
292-
error={error?.coverImage as string}
293+
error={getErrorString(error?.coverImage)}
293294
/>
294295
</InputSection>
295296
<InputSection
@@ -301,7 +302,7 @@ function NewsForm() {
301302
name="file"
302303
onChange={setFieldValue}
303304
value={value.file}
304-
error={error?.file as string}
305+
error={getErrorString(error?.file)}
305306
/>
306307
</InputSection>
307308
<Activity mode={value.slug ? 'visible' : 'hidden'}>

0 commit comments

Comments
 (0)