Skip to content

Commit fa8f4e2

Browse files
committed
fix console errors
1 parent a6b023f commit fa8f4e2

File tree

7 files changed

+62
-36
lines changed

7 files changed

+62
-36
lines changed

apps/sensenet/src/components/IconFromPath.tsx

Lines changed: 20 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -6,35 +6,46 @@ const IconFromPath = ({ path, options }: { path: string; options: IconOptions })
66
const [icon, setIcon] = useState<string | null>(null)
77

88
useEffect(() => {
9+
const controller = new AbortController()
10+
const { signal } = controller
11+
912
const fetchIcon = async () => {
1013
const imageUrl = PathHelper.joinPaths(options.repo.configuration.repositoryUrl, path)
1114

1215
if (path.endsWith('.svg')) {
1316
try {
14-
const response = await options.repo.fetch(imageUrl, { cache: 'force-cache' })
15-
if (!response.ok) {
16-
return
17-
}
17+
const response = await options.repo.fetch(imageUrl, { cache: 'force-cache', signal })
18+
if (!response.ok) return
1819
const svg = await response.text()
1920
const resizedSvg = svg
2021
.replace('width=', 'width="24px" oldwidth=')
2122
.replace('height=', 'height="24px" oldheight=')
22-
setIcon(resizedSvg)
23-
} catch {
24-
// handle error silently
23+
if (!signal.aborted) {
24+
setIcon(resizedSvg)
25+
}
26+
} catch (err) {
27+
if ((err as any).name !== 'AbortError') {
28+
console.error('Failed to load SVG:', err)
29+
}
2530
}
2631
} else {
27-
setIcon(imageUrl)
32+
if (!signal.aborted) {
33+
setIcon(imageUrl)
34+
}
2835
}
2936
}
3037

3138
fetchIcon()
39+
40+
return () => {
41+
controller.abort()
42+
}
3243
}, [options.repo, path])
3344

3445
if (!icon) return null
3546

3647
return path.endsWith('.svg') ? (
37-
<span dangerouslySetInnerHTML={{ __html: icon }} style={options.style} />
48+
<span dangerouslySetInnerHTML={{ __html: icon }} style={options.style} aria-hidden="true" />
3849
) : (
3950
<img src={icon} alt="icon" style={options.style} />
4051
)

