This commit is contained in:
rex
2025-10-23 16:31:00 +08:00
parent a5d7f6df0e
commit 8d63b1e80b
8 changed files with 88 additions and 87 deletions

View File

@@ -10,7 +10,8 @@
},
"formatter": {
"enabled": true,
"indentStyle": "tab"
"indentStyle": "space",
"indentWidth": 2
},
"linter": {
"enabled": true,

View File

@@ -5,7 +5,7 @@ import { MujianProvider } from './providers/MujianProvider.tsx';
import { ReactRouterProvider } from './providers/RouterProvider.tsx';
createRoot(document.getElementById('root')!).render(
<MujianProvider>
<ReactRouterProvider />
</MujianProvider>,
<MujianProvider>
<ReactRouterProvider />
</MujianProvider>,
);

View File

@@ -2,9 +2,9 @@ import './index.css';
// import { useGlobalStore } from "@/store/global";
function About() {
// const { count, increment } = useGlobalStore((state) => state);
// const { count, increment } = useGlobalStore((state) => state);
return <div>about page</div>;
return <div>about page</div>;
}
export default About;

View File

@@ -4,39 +4,39 @@ import { isEmpty } from 'lodash-es';
import { EVENT, useMujian } from '@/providers/MujianProvider';
function Home() {
const { count, increment } = useGlobalStore((state) => state);
const mujian = useMujian();
const { count, increment } = useGlobalStore((state) => state);
const mujian = useMujian();
console.log('count', count);
console.log('count', count);
console.log('isEmpty', isEmpty(count));
console.log('isEmpty', isEmpty(count));
return (
<>
<div>
<div className="text-3xl font-bold underline">Hello World2</div>
</div>
<h1>Vite + React</h1>
<button type="button" onClick={increment}>
Increment
</button>
return (
<>
<div>
<div className="text-3xl font-bold underline">Hello World2</div>
</div>
<h1>Vite + React</h1>
<button type="button" onClick={increment}>
Increment
</button>
<p>Count: {count}</p>
<p>Count: {count}</p>
<br />
<br />
<button
type="button"
onClick={async () => {
mujian.emit(EVENT.MUJIAN_AI_CHAT_SEND_MESSAGE, {
message: 'Hello, World!',
});
}}
>
Hello
</button>
</>
);
<button
type="button"
onClick={async () => {
mujian.emit(EVENT.MUJIAN_AI_CHAT_SEND_MESSAGE, {
message: 'Hello, World!',
});
}}
>
Hello
</button>
</>
);
}
export default Home;

View File

@@ -2,11 +2,11 @@
import { MujianSdk } from '@mujian/js-sdk';
import {
createContext,
type ReactNode,
useContext,
useEffect,
useState,
createContext,
type ReactNode,
useContext,
useEffect,
useState,
} from 'react';
export { EVENT } from '@mujian/js-sdk';
@@ -14,38 +14,38 @@ export { EVENT } from '@mujian/js-sdk';
const MujianContext = createContext<MujianSdk | null>(null);
export interface MujianProviderProps {
children: ReactNode;
loadingPage?: ReactNode;
children: ReactNode;
loadingPage?: ReactNode;
}
export const MujianProvider = ({
children,
loadingPage,
children,
loadingPage,
}: MujianProviderProps) => {
const [mujian, setMujian] = useState<MujianSdk | null>(null);
const [mujian, setMujian] = useState<MujianSdk | null>(null);
useEffect(() => {
(async () => {
const mujian = new MujianSdk();
await mujian.init();
setMujian(mujian);
})();
}, []);
useEffect(() => {
(async () => {
const mujian = new MujianSdk();
await mujian.init();
setMujian(mujian);
})();
}, []);
return (
<MujianContext.Provider value={mujian}>
{mujian ? children : (loadingPage ?? 'Mujian is loading')}
</MujianContext.Provider>
);
return (
<MujianContext.Provider value={mujian}>
{mujian ? children : (loadingPage ?? 'Mujian is loading')}
</MujianContext.Provider>
);
};
export const useMujian = () => {
const mujian = useContext(MujianContext);
if (!mujian) {
const message =
'Mujian is not initialized. Please check that useMujian is called inside MujianProvider';
console.error(message);
throw new Error(message);
}
return mujian;
const mujian = useContext(MujianContext);
if (!mujian) {
const message =
'Mujian is not initialized. Please check that useMujian is called inside MujianProvider';
console.error(message);
throw new Error(message);
}
return mujian;
};

View File

@@ -4,16 +4,16 @@ import About from '@/pages/about';
import Home from '@/pages/home';
const router = createBrowserRouter([
{
path: '/',
element: <Home />,
},
{
path: '/about',
element: <About />,
},
{
path: '/',
element: <Home />,
},
{
path: '/about',
element: <About />,
},
]);
export const ReactRouterProvider = () => {
return <RouterProvider router={router} />;
return <RouterProvider router={router} />;
};

View File

@@ -1,14 +1,14 @@
import { create } from 'zustand';
type GlobalState = {
count: number;
increment: () => void;
count: number;
increment: () => void;
};
export const useGlobalStore = create<GlobalState>((set) => ({
count: 0,
increment: () => {
console.log('increment');
set((state) => ({ count: state.count + 1 }));
},
count: 0,
increment: () => {
console.log('increment');
set((state) => ({ count: state.count + 1 }));
},
}));

View File

@@ -1,14 +1,14 @@
@import "tailwindcss";
:root {
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;
color-scheme: light dark;
color-scheme: light dark;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}