Skip to content

Commit c82828e

Browse files
dragoni7dragoni7
committed
Reformatting and reorganizations. Updated eslint and ts configs
1 parent 9bdb967 commit c82828e

21 files changed

+700
-568
lines changed

‎.eslintrc.cjs

Lines changed: 137 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,140 @@
11
module.exports = {
22
root: true,
3-
env: { browser: true, es2020: true },
4-
extends: [
5-
'eslint:recommended',
6-
'plugin:react/recommended',
7-
'plugin:react/jsx-runtime',
8-
'plugin:react-hooks/recommended',
9-
],
10-
ignorePatterns: ['dist', '.eslintrc.cjs'],
11-
parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
12-
settings: { react: { version: '18.2' } },
13-
plugins: ['react-refresh'],
14-
rules: {
15-
'react/jsx-no-target-blank': 'off',
16-
'react-refresh/only-export-components': [
17-
'warn',
18-
{ allowConstantExport: true },
19-
],
3+
env: {
4+
node: true,
5+
es6: true,
206
},
21-
}
7+
parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
8+
ignorePatterns: ['node_modules/*', 'certs', 'public/mockServiceWorker.js', 'generators/*'],
9+
extends: ['eslint:recommended'],
10+
plugins: ['check-file'],
11+
overrides: [
12+
{
13+
files: ['**/*.ts', '**/*.tsx'],
14+
parser: '@typescript-eslint/parser',
15+
settings: {
16+
react: { version: 'detect' },
17+
'import/resolver': {
18+
typescript: {},
19+
},
20+
},
21+
env: {
22+
browser: true,
23+
node: true,
24+
es6: true,
25+
},
26+
extends: [
27+
'eslint:recommended',
28+
'plugin:import/errors',
29+
'plugin:import/warnings',
30+
'plugin:import/typescript',
31+
'plugin:@typescript-eslint/recommended',
32+
'plugin:react/recommended',
33+
'plugin:react-hooks/recommended',
34+
'plugin:jsx-a11y/recommended',
35+
'plugin:prettier/recommended',
36+
'plugin:testing-library/react',
37+
'plugin:jest-dom/recommended',
38+
'plugin:vitest/legacy-recommended',
39+
],
40+
rules: {
41+
'import/no-restricted-paths': [
42+
'error',
43+
{
44+
zones: [
45+
// disables cross-feature imports:
46+
// eg. src/features/discussions should not import from src/features/comments, etc.
47+
{
48+
target: './src/features/armor-mods',
49+
from: './src/features',
50+
except: ['./armor-mods'],
51+
},
52+
{
53+
target: './src/features/armor-optimization',
54+
from: './src/features',
55+
except: ['./armor-optimization'],
56+
},
57+
{
58+
target: './src/features/auth',
59+
from: './src/features',
60+
except: ['./auth'],
61+
},
62+
{
63+
target: './src/features/membership',
64+
from: './src/features',
65+
except: ['./membership'],
66+
},
67+
{
68+
target: './src/features/subclass',
69+
from: './src/features',
70+
except: ['./subclass'],
71+
},
72+
{
73+
target: './src/features/loadouts',
74+
from: './src/features',
75+
except: ['./loadouts'],
76+
},
77+
// enforce unidirectional codebase:
78+
79+
// e.g. src/app can import from src/features but not the other way around
80+
{
81+
target: './src/features',
82+
from: './src/app',
83+
},
84+
85+
// e.g src/features and src/app can import from these shared modules but not the other way around
86+
{
87+
target: [
88+
'./src/components',
89+
'./src/hooks',
90+
'./src/lib',
91+
'./src/types',
92+
'./src/utils',
93+
'./src/styled',
94+
'./src/stored',
95+
'./src/generated',
96+
],
97+
from: ['./src/features', './src/app'],
98+
},
99+
],
100+
},
101+
],
102+
'import/no-cycle': 'error',
103+
'linebreak-style': ['error', 'unix'],
104+
'react/prop-types': 'off',
105+
'import/order': [
106+
'error',
107+
{
108+
groups: ['builtin', 'external', 'internal', 'parent', 'sibling', 'index', 'object'],
109+
'newlines-between': 'always',
110+
alphabetize: { order: 'asc', caseInsensitive: true },
111+
},
112+
],
113+
'import/default': 'off',
114+
'import/no-named-as-default-member': 'off',
115+
'import/no-named-as-default': 'off',
116+
'react/react-in-jsx-scope': 'off',
117+
'jsx-a11y/anchor-is-valid': 'off',
118+
'@typescript-eslint/no-unused-vars': ['error'],
119+
'@typescript-eslint/explicit-function-return-type': ['off'],
120+
'@typescript-eslint/explicit-module-boundary-types': ['off'],
121+
'@typescript-eslint/no-empty-function': ['off'],
122+
'@typescript-eslint/no-explicit-any': ['off'],
123+
'prettier/prettier': ['error', {}, { usePrettierrc: true }],
124+
'check-file/filename-naming-convention': [
125+
'error',
126+
{
127+
ignoreMiddleExtensions: true,
128+
},
129+
],
130+
},
131+
},
132+
{
133+
plugins: ['check-file'],
134+
files: ['src/**/!(__tests__)/*'],
135+
rules: {
136+
'check-file/folder-naming-convention': ['error'],
137+
},
138+
},
139+
],
140+
};