apps/sensenet/src/components/dashboard/index.tsx

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -48,19 +48,27 @@ const Dashboard = () => {
4848
const [data, setData] = useState<DashboardData>()
4949
const logger = useLogger('Dashboard')
5050
const [isAdmin, setIsAdmin] = useState(false)
51+
5152
useEffect(() => {
53+
const ac = new AbortController()
5254
;(async () => {
53-
const response = await repository.executeAction<any, DashboardData>({
54-
idOrPath: '/Root',
55-
name: 'GetDashboardData',
56-
method: 'GET',
57-
oDataOptions: {
58-
select: ['Plan'],
59-
},
60-
})
61-
62-
setData(response)
55+
try {
56+
const response = await repository.executeAction<any, DashboardData>({
57+
idOrPath: '/Root',
58+
name: 'GetDashboardData',
59+
method: 'GET',
60+
oDataOptions: { select: ['Plan'] },
61+
requestInit: { signal: ac.signal },
62+
})
63+
setData(response)
64+
} catch (err: any) {
65+
if (!ac.signal.aborted) {
66+
console.error('Dashboard data fetch failed:', err)
67+
}
68+
}
6369
})()
70+
71+
return () => ac.abort()
6472
}, [repository])
6573

6674
useEffect(() => {

apps/sensenet/src/components/settings/stats-installed-packages-widget.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export const InstalledPackagesWidget: React.FunctionComponent<InstalledPackagesW
7272
</TableHead>
7373
<TableBody>
7474
{props.data.InstalledPackages.map((row) => (
75-
<TableRow key={row.ComponentId}>
75+
<TableRow key={row.Id}>
7676
<TableCell align="left">{row.ComponentId}</TableCell>
7777
<TableCell align="left">{row.Description}</TableCell>
7878
<TableCell align="left">{dateUtils.formatDate(row.ReleaseDate, 'dd/MM/yyyy')}</TableCell>

apps/sensenet/src/components/tree/StyledTreeItem.tsx

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { ListItemIcon, ListItemText } from '@material-ui/core'
22
import TreeItem from '@material-ui/lab/TreeItem'
33
import { GenericContent } from '@sensenet/default-content-types'
44
import { useRepository } from '@sensenet/hooks-react'
5-
import React, { MouseEventHandler, useCallback, useContext, useEffect, useState } from 'react'
5+
import React, { MouseEventHandler, useCallback, useContext, useEffect, useRef, useState } from 'react'
66
import { useHistory } from 'react-router'
77
import { ResponsivePersonalSettings } from '../../context'
88
import { useQuery, useSnRoute } from '../../hooks'
@@ -37,11 +37,22 @@ export const StyledTreeItem = (props: StyledTreeItemProps) => {
3737
const snRoute = useSnRoute()
3838
const uiSettings = useContext(ResponsivePersonalSettings)
3939
const { navigate, editMode, ...restProps } = props
40+
const mountedRef = useRef(true)
41+
42+
useEffect(() => {
43+
mountedRef.current = true
44+
return () => {
45+
mountedRef.current = false
46+
}
47+
}, [])
4048

4149
const loadCollectionCB = useCallback(
4250
async (contentPath: string): Promise<void> => {
4351
try {
4452
const children = await loadChildren(contentPath)
53+
if (!mountedRef.current) {
54+
return
55+
}
4556
children?.sort((a, b) => {
4657
const isAFolder = a.Type.toLowerCase().includes('folder') ? 0 : 1
4758
const isBFolder = b.Type.toLowerCase().includes('folder') ? 0 : 1

packages/sn-controls-react/src/fieldcontrols/switcher.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@
22
* @module FieldControls
33
*/
44
import {
5+
Box,
56
createStyles,
67
FormControl,
78
FormHelperText,
89
Grid,
910
makeStyles,
1011
Switch as MuiSwitch,
1112
Theme,
12-
Typography,
1313
withStyles,
1414
} from '@material-ui/core'
1515
import { deepMerge } from '@sensenet/client-utils'
@@ -136,7 +136,7 @@ export const Switcher: React.FC<ReactClientFieldSetting<FieldSetting>> = (props)
136136
})}
137137
required={props.settings.Compulsory}
138138
disabled={props.settings.ReadOnly}>
139-
<Typography component="div" style={{ width: '100%' }}>
139+
<Box style={{ width: '100%' }}>
140140
<Grid
141141
component="label"
142142
className={classes.switcherCont}
@@ -160,14 +160,14 @@ export const Switcher: React.FC<ReactClientFieldSetting<FieldSetting>> = (props)
160160
<Switch data-test="edit-switch" size="medium" checked={value} onChange={handleChange} />
161161
</Grid>
162162
</Grid>
163-
</Typography>
163+
</Box>
164164
</FormControl>
165165
)
166166
case 'browse':
167167
default:
168168
return (
169169
<Grid
170-
component={Typography}
170+
component="div"
171171
container
172172
alignItems="center"
173173
spacing={1}

packages/sn-controls-react/src/viewcontrols/browse-view.tsx

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -157,7 +157,7 @@ export const BrowseView: React.FC<BrowseViewProps> = (props) => {
157157
{props.renderTitle ? (
158158
props.renderTitle()
159159
) : (
160-
<Typography variant="h5" gutterBottom={true}>
160+
<Typography variant="h5" component="h5" gutterBottom={true}>
161161
{schema.schema.DisplayName}
162162
</Typography>
163163
)}
@@ -174,9 +174,9 @@ export const BrowseView: React.FC<BrowseViewProps> = (props) => {
174174
.map((field) => renderField(field))}
175175

176176
<Box className={classes.advancedFieldContainer} data-test="advanced-field-container">
177-
{advancedFields.map((group, index) =>
177+
{advancedFields.map((group) =>
178178
group.fields.length > 0 ? (
179-
<Box key={index} data-test="group-container">
179+
<Box key={group.key} data-test="group-container">
180180
<Box className={classes.divider} />
181181
<Box data-test="group-header">
182182
<Box className={classes.advancedFieldBox}>
@@ -199,9 +199,7 @@ export const BrowseView: React.FC<BrowseViewProps> = (props) => {
199199
)
200200
.map((field) => renderField(field))}
201201
</Box>
202-
) : (
203-
<></>
204-
),
202+
) : null,
205203
)}
206204
</Box>
207205
</Grid>

packages/sn-controls-react/src/viewcontrols/edit-view.tsx

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -238,9 +238,9 @@ export const EditView: React.FC<EditViewProps> = (props) => {
238238
.map((field) => renderField(field))}
239239

240240
<Box className={classes.advancedFieldContainer}>
241-
{advancedFields.map((group, index) =>
241+
{advancedFields.map((group) =>
242242
group.fields.length > 0 ? (
243-
<Box key={index} className={classes.advancedHolder} data-test="group-container">
243+
<Box key={group.key} className={classes.advancedHolder} data-test="group-container">
244244
<Box className={classes.divider} />
245245
<Box data-test="group-header">
246246
<Box className={classes.advancedFieldBox}>
@@ -263,9 +263,7 @@ export const EditView: React.FC<EditViewProps> = (props) => {
263263
)
264264
.map((field) => renderField(field))}
265265
</Box>
266-
) : (
267-
<></>
268-
),
266+
) : null,
269267
)}
270268
</Box>
271269
</Grid>

0 commit comments

Comments
 (0)