Skip to content

Commit 9f33bcc

Browse files
colin969colin969
committed
fix: Fix remaining renderer eslint problems. Still a few non-blocking useEffect lint warns
1 parent edc0547 commit 9f33bcc

24 files changed

+617
-689
lines changed

‎src/renderer/components/CurateBox.tsx‎

Lines changed: 67 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -61,32 +61,28 @@ export function CurateBox(props: CurateBoxProps) {
6161

6262
const splitStatus = React.useMemo(() => props.curation.game.status ? props.curation.game.status.split(';').map(s => s.trim()).sort() : [], [props.curation.game.status]);
6363
const splitPlayMode = React.useMemo(() => props.curation.game.playMode ? props.curation.game.playMode.split(';').map(s => s.trim()).sort() : [], [props.curation.game.playMode]);
64-
65-
const sortedTags = React.useMemo(() => {
66-
const tags = props.curation.game.tags;
67-
if (tags) {
68-
return [...tags].sort((a, b) => {
69-
// Sort by category, then name secondarily
70-
if (a.category !== b.category) {
71-
const categoryA: TagCategory | undefined = props.tagCategories.find(c => c.name === a.category);
72-
const categoryB: TagCategory | undefined = props.tagCategories.find(c => c.name === b.category);
73-
if (!categoryA && !categoryB) {
74-
return a.name.toLowerCase().localeCompare(b.name);
75-
} else if (!categoryA) {
76-
return -1;
77-
} else if (!categoryB) {
78-
return 1;
79-
} else {
80-
return categoryA.name.toLowerCase().localeCompare(categoryB.name.toLowerCase());
81-
}
82-
} else {
64+
const tags = props.curation.game.tags;
65+
let sortedTags: Tag[] = [];
66+
if (tags) {
67+
sortedTags = [...tags].sort((a, b) => {
68+
// Sort by category, then name secondarily
69+
if (a.category !== b.category) {
70+
const categoryA: TagCategory | undefined = props.tagCategories.find(c => c.name === a.category);
71+
const categoryB: TagCategory | undefined = props.tagCategories.find(c => c.name === b.category);
72+
if (!categoryA && !categoryB) {
8373
return a.name.toLowerCase().localeCompare(b.name);
74+
} else if (!categoryA) {
75+
return -1;
76+
} else if (!categoryB) {
77+
return 1;
78+
} else {
79+
return categoryA.name.toLowerCase().localeCompare(categoryB.name.toLowerCase());
8480
}
85-
});
86-
} else {
87-
return [];
88-
}
89-
}, [props.curation.game.tags]);
81+
} else {
82+
return a.name.toLowerCase().localeCompare(b.name);
83+
}
84+
});
85+
}
9086

9187
const onSetThumbnail = useAddImageCallback(CurationImageEnum.THUMBNAIL, props.curation);
9288
const onSetScreenshot = useAddImageCallback(CurationImageEnum.SCREENSHOT, props.curation);
@@ -95,28 +91,24 @@ export function CurateBox(props: CurateBoxProps) {
9591
const onDropThumbnail = useDropImageCallback('logo.png', props.curation, strings.dialog);
9692
const onDropScreenshot = useDropImageCallback('ss.png', props.curation, strings.dialog);
9793

98-
const thumbnailPath = React.useMemo(() => {
99-
return props.curation.thumbnail.exists ? `${getCurationURL(props.curation.folder)}/logo.png?v` + props.curation.thumbnail.version : undefined;
100-
}, [props.curation.thumbnail]);
101-
const screenshotPath = React.useMemo(() => {
102-
return props.curation.screenshot.exists ? `${getCurationURL(props.curation.folder)}/ss.png?v` + props.curation.screenshot.version : undefined;
103-
}, [props.curation.screenshot]);
94+
const thumbnailPath = props.curation.thumbnail.exists ? `${getCurationURL(props.curation.folder)}/logo.png?v` + props.curation.thumbnail.version : undefined;
95+
const screenshotPath = props.curation.screenshot.exists ? `${getCurationURL(props.curation.folder)}/ss.png?v` + props.curation.screenshot.version : undefined;
10496

10597
const onNewAddApp = useCreateAddAppCallback('normal', props.curation.folder, dispatch);
10698
const onAddExtras = useCreateAddAppCallback('extras', props.curation.folder, dispatch);
10799
const onAddMessage = useCreateAddAppCallback('message', props.curation.folder, dispatch);
108100

109-
const onAddStatus = React.useCallback((value: string) => {
101+
const onAddStatus = (value: string) => {
110102
const newSplits = [ ...splitStatus ];
111103
newSplits.push(value);
112104
dispatch(editCurationMeta({
113105
folder,
114106
property: 'status',
115107
value: Array.from(new Set(newSplits.sort())).join('; ')
116108
}));
117-
}, [props.curation.folder, splitStatus, dispatch]);
109+
};
118110

119-
const onRemoveStatus = React.useCallback((index: number) => {
111+
const onRemoveStatus = (index: number) => {
120112
const newSplits = [ ...splitStatus ];
121113
newSplits.splice(index, 1);
122114
const newStatus = newSplits.join('; ');
@@ -125,19 +117,19 @@ export function CurateBox(props: CurateBoxProps) {
125117
property: 'status',
126118
value: newStatus
127119
}));
128-
}, [props.curation.folder, props.curation.game.status, splitStatus, dispatch]);
120+
};
129121

130-
const onAddPlayMode = React.useCallback((value: string) => {
122+
const onAddPlayMode = (value: string) => {
131123
const newSplits = [ ...splitPlayMode ];
132124
newSplits.push(value);
133125
dispatch(editCurationMeta({
134126
folder,
135127
property: 'playMode',
136128
value: Array.from(new Set(newSplits.sort())).join('; ')
137129
}));
138-
}, [props.curation.folder, props.curation.game.playMode, splitPlayMode, dispatch]);
130+
};
139131

140-
const onRemovePlayMode = React.useCallback((index: number) => {
132+
const onRemovePlayMode = (index: number) => {
141133
const newSplits = [ ...splitPlayMode ];
142134
newSplits.splice(index, 1);
143135
const newPlayMode = newSplits.join('; ');
@@ -146,17 +138,17 @@ export function CurateBox(props: CurateBoxProps) {
146138
property: 'playMode',
147139
value: newPlayMode
148140
}));
149-
}, [props.curation.folder, props.curation.game.playMode, splitPlayMode, dispatch]);
141+
};
150142

