summaryrefslogtreecommitdiffstats
path: root/src/hooks
diff options
context:
space:
mode:
authorGravatar Tom van der Lee <tom@vanderlee.io>2022-01-25 21:42:51 +0100
committerGravatar Tom van der Lee <tom@vanderlee.io>2022-01-25 22:06:58 +0100
commitf9cd68181137c72e92c6951efd9b8d29c4b73bc1 (patch)
treea58451fb140d9c5ea023a45bd393127519a7918f /src/hooks
parent2f27e222add9bf10b55971ab915ac411e81d24f0 (diff)
downloadclient-f9cd68181137c72e92c6951efd9b8d29c4b73bc1.tar.gz
client-f9cd68181137c72e92c6951efd9b8d29c4b73bc1.tar.bz2
client-f9cd68181137c72e92c6951efd9b8d29c4b73bc1.zip
Added dark mode
Diffstat (limited to 'src/hooks')
-rw-r--r--src/hooks/useDarkMode.tsx21
-rw-r--r--src/hooks/useRequests.tsx5
2 files changed, 26 insertions, 0 deletions
diff --git a/src/hooks/useDarkMode.tsx b/src/hooks/useDarkMode.tsx
new file mode 100644
index 0000000..fe4ce95
--- /dev/null
+++ b/src/hooks/useDarkMode.tsx
@@ -0,0 +1,21 @@
1import {useEffect, useMemo, useState} from "react";
2import {ThemeConfig} from "bootstrap-darkmode";
3
4export interface UseDarkMode {
5 darkMode: boolean
6 toggle: () => void
7}
8
9export default function useDarkMode() {
10 const themeConfig = useMemo(() => new ThemeConfig(), []);
11 const [darkMode, setDarkMode] = useState(() => themeConfig.getTheme() === 'dark')
12
13 useEffect(() => {
14 themeConfig.setTheme(darkMode ? 'dark' : 'light');
15 }, [darkMode])
16
17 return {
18 darkMode,
19 toggle: () => setDarkMode(dm => !dm),
20 }
21}
diff --git a/src/hooks/useRequests.tsx b/src/hooks/useRequests.tsx
index 5ac70a4..cb85162 100644
--- a/src/hooks/useRequests.tsx
+++ b/src/hooks/useRequests.tsx
@@ -57,6 +57,7 @@ export interface useRequestsProps {
57export interface UseRequests { 57export interface UseRequests {
58 calls: RequestResponse[] 58 calls: RequestResponse[]
59 readyState: ReadyState 59 readyState: ReadyState
60 clear: () => void
60} 61}
61 62
62export default function useRequests({ onConnect }: useRequestsProps): UseRequests { 63export default function useRequests({ onConnect }: useRequestsProps): UseRequests {
@@ -124,5 +125,9 @@ export default function useRequests({ onConnect }: useRequestsProps): UseRequest
124 response: responses.find(({id}) => id === request.id) 125 response: responses.find(({id}) => id === request.id)
125 })), [requests, responses]), 126 })), [requests, responses]),
126 readyState, 127 readyState,
128 clear: () => {
129 setRequests([])
130 setResponses([])
131 }
127 } 132 }
128} 133}