Skip to content

Commit cc1386f

Browse files
luckfuncluckfunc
committed
refactor: standardize export formatting and improve code consistency
1 parent 46c8349 commit cc1386f

File tree

34 files changed

+1270
-1246
lines changed

34 files changed

+1270
-1246
lines changed

‎.editorconfig‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
end_of_line = lf
6+
indent_size = 2
7+
indent_style = space
8+
insert_final_newline = true
9+
max_line_length = 100
10+
quote_type = single
11+
trim_trailing_whitespace = true

‎.github/workflows/deploy.yml‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ name: deploy
66
on:
77
# Triggers the workflow on push or pull request events but only for the main branch
88
push:
9-
branches: [ deploy ]
9+
branches: [ main ]
1010
# Allows you to run this workflow manually from the Actions tab
1111
workflow_dispatch:
1212

@@ -19,24 +19,24 @@ jobs:
1919
# Steps represent a sequence of tasks that will be executed as part of the job
2020
steps:
2121
# Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
22-
- uses: actions/checkout@v2
23-
- name: install Node.js
24-
uses: actions/[email protected]
22+
- uses: actions/checkout@v4
23+
24+
- name: Setup pnpm
25+
uses: pnpm/action-setup@v4
2526
with:
26-
node-version: '16.X'
27+
version: 8
2728

28-
# - name: Setup pnpm
29-
# You may pin to the exact commit or the version.
30-
# uses: pnpm/action-setup@d882d12c64e032187b2edb46d3a0d003b7a43598
31-
# uses: pnpm/[email protected]
32-
# with:
33-
# Version of pnpm to install
34-
# version: '8.X'
29+
- name: install Node.js
30+
uses: actions/setup-node@v4
31+
with:
32+
node-version: '18'
33+
cache: 'pnpm'
3534

3635
- name: install deps
37-
run: npm i
36+
run: pnpm install
37+
3838
- name: build app
39-
run: npm run build
39+
run: pnpm run build
4040

4141
- name: Deploy to the server.
4242
uses: cross-the-world/scp-pipeline@master

‎.vscode/extensions.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"recommendations": [
3+
"dbaeumer.vscode-eslint",
4+
"editorconfig.editorconfig",
5+
"esbenp.prettier-vscode",
6+
"stylelint.vscode-stylelint"
7+
]
8+
}

‎eslint.config.mjs‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { react } from 'eslint-config-ali';
2+
3+
export default [...react];

‎package.json‎