151-
const onTagChange = React.useCallback((event: React.ChangeEvent<InputElement>): void => {
143+
const onTagChange = (event: React.ChangeEvent<InputElement>): void => {
152144
props.onTagTextChange(event.currentTarget.value);
153-
}, [props.onTagTextChange]);
145+
};
154146

155-
const onPlatformChange = React.useCallback((event: React.ChangeEvent<InputElement>): void => {
147+
const onPlatformChange = (event: React.ChangeEvent<InputElement>): void => {
156148
props.onPlatformTextChange(event.currentTarget.value);
157-
}, [props.onPlatformTextChange]);
149+
};
158150

159-
const onTagKeyDown = React.useCallback((event: React.KeyboardEvent<InputElement>): void => {
151+
const onTagKeyDown = (event: React.KeyboardEvent<InputElement>): void => {
160152
if (event.defaultPrevented) { return; }
161153

162154
if (event.key === 'Enter') {
@@ -167,9 +159,9 @@ export function CurateBox(props: CurateBoxProps) {
167159
}
168160
}
169161
}
170-
}, []);
162+
};
171163

172-
const onPlatformKeyDown = React.useCallback((event: React.KeyboardEvent<InputElement>): void => {
164+
const onPlatformKeyDown = (event: React.KeyboardEvent<InputElement>): void => {
173165
if (event.defaultPrevented) { return; }
174166

175167
if (event.key === 'Enter') {
@@ -180,9 +172,9 @@ export function CurateBox(props: CurateBoxProps) {
180172
}
181173
}
182174
}
183-
}, []);
175+
};
184176

185-
const onAddTag = React.useCallback((tag: Tag) => {
177+
const onAddTag = (tag: Tag) => {
186178
const tags = props.curation.game.tags || [];
187179
if (!tags.find(t => t.id === tag.id)) {
188180
dispatch(addTag({
@@ -191,9 +183,9 @@ export function CurateBox(props: CurateBoxProps) {
191183
}));
192184
}
193185
props.onTagTextChange('');
194-
}, [props.curation.folder, props.curation.game.tags]);
186+
};
195187

196-
const onAddPlatform = React.useCallback((platform: Platform) => {
188+
const onAddPlatform = (platform: Platform) => {
197189
const platforms = props.curation.game.platforms || [];
198190
if (!platforms.find(p => p.id === platform.id)) {
199191
dispatch(addPlatform({
@@ -203,29 +195,29 @@ export function CurateBox(props: CurateBoxProps) {
203195
}));
204196
}
205197
props.onPlatformTextChange('');
206-
}, [props.curation.folder, props.curation.game.platforms]);
198+
};
207199

208-
const onRemoveTag = React.useCallback((tagId: number) => {
200+
const onRemoveTag = (tagId: number) => {
209201
dispatch(removeTag({
210202
folder,
211203
tagId
212204
}));
213-
}, [props.curation.folder, props.curation.game.tags]);
205+
};
214206

215-
const onRemovePlatform = React.useCallback((platformId) => {
207+
const onRemovePlatform = (platformId: number) => {
216208
dispatch(removePlatform({
217209
folder,
218210
platformId,
219211
platformAppPaths: props.platformAppPaths
220212
}));
221-
}, [props.curation.folder, props.curation.game.platforms]);
213+
};
222214

223-
const onToggleContentNodeView = React.useCallback((tree: string[]) => {
215+
const onToggleContentNodeView = (tree: string[]) => {
224216
dispatch(toggleContentNodeView({
225217
folder,
226218
tree
227219
}));
228-
}, [props.curation.folder, props.curation.contents]);
220+
};
229221

230222
const onContentTreeNodeMenuFactory = (node: ContentTreeNode, tree: string[]) => () => {
231223
const contextButtons: MenuItemConstructorOptions[] = [{
@@ -303,7 +295,7 @@ export function CurateBox(props: CurateBoxProps) {
303295
}
304296
}
305297

306-
const renderContentTree = React.useMemo(() => {
298+
const renderContentTree = () => {
307299
// Extract first string from launch command via regex
308300
let launchPath: string | undefined = undefined;
309301
if (props.curation.game.launchCommand) {
@@ -342,43 +334,43 @@ export function CurateBox(props: CurateBoxProps) {
342334
{render}
343335
</div>
344336
);
345-
}, [props.curation.contents, props.curation.game.launchCommand]);
337+
};
346338

347-
const renderTagIcon = React.useCallback((tag: Tag) => {
339+
const renderTagIcon = (tag: Tag) => {
348340
const category = props.tagCategories.find(c => c.name === tag.category);
349341
return (
350342
<OpenIcon
351343
className='curate-tag__icon'
352344
color={category ? category.color : '#FFFFFF'}
353345
icon='tag'/>
354346
);
355-
}, []);
347+
};
356348

357-
const renderPlatformIconSugg = React.useCallback((platformSugg: TagSuggestion) => {
349+
const renderPlatformIconSugg = (platformSugg: TagSuggestion) => {
358350
const iconUrl = getPlatformIconURL(platformSugg.name, props.logoVersion);
359351
return (
360352
<div
361353
className='curate-tag__icon'
362354
style={{ backgroundImage: `url(${iconUrl})` }} />
363355
);
364-
}, []);
356+
};
365357

366-
const renderPlatformIcon = React.useCallback((platform: Platform) => {
358+
const renderPlatformIcon = (platform: Platform) => {
367359
const iconUrl = getPlatformIconURL(platform.name, props.logoVersion);
368360
return (
369361
<div
370362
className='curate-tag__icon'
371363
style={{ backgroundImage: `url(${iconUrl})` }} />
372364
);
373-
}, []);
365+
};
374366

375-
const onChangePrimaryPlatform = React.useCallback((newPrimary: string) => {
367+
const onChangePrimaryPlatform = (newPrimary: string) => {
376368
dispatch(setPrimaryPlatform({
377369
folder,
378370
value: newPrimary,
379371
platformAppPaths: props.platformAppPaths
380372
}));
381-
}, [props.curation.folder]);
373+
};
382374

383375
const addAppBoxes = (
384376
<table className="curate-box-table">
@@ -676,7 +668,7 @@ export function CurateBox(props: CurateBoxProps) {
676668
{strings.curate.contentFiles + ': '}
677669
</div>
678670
<pre className='curate-box-files__body simple-scroll'>
679-
{renderContentTree}
671+
{renderContentTree()}
680672
</pre>
681673
</div>
682674
<hr />
@@ -707,15 +699,15 @@ export function CurateBox(props: CurateBoxProps) {
707699
}
708700

709701
function useAddImageCallback(type: CurationImageEnum, curation: LoadedCuration | undefined): (data: ArrayBuffer) => void {
710-
return React.useCallback(async (data: ArrayBuffer) => {
702+
return async (data: ArrayBuffer) => {
711703
if (curation) {
712704
const suffix = type === CurationImageEnum.THUMBNAIL ? 'logo.png' : 'ss.png';
713705
const res = await axios.post(`${getCurationURL(curation.folder)}/${suffix}`, data);
714706
if (res.status !== 200) {
715707
alert(`ERROR: Server Returned ${res.status} - ${res.statusText}`);
716708
}
717709
}
718-
}, [curation && curation.folder]);
710+
};
719711
}
720712

721713
/**
@@ -725,15 +717,15 @@ function useAddImageCallback(type: CurationImageEnum, curation: LoadedCuration |
725717
* @param curation Curation to delete it from.
726718
*/
727719
function useRemoveImageCallback(type: CurationImageEnum, curation: LoadedCuration | undefined): () => Promise<void> {
728-
return React.useCallback(async () => {
720+
return async () => {
729721
if (curation) {
730722
return window.Shared.back.request(BackIn.CURATE_EDIT_REMOVE_IMAGE, curation.folder, type);
731723
}
732-
}, [curation && curation.folder]);
724+
};
733725
}
734726

735727
function useDropImageCallback(filename: 'logo.png' | 'ss.png', curation: CurationState, strings: LangContainer['dialog']) {
736-
return React.useCallback(async (event: React.DragEvent) => {
728+
return async (event: React.DragEvent) => {
737729
const files = event.dataTransfer.files;
738730

739731
if (curation && !curation.locked && files.length > 0) {
@@ -743,16 +735,16 @@ function useDropImageCallback(filename: 'logo.png' | 'ss.png', curation: Curatio
743735
alert(strings.mustBePngImage);
744736
}
745737
}
746-
}, [curation && curation.folder, strings]);
738+
};
747739
}
748740

749741
function useCreateAddAppCallback(type: AddAppType, folder: string, dispatch: Dispatch) {
750-
return React.useCallback(() => {
742+
return () => {
751743
dispatch(createAddApp({
752744
folder,
753745
addAppType: type
754746
}));
755-
}, [dispatch, folder]);
747+
};
756748
}
757749

758750
function createAppPathDropdownItems(platformAppPaths: PlatformAppPathSuggestions, currentPlatform?: string): DropdownItem[] {

‎src/renderer/components/CurateBoxAddApp.tsx‎

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
1+
import { editAddApp, removeAddApp } from '@renderer/store/curate/slice';
12
import { BackIn } from '@shared/back/types';
23
import { AddAppCuration, AddAppCurationMeta } from '@shared/curate/types';
4+
import { Platform } from 'flashpoint-launcher';
35
import * as React from 'react';
4-
import { useCallback } from 'react';
6+
import { useDispatch } from 'react-redux';
7+
import { Dispatch } from 'redux';
58
import { LangContext } from '../util/lang';
69
import { CurateBoxRow } from './CurateBoxRow';
710
import { InputField } from './InputField';
811
import { SimpleButton } from './SimpleButton';
9-
import { Platform } from 'flashpoint-launcher';
10-
import { useDispatch } from 'react-redux';
11-
import { Dispatch } from 'redux';
12-
import { editAddApp, removeAddApp } from '@renderer/store/curate/slice';
1312

1413
export type CurateBoxAddAppProps = {
1514
/** Folder of the curation the displayed additional application belongs to. */
@@ -54,22 +53,22 @@ export function CurateBoxAddApp(props: CurateBoxAddAppProps) {
5453
break;
5554
}
5655
// Callback for the "remove" button
57-
const onRemove = useCallback(() => {
56+
const onRemove = () => {
5857
dispatch(removeAddApp({
5958
folder,
6059
key
6160
}));
62-
}, [props.folder, props.addApp.key, dispatch]);
61+
};
6362
// Callback for the "run" button
64-
const onRun = useCallback(() => {
63+
const onRun = () => {
6564
return window.Shared.back.request(BackIn.LAUNCH_CURATION_ADDAPP, {
6665
folder: props.folder,
6766
addApp: props.addApp,
6867
platforms: props.platforms,
6968
symlinkCurationContent: props.symlinkCurationContent,
7069
override: null,
7170
});
72-
}, [props.addApp && props.folder, props.symlinkCurationContent, props.platforms]);
71+
};
7372
// Render
7473
return (
7574
<>
@@ -138,7 +137,7 @@ type InputElementOnChangeEvent = {
138137
* @param dispatch Curate action dispatcher.
139138
*/
140139
function useOnInputChange(property: keyof AddAppCurationMeta, key: string, folder: string, dispatch: Dispatch<any>) {
141-
return useCallback((event: InputElementOnChangeEvent) => {
140+
return (event: InputElementOnChangeEvent) => {
142141
if (key !== undefined) {
143142
dispatch(editAddApp({
144143
folder,
@@ -147,5 +146,5 @@ function useOnInputChange(property: keyof AddAppCurationMeta, key: string, folde
147146
value: event.currentTarget.value
148147
}));
149148
}
150-
}, [dispatch, key]);
149+
};
151150
}

0 commit comments

Comments
 (0)