z

web/src/App.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
-import { Provider, useSelector } from 'react-redux';
+import { useSelector } from 'react-redux';
-import { AppActions, RootState, store } from './store';
+import { AppActions, RootState } from './store';
 import { ToastContainer } from 'react-toastify';
 import { Box } from 'lr-components';
 import { NextUIProvider } from '@nextui-org/react';
@@ -9,7 +9,7 @@ import { isEnvBrowser } from './utils/misc';
 import { fetchNui } from './utils/fetchNui';
 
 function App() {
-  const show = useSelector((state: RootState) => state.state.show);
+  const show = useSelector((state: RootState) => state.main.show);
   useEffect(() => {
     if (!isEnvBrowser()) {
       setTimeout(() => {
@@ -20,7 +20,6 @@ function App() {
   return (
     show && (
       <NextUIProvider>
-        <Provider store={store}>
         <Box
           display='flex'
           position='absolute'
@@ -51,7 +50,6 @@ function App() {
         ></Box>
 
         <ToastContainer pauseOnFocusLoss={false} hideProgressBar={true} />
-        </Provider>
       </NextUIProvider>
     )
   );

web/src/main.tsx

@@ -2,9 +2,13 @@ import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
 import './index.css';
+import { Provider } from 'react-redux';
+import { store } from './store';
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
+    <Provider store={store}>
       <App />
+    </Provider>
   </React.StrictMode>
 );

web/src/store/index.ts

@@ -1,10 +1,11 @@
 import { configureStore } from '@reduxjs/toolkit';
+import mainSlice from './main';
 
 export const store = configureStore({
-  reducer: {},
+  reducer: { main: mainSlice.reducer },
 });
 
-export const AppActions = {};
+export const AppActions = { ...mainSlice.actions };
 
 // Infer the `RootState` and `AppDispatch` types from the store itself
 export type RootState = ReturnType<typeof store.getState>;

web/src/store/main/index.ts

@@ -0,0 +1,23 @@
+import { createSlice } from '@reduxjs/toolkit';
+
+interface InitialState {
+  show: boolean;
+}
+
+const initialState: InitialState = {
+  show: false,
+};
+
+const mainSlice = createSlice({
+  name: 'main',
+  initialState,
+  reducers: {
+    toggleShow(state) {
+      state.show = !state.show;
+    },
+  },
+});
+
+export const { toggleShow } = mainSlice.actions;
+
+export default mainSlice;