Lines changed: 20 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,27 @@
11
{
22
"name": "avatar",
3-
"private": true,
43
"version": "1.0.0",
4+
"private": true,
5+
"homepage": "https://github.com/luckfunc/react-color-avatar#readme",
6+
"bugs": {
7+
"url": "https://github.com/luckfunc/react-color-avatar/issues"
8+
},
9+
"repository": {
10+
"type": "git",
11+
"url": "git+https://github.com/luckfunc/react-color-avatar.git"
12+
},
13+
"funding": "https://github.com/sponsors/luckfunc",
14+
"author": {
15+
"name": "幸运函数",
16+
"email": "[email protected]"
17+
},
518
"type": "module",
619
"scripts": {
7-
"dev": "vite",
820
"build": "tsc && vite build",
9-
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
21+
"ci:eslint": "eslint -f json src -o ./.ci/eslint.json",
22+
"dev": "vite",
23+
"lint": "eslint .",
24+
"lint:fix": "eslint --fix .",
1025
"preview": "vite preview"
1126
},
1227
"dependencies": {
@@ -22,11 +37,9 @@
2237
"devDependencies": {
2338
"@types/react": "^18.2.15",
2439
"@types/react-dom": "^18.2.7",
25-
"@typescript-eslint/eslint-plugin": "^6.0.0",
26-
"@typescript-eslint/parser": "^6.0.0",
2740
"@vitejs/plugin-react": "^4.0.3",
28-
"eslint": "^8.45.0",
29-
"eslint-plugin-react-hooks": "^4.6.0",
41+
"eslint": "^9.31.0",
42+
"eslint-config-ali": "^16.3.0",
3043
"eslint-plugin-react-refresh": "^0.4.3",
3144
"less": "^4.2.0",
3245
"typescript": "^5.0.2",

‎src/App.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@ import { useAvatarOption } from '@hooks';
33
import './App.less';
44

55
export default function App() {
6-
const [avatarOption, setAvatarOption] = useAvatarOption();
6+
const [avatarOption, setAvatarOption] = useAvatarOption();
77

8-
return (
9-
<main className='main'>
10-
<Container avatarOption={avatarOption} setAvatarOption={setAvatarOption}/>
11-
<Sidebar avatarOption={avatarOption} setAvatarOption={setAvatarOption}/>
12-
</main>
13-
)
8+
return (
9+
<main className="main">
10+
<Container avatarOption={avatarOption} setAvatarOption={setAvatarOption} />
11+
<Sidebar avatarOption={avatarOption} setAvatarOption={setAvatarOption} />
12+
</main>
13+
);
1414
}
1515

‎src/components/action-bar/index.tsx‎

Lines changed: 56 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -6,67 +6,67 @@ import IconNext from '@assets/icons/icon-next.svg';
66
import './style.less';
77

88
interface IProps {
9-
flipped: boolean
10-
setFlipped: (flipped: boolean) => void
9+
flipped: boolean;
10+
setFlipped: (flipped: boolean) => void;
1111
}
1212

1313
export default function ActionBar(props: IProps) {
14-
const { setFlipped, flipped } = props;
15-
// const history = useSelector((state: AppState) => state.history);
16-
// const canUndo = history.past.length > 0;
17-
// const canRedo = history.future.length > 0;
18-
const dispatch = useDispatch();
14+
const { setFlipped, flipped } = props;
15+
// const history = useSelector((state: AppState) => state.history);
16+
// const canUndo = history.past.length > 0;
17+
// const canRedo = history.future.length > 0;
18+
const dispatch = useDispatch();
1919

20-
const handleActionClick = (actionType: 'undo' | 'redo' | 'flip' | 'code') => {
21-
switch (actionType) {
22-
case ActionType.Undo:
23-
dispatch({ type: actionType });
24-
break;
25-
case ActionType.Redo:
26-
dispatch({ type: actionType });
27-
break;
28-
case ActionType.Flip:
29-
setFlipped(!flipped);
30-
break;
31-
case ActionType.Code:
32-
dispatch({ type: actionType });
33-
break;
34-
default:
20+
const handleActionClick = (actionType: 'undo' | 'redo' | 'flip' | 'code') => {
21+
switch (actionType) {
22+
case ActionType.Undo:
23+
dispatch({ type: actionType });
24+
break;
25+
case ActionType.Redo:
26+
dispatch({ type: actionType });
27+
break;
28+
case ActionType.Flip:
29+
setFlipped(!flipped);
30+
break;
31+
case ActionType.Code:
32+
dispatch({ type: actionType });
33+
break;
34+
default:
3535
// 默认处理
36-
}
37-
};
36+
}
37+
};
3838

39-
const actions = [
40-
{
41-
type: ActionType.Undo,
42-
icon: IconBack,
43-
tip: 'Undo',
44-
disabled: true,
45-
},
46-
{
47-
type: ActionType.Redo,
48-
icon: IconNext,
49-
tip: 'Redo',
50-
disabled: true,
51-
},
52-
{
53-
type: ActionType.Flip,
54-
icon: IconFlip,
55-
tip: 'Flip',
56-
}
57-
];
58-
return (
59-
<div className='action-menu'>
60-
{actions.map((ac) => (
61-
<div
62-
key={ac.type}
63-
className={`menu-item ${ac.disabled ? 'disabled' : ''}`}
64-
title={ac.tip}
65-
onClick={() => handleActionClick(ac.type)}
66-
>
67-
<img src={ac.icon} alt={ac.tip} />
68-
</div>
69-
))}
39+
const actions = [
40+
{
41+
type: ActionType.Undo,
42+
icon: IconBack,
43+
tip: 'Undo',
44+
disabled: true,
45+
},
46+
{
47+
type: ActionType.Redo,
48+
icon: IconNext,
49+
tip: 'Redo',
50+
disabled: true,
51+
},
52+
{
53+
type: ActionType.Flip,
54+
icon: IconFlip,
55+
tip: 'Flip',
56+
},
57+
];
58+
return (
59+
<div className="action-menu">
60+
{actions.map((ac) => (
61+
<div
62+
key={ac.type}
63+
className={`menu-item ${ac.disabled ? 'disabled' : ''}`}
64+
title={ac.tip}
65+
onClick={() => handleActionClick(ac.type)}
66+
>
67+
<img src={ac.icon} alt={ac.tip} />
7068
</div>
71-
)
69+
))}
70+
</div>
71+
);
7272
}

‎src/components/color-list-item/index.tsx‎

Lines changed: 33 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -2,45 +2,41 @@ import { SETTINGS } from '@constants';
22
import { AvatarOption } from '@types';
33

44
interface IProps {
5-
avatarOption: AvatarOption
6-
setAvatarOption: (newOption: AvatarOption) => void
5+
avatarOption: AvatarOption;
6+
setAvatarOption: (newOption: AvatarOption) => void;
77
}
8-
98
export default function ColorListItem(props: IProps) {
10-
const { setAvatarOption, avatarOption } = props;
11-
const onSwitchBgColor = (bgColor: string) => {
12-
if (bgColor !== avatarOption.background.color) {
13-
setAvatarOption({
14-
...avatarOption,
15-
background: { ...avatarOption.background, color: bgColor },
16-
})
17-
}
9+
const { setAvatarOption, avatarOption } = props;
10+
11+
const onSwitchBgColor = (bgColor: string) => {
12+
if (bgColor !== avatarOption.background.color) {
13+
setAvatarOption({
14+
...avatarOption,
15+
background: { ...avatarOption.background, color: bgColor },
16+
});
1817
}
19-
return (
20-
<ul className='color-list'>
21-
{
22-
SETTINGS.backgroundColor.map((bgColor: string) => {
23-
return (
24-
<li
25-
key={bgColor}
26-
className='color-list__item'
27-
onClick={() => onSwitchBgColor(bgColor)}
28-
>
29-
<div
30-
style={{ background: bgColor }}
31-
className={`bg-color ${
32-
bgColor === avatarOption.background.color
33-
? 'active'
34-
: bgColor === 'transparent'
35-
? 'transparent'
36-
: ''
37-
}`}
18+
};
19+
20+
const getBgColorClass = (bgColor: string) => {
21+
if (bgColor === avatarOption.background.color) return 'active';
22+
if (bgColor === 'transparent') return 'transparent';
23+
return '';
24+
};
3825

39-
/>
40-
</li>
41-
)
42-
})
43-
}
44-
</ul>
45-
);
26+
return (
27+
<ul className="color-list">
28+
{SETTINGS.backgroundColor.map((bgColor: string) => (
29+
<li
30+
key={bgColor}
31+
className="color-list__item"
32+
onClick={() => onSwitchBgColor(bgColor)}
33+
>
34+
<div
35+
style={{ background: bgColor }}
36+
className={`bg-color ${getBgColorClass(bgColor)}`}
37+
/>
38+
</li>
39+
))}
40+
</ul>
41+
);
4642
}

‎src/components/configurator/index.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@ import { AvatarOption } from '@types';
33
import './style.less';
44

55
interface IProps {
6-
avatarOption: AvatarOption
7-
setAvatarOption: (newOption: AvatarOption) => void
6+
avatarOption: AvatarOption;
7+
setAvatarOption: (newOption: AvatarOption) => void;
88
}
99
export default function Configurator(props: IProps) {
10-
const { avatarOption, setAvatarOption } = props;
11-
return (
12-
<PerfectScrollbar avatarOption={avatarOption} setAvatarOption={setAvatarOption}/>
13-
)
10+
const { avatarOption, setAvatarOption } = props;
11+
return (
12+
<PerfectScrollbar avatarOption={avatarOption} setAvatarOption={setAvatarOption} />
13+
);
1414
}

‎src/components/index.ts‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,12 @@ import SectionWrapper from './section-wrapper';
88
import WrapperShapeItem from './wrapper-shape-item';
99

1010
export {
11-
ActionBar,
12-
ColorListItem,
13-
Configurator,
14-
Logo,
15-
PerfectScrollbar,
16-
ReactColorAvatar,
17-
SectionWrapper,
18-
WrapperShapeItem
19-
}
11+
ActionBar,
12+
ColorListItem,
13+
Configurator,
14+
Logo,
15+
PerfectScrollbar,
16+
ReactColorAvatar,
17+
SectionWrapper,
18+
WrapperShapeItem,
19+
};

0 commit comments

Comments
 (0)