49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
|
|
import { Dimensions } from "react-native";
|
|
|
|
import type { RootState } from "../index";
|
|
|
|
export interface ScreenSizeState {
|
|
width: number;
|
|
height: number;
|
|
isMobile: boolean;
|
|
sidebarCollapsed: boolean;
|
|
}
|
|
|
|
const initialDimensions = Dimensions.get("window");
|
|
|
|
const initialState: ScreenSizeState = {
|
|
width: initialDimensions.width,
|
|
height: initialDimensions.height,
|
|
isMobile: initialDimensions.width < 768,
|
|
sidebarCollapsed: false,
|
|
};
|
|
|
|
export const screenSizeSlice = createSlice({
|
|
name: "screenSize",
|
|
initialState,
|
|
reducers: {
|
|
setScreenSize: (
|
|
state,
|
|
action: PayloadAction<{ width: number; height: number }>
|
|
) => {
|
|
state.width = action.payload.width;
|
|
state.height = action.payload.height;
|
|
state.isMobile = action.payload.width < 768;
|
|
},
|
|
setSidebarCollapsed: (state, action: PayloadAction<boolean>) => {
|
|
state.sidebarCollapsed = action.payload;
|
|
},
|
|
},
|
|
});
|
|
|
|
export const { setScreenSize, setSidebarCollapsed } = screenSizeSlice.actions;
|
|
|
|
export const selectScreenSize = (state: RootState) => state.screenSize;
|
|
export const selectIsMobile = (state: RootState) => state.screenSize.isMobile;
|
|
export const selectWidth = (state: RootState) => state.screenSize.width;
|
|
export const selectHeight = (state: RootState) => state.screenSize.height;
|
|
export const selectSidebarCollapsed = (state: RootState) => state.screenSize.sidebarCollapsed;
|
|
|
|
export default screenSizeSlice.reducer;
|