‎public/vite.svg

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎src/components/ArmorIcon.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,31 @@
1-
import { styled } from '@mui/system';
1+
import { styled } from '@mui/material';
22
import { DestinyArmor } from '../types/d2l-types';
33

4-
const MasterworkedIconContainer = styled('img')({
4+
interface ArmorIconProps {
5+
armor: DestinyArmor;
6+
size?: number | string;
7+
}
8+
9+
const MasterworkedArmorIconContainer = styled('img')({
510
border: '2px solid',
611
borderImage: 'linear-gradient(to right, #FFD700, #FFFACD, #FFD700) 1',
712
borderRadius: '0',
813
maxWidth: '91px',
914
height: 'auto',
1015
});
1116

12-
const DefaultIconContainer = styled('img')({
17+
const DefaultArmorIconContainer = styled('img')({
1318
border: '2px solid white',
1419
borderRadius: '0',
1520
maxWidth: '91px',
1621
height: 'auto',
1722
});
1823

19-
interface ArmorIconProps {
20-
armor: DestinyArmor;
21-
size?: number | string;
22-
}
23-
2424
const ArmorIcon: React.FC<ArmorIconProps> = ({ armor, size = '64%' }) => {
2525
return armor.masterwork ? (
26-
<MasterworkedIconContainer src={armor.icon} alt={armor.name} width={size} />
26+
<MasterworkedArmorIconContainer src={armor.icon} alt={armor.name} width={size} />
2727
) : (
28-
<DefaultIconContainer src={armor.icon} alt={armor.name} width={size} />
28+
<DefaultArmorIconContainer src={armor.icon} alt={armor.name} width={size} />
2929
);
3030
};
3131

‎src/components/HeaderComponent.tsx

Lines changed: 28 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,17 @@
11
import React from 'react';
2-
import { styled } from '@mui/system';
32
import { Character } from '../types/d2l-types';
43
import { useDispatch } from 'react-redux';
54
import { updateSelectedCharacter } from '../store/DashboardReducer';
5+
import {
6+
HeaderOverlayImage,
7+
HeaderDisplayName,
8+
HeaderBottomContainer,
9+
HeaderButtonContainer,
10+
HeaderCharacterText,
11+
HeaderLinksContainer,
12+
HeaderStyledLink,
13+
Header,
14+
} from '../styled';
615

716
interface HeaderComponentProps {
817
emblemUrl: string;
@@ -13,105 +22,6 @@ interface HeaderComponentProps {
1322
onCharacterClick: (index: number) => void;
1423
}
1524

16-
const Header = styled('div')<{ emblemUrl: string }>(({ emblemUrl }) => ({
17-
position: 'fixed',
18-
top: 0,
19-
left: 0,
20-
width: '100vw',
21-
height: '130px',
22-
backgroundImage: `url(${emblemUrl})`,
23-
backgroundSize: 'cover',
24-
backgroundPosition: 'center',
25-
display: 'flex',
26-
alignItems: 'center',
27-
padding: '0 20px',
28-
boxSizing: 'border-box',
29-
zIndex: 1000,
30-
font: 'Helvetica',
31-
}));
32-
33-
const OverlayImage = styled('img')({
34-
position: 'absolute',
35-
left: '210px',
36-
top: '120px',
37-
transform: 'translateY(-50%)',
38-
width: '100px',
39-
height: '100px',
40-
});
41-
42-
const DisplayName = styled('div')({
43-
marginLeft: '300px',
44-
marginTop: '30px',
45-
fontSize: '32px',
46-
color: 'white',
47-
fontWeight: 'bold',
48-
});
49-
50-
const BottomContainer = styled('div')({
51-
position: 'absolute',
52-
bottom: '0',
53-
left: 0,
54-
right: 0,
55-
display: 'flex',
56-
justifyContent: 'center',
57-
alignItems: 'flex-end',
58-
});
59-
60-
const ButtonContainer = styled('div')({
61-
display: 'flex',
62-
gap: '20px',
63-
});
64-
65-
const sharedTextStyles = {
66-
fontSize: '24px',
67-
cursor: 'pointer',
68-
paddingBottom: '5px',
69-
transition: 'opacity 0.3s, transform 0.3s',
70-
position: 'relative' as const,
71-
'&:hover': {
72-
opacity: 1,
73-
transform: 'translateY(-2px)',
74-
},
75-
};
76-
77-
const CharacterText = styled('div')<{ isSelected: boolean }>(({ isSelected }) => ({
78-
...sharedTextStyles,
79-
color: isSelected ? 'white' : 'rgba(255, 255, 255, 0.6)',
80-
opacity: isSelected ? 1 : 0.6,
81-
textTransform: 'capitalize',
82-
'&::after': {
83-
content: '""',
84-
position: 'absolute',
85-
bottom: 0,
86-
left: 0,
87-
width: '100%',
88-
height: '4px',
89-
backgroundColor: 'white',
90-
transform: isSelected ? 'scaleX(1)' : 'scaleX(0)',
91-
transition: 'transform 0.3s',
92-
},
93-
}));
94-
95-
const LinksContainer = styled('div')({
96-
position: 'absolute',
97-
right: '20px',
98-
bottom: '-2px',
99-
display: 'flex',
100-
gap: '20px',
101-
alignItems: 'flex-end',
102-
});
103-
104-
const StyledLink = styled('a')({
105-
...sharedTextStyles,
106-
color: 'rgba(255, 255, 255, 0.6)',
107-
textDecoration: 'none',
108-
opacity: 0.6,
109-
'&:hover': {
110-
...sharedTextStyles['&:hover'],
111-
color: 'white',
112-
},
113-
});
114-
11525
const HeaderComponent: React.FC<HeaderComponentProps> = ({
11626
emblemUrl,
11727
overlayUrl,
@@ -129,33 +39,37 @@ const HeaderComponent: React.FC<HeaderComponentProps> = ({
12939

13040
return (
13141
<Header emblemUrl={emblemUrl}>
132-
<OverlayImage src={overlayUrl} alt="Overlay" />
133-
<DisplayName>{displayName}</DisplayName>
134-
<BottomContainer>
135-
<ButtonContainer>
42+
<HeaderOverlayImage src={overlayUrl} alt="Overlay" />
43+
<HeaderDisplayName>{displayName}</HeaderDisplayName>
44+
<HeaderBottomContainer>
45+
<HeaderButtonContainer>
13646
{characters.map((character, index) => (
137-
<CharacterText
47+
<HeaderCharacterText
13848
key={index}
13949
isSelected={selectedCharacter?.id === character.id}
14050
onClick={() => handleCharacterClick(index)}
14151
>
14252
{character.class}
143-
</CharacterText>
53+
</HeaderCharacterText>
14454
))}
145-
</ButtonContainer>
146-
</BottomContainer>
147-
<LinksContainer>
148-
<StyledLink
55+
</HeaderButtonContainer>
56+
</HeaderBottomContainer>
57+
<HeaderLinksContainer>
58+
<HeaderStyledLink
14959
href="https://buymeacoffee.com/d2loadouts"
15060
target="_blank"
15161
rel="noopener noreferrer"
15262
>
15363
Coffee
154-
</StyledLink>
155-
<StyledLink href="https://patreon.com/d2loadouts" target="_blank" rel="noopener noreferrer">
64+
</HeaderStyledLink>
65+
<HeaderStyledLink
66+
href="https://patreon.com/d2loadouts"
67+
target="_blank"
68+
rel="noopener noreferrer"
69+
>
15670
Patreon
157-
</StyledLink>
158-
</LinksContainer>
71+
</HeaderStyledLink>
72+
</HeaderLinksContainer>
15973
</Header>
16074
);
16175
};

0 commit comments

Comments
 (0)