github.com/grafana/pyroscope@v1.18.0/public/app/redux/reducers/ui.ts (about) 1 import { createSlice, createSelector, PayloadAction } from '@reduxjs/toolkit'; 2 import { createMigrate } from 'redux-persist'; 3 import storage from 'redux-persist/lib/storage'; 4 import { PersistedState } from 'redux-persist/lib/types'; 5 import type { RootState } from '@pyroscope/redux/store'; 6 7 // Persistence Migrations 8 // See examples on https://github.com/rt2zz/redux-persist/blob/master/docs/migrations.md 9 export const migrations = { 10 0: (state: PersistedState) => { 11 if (!state) { 12 return {} as PersistedState; 13 } 14 15 return { ...state }; 16 }, 17 }; 18 19 export const persistConfig = { 20 key: 'pyroscope:ui', 21 version: 0, 22 storage, 23 migrate: createMigrate(migrations, { debug: true }), 24 }; 25 26 export interface UiState { 27 time: { 28 offset: null | number; 29 }; 30 colorMode: 'dark' | 'light'; 31 } 32 33 const initialState: UiState = { 34 time: { 35 offset: null, 36 }, 37 // sidebar: { state: 'pristine' }, 38 colorMode: 'dark', 39 }; 40 41 export const uiSlice = createSlice({ 42 name: 'ui', 43 initialState, 44 reducers: { 45 changeTimeZoneOffset: (state, action) => { 46 state.time.offset = action.payload; 47 }, 48 setColorMode: (state, action: PayloadAction<'dark' | 'light'>) => { 49 state.colorMode = action.payload; 50 }, 51 }, 52 }); 53 54 const selectUiState = (state: RootState) => state.ui; 55 56 export const selectTimezoneOffset = createSelector( 57 selectUiState, 58 (state) => state.time.offset 59 ); 60 61 export const selectAppColorMode = createSelector( 62 selectUiState, 63 (state) => state.colorMode 64 ); 65 66 export const { changeTimeZoneOffset, setColorMode } = uiSlice.actions; 67 68 export default uiSlice.reducer;