Skip to content

Commit 10fd392

Browse files
author
smallstone
committed
Update package.json and App.tsx files
1 parent 1fa37e9 commit 10fd392

6 files changed

Lines changed: 262 additions & 133 deletions

File tree

‎package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@
4444
"typescript"
4545
],
4646
"scripts": {
47-
"compile": "webpack",
47+
"compile": "webpack 1",
4848
"watch": "webpack --watch",
4949
"package": "webpack --mode production --devtool hidden-source-map",
5050
"compile-tests": "tsc -p . --outDir out",
@@ -124,6 +124,7 @@
124124
"clean-webpack-plugin": "^4.0.0",
125125
"dayjs": "^1.11.10",
126126
"dotenv": "^16.0.3",
127+
"i18next": "^23.7.11",
127128
"js-yaml": "^4.1.0",
128129
"mdast": "^3.0.0",
129130
"mdast-util-from-markdown": "^2.0.0",
@@ -135,6 +136,7 @@
135136
"node-fetch": "^3.3.1",
136137
"nonce": "^1.0.4",
137138
"quote": "^0.4.0",
139+
"react-i18next": "^13.5.0",
138140
"react-markdown": "^8.0.7",
139141
"react-syntax-highlighter": "^15.5.0",
140142
"rehype-raw": "^6.1.1",

‎src/views/App.tsx‎

Lines changed: 21 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,23 @@
1-
import * as React from 'react';
2-
import {
3-
AppShell,
4-
useMantineTheme,
5-
} from '@mantine/core';
6-
import ChatPanel from '@/views/pages/ChatPanel';
7-
import Head from '@/views/components/Header';
8-
import './App.css';
1+
import * as React from "react";
2+
import { AppShell } from "@mantine/core";
3+
import ChatPanel from "@/views/pages/ChatPanel";
4+
import Head from "@/views/components/Header";
5+
import "./App.css";
6+
import "./i18n";
97

108
export default function App() {
11-
const theme = useMantineTheme();
12-
return (
13-
<AppShell
14-
header={<Head />}
15-
styles={{
16-
main: {
17-
padding:'40px 0 0 0',
18-
fontFamily: 'var(--vscode-editor-font-family)',
19-
fontSize: 'var(--vscode-editor-font-size)',
20-
},
21-
}}
22-
>
23-
<ChatPanel />
24-
</AppShell>
25-
);
26-
}
9+
return (
10+
<AppShell
11+
header={<Head />}
12+
styles={{
13+
main: {
14+
padding: "40px 0 0 0",
15+
fontFamily: "var(--vscode-editor-font-family)",
16+
fontSize: "var(--vscode-editor-font-size)",
17+
},
18+
}}
19+
>
20+
<ChatPanel />
21+
</AppShell>
22+
);
23+
}

‎src/views/components/Header/index.tsx‎

Lines changed: 34 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,48 @@
11
import React from "react";
2-
import { Header, Avatar, Flex, Text, ActionIcon, createStyles } from "@mantine/core";
2+
import {
3+
Header,
4+
Avatar,
5+
Flex,
6+
Text,
7+
ActionIcon,
8+
createStyles,
9+
} from "@mantine/core";
310
import BalanceTip from "@/views/components/BalanceTip";
4-
import { IconSettings } from "@tabler/icons-react";
11+
import { IconSettings, IconLanguage } from "@tabler/icons-react";
12+
import { useTranslation } from "react-i18next";
513
// @ts-ignore
614
import SvgAvatarDevChat from "../MessageAvatar/avatar_devchat.svg";
715
import messageUtil from "@/util/MessageUtil";
816

917
const useStyles = createStyles((theme) => ({
10-
logoName:{
11-
color: 'var(--vscode-foreground)'
12-
}
18+
logoName: {
19+
color: "var(--vscode-foreground)",
20+
},
1321
}));
1422

1523
export default function Head() {
16-
const {classes} = useStyles();
24+
const { classes } = useStyles();
25+
const { t, i18n } = useTranslation();
26+
1727
const openSetting = () => {
1828
messageUtil.sendMessage({
1929
command: "doCommand",
2030
content: ["workbench.action.openSettings", "DevChat"],
2131
});
2232
};
33+
34+
const switchLang = () => {
35+
const currentLang = i18n.language;
36+
const newLang = currentLang === "en" ? "zh" : "en";
37+
i18n.changeLanguage(newLang);
38+
};
39+
2340
return (
2441
<Header
2542
height={40}
2643
style={{
2744
backgroundColor: "var(--vscode-sideBar-background)",
28-
borderBottom: '1px solid #ced4da',
45+
borderBottom: "1px solid #ced4da",
2946
}}
3047
>
3148
<Flex justify="space-between" align="center" sx={{ padding: "0 10px" }}>
@@ -38,17 +55,24 @@ export default function Head() {
3855
}}
3956
>
4057
<Avatar color="indigo" size={25} radius="xl" src={SvgAvatarDevChat} />
41-
<Text weight="bold" className={classes.logoName}>DevChat</Text>
58+
<Text weight="bold" className={classes.logoName}>
59+
DevChat
60+
</Text>
4261
</Flex>
43-
<Flex align="center" gap="xs" sx={{paddingRight:10}}>
62+
<Flex align="center" gap="xs" sx={{ paddingRight: 10 }}>
4463
<div>
4564
<BalanceTip />
4665
</div>
4766
<div>
48-
<ActionIcon size='sm' onClick={openSetting}>
67+
<ActionIcon size="sm" onClick={openSetting}>
4968
<IconSettings size="1.125rem" />
5069
</ActionIcon>
5170
</div>
71+
<div>
72+
<ActionIcon size="sm" onClick={switchLang}>
73+
<IconLanguage size="1.125rem" />
74+
</ActionIcon>
75+
</div>
5276
</Flex>
5377
</Flex>
5478
</Header>

0 commit comments

Comments
 (0)