mirror/Checkmate
1
0
Fork 0
mirror of https://github.com/bluewave-labs/Checkmate.git synced 2026-05-19 16:08:39 -05:00
Code Issues Packages Projects Releases Wiki Activity

ui slice to TS

Browse Source
This commit is contained in:
Alex Holliday
2026-02-12 18:07:48 +00:00
parent b540e48aab
commit f38b305ba7
2 changed files with 133 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/Features/UI/uiSlice.js
-98
View File
@@ -1,98 +0,0 @@
import { createSlice } from "@reduxjs/toolkit";
const initialMode = window?.matchMedia?.("(prefers-color-scheme: dark)")?.matches
? "dark"
: "light";
const initialState = {
monitors: {
rowsPerPage: 10,
},
team: {
rowsPerPage: 5,
},
maintenance: {
rowsPerPage: 5,
},
infrastructure: {
rowsPerPage: 5,
},
logs: {
rowsPerPage: 15,
},
sidebar: {
collapsed: false,
},
mode: initialMode,
showURL: false,
greeting: { index: 0, lastUpdate: null },
timezone: "America/Toronto",
distributedUptimeEnabled: false,
language: "en",
starPromptOpen: true,
chartType: "histogram",
};
const uiSlice = createSlice({
name: "ui",
initialState,
reducers: {
setDistributedUptimeEnabled: (state, action) => {
state.distributedUptimeEnabled = action.payload;
},
setRowsPerPage: (state, action) => {
const { table, value } = action.payload;
if (!state[table]) {
state[table] = {};
}
state[table].rowsPerPage = value;
},
toggleSidebar: (state) => {
state.sidebar.collapsed = !state.sidebar.collapsed;
},
setCollapsed: (state, action) => {
const { collapsed } = action.payload;
state.sidebar.collapsed = collapsed;
},
setMode: (state, action) => {
state.mode = action.payload;
},
setShowURL: (state, action) => {
state.showURL = action.payload;
},
setGreeting(state, action) {
if (!state.greeting) {
state.greeting = { index: 0, lastUpdate: null };
}
state.greeting.index = action.payload.index;
state.greeting.lastUpdate = action.payload.lastUpdate;
},
setTimezone(state, action) {
state.timezone = action.payload.timezone;
},
setLanguage: (state, action) => {
state.language = action.payload;
},
setStarPromptOpen: (state, action) => {
state.starPromptOpen = action.payload;
},
setChartType: (state, action) => {
state.chartType = action.payload;
},
},
});
export default uiSlice.reducer;
export const {
setRowsPerPage,
toggleSidebar,
setCollapsed,
setMode,
setShowURL,
setGreeting,
setTimezone,
setDistributedUptimeEnabled,
setLanguage,
setStarPromptOpen,
setChartType,
} = uiSlice.actions;
client/src/Features/UI/uiSlice.ts
+133
View File
@@ -0,0 +1,133 @@
import { createSlice, type PayloadAction } from "@reduxjs/toolkit";
type ThemeMode = "light" | "dark";
type ChartType = "histogram" | "line";
type TableName = "monitors" | "team" | "maintenance" | "infrastructure" | "logs";
interface TableState {
rowsPerPage: number;
}
interface SidebarState {
collapsed: boolean;
}
interface GreetingState {
index: number;
lastUpdate: string | null;
}
interface UIState {
monitors: TableState;
team: TableState;
maintenance: TableState;
infrastructure: TableState;
logs: TableState;
sidebar: SidebarState;
mode: ThemeMode;
showURL: boolean;
greeting: GreetingState;
timezone: string;
distributedUptimeEnabled: boolean;
language: string;
starPromptOpen: boolean;
chartType: ChartType;
}
const initialMode: ThemeMode = window?.matchMedia?.("(prefers-color-scheme: dark)")
?.matches
? "dark"
: "light";
const initialState: UIState = {
monitors: {
rowsPerPage: 10,
},
team: {
rowsPerPage: 5,
},
maintenance: {
rowsPerPage: 5,
},
infrastructure: {
rowsPerPage: 5,
},
logs: {
rowsPerPage: 15,
},
sidebar: {
collapsed: false,
},
mode: initialMode,
showURL: false,
greeting: { index: 0, lastUpdate: null },
timezone: "America/Toronto",
distributedUptimeEnabled: false,
language: "en",
starPromptOpen: true,
chartType: "histogram",
};
const uiSlice = createSlice({
name: "ui",
initialState,
reducers: {
setDistributedUptimeEnabled: (state, action: PayloadAction<boolean>) => {
state.distributedUptimeEnabled = action.payload;
},
setRowsPerPage: (
state,
action: PayloadAction<{ table: TableName; value: number }>
) => {
const { table, value } = action.payload;
state[table].rowsPerPage = value;
},
toggleSidebar: (state) => {
state.sidebar.collapsed = !state.sidebar.collapsed;
},
setCollapsed: (state, action: PayloadAction<{ collapsed: boolean }>) => {
state.sidebar.collapsed = action.payload.collapsed;
},
setMode: (state, action: PayloadAction<ThemeMode>) => {
state.mode = action.payload;
},
setShowURL: (state, action: PayloadAction<boolean>) => {
state.showURL = action.payload;
},
setGreeting: (
state,
action: PayloadAction<{ index: number; lastUpdate: string | null }>
) => {
state.greeting.index = action.payload.index;
state.greeting.lastUpdate = action.payload.lastUpdate;
},
setTimezone: (state, action: PayloadAction<{ timezone: string }>) => {
state.timezone = action.payload.timezone;
},
setLanguage: (state, action: PayloadAction<string>) => {
state.language = action.payload;
},
setStarPromptOpen: (state, action: PayloadAction<boolean>) => {
state.starPromptOpen = action.payload;
},
setChartType: (state, action: PayloadAction<ChartType>) => {
state.chartType = action.payload;
},
},
});
export type { UIState, ThemeMode, ChartType, TableName };
export default uiSlice.reducer;
export const {
setRowsPerPage,
toggleSidebar,
setCollapsed,
setMode,
setShowURL,
setGreeting,
setTimezone,
setDistributedUptimeEnabled,
setLanguage,
setStarPromptOpen,
setChartType,
} = uiSlice.actions;