Skip to content

Commit

Permalink
fix: fix app crash
Browse files Browse the repository at this point in the history
this commit fixes a crash due to unavailability of localStorage

#31
  • Loading branch information
zyachel committed Jan 22, 2023
1 parent feffb7d commit 71d1d5b
Show file tree
Hide file tree
Showing 3 changed files with 24 additions and 3 deletions.
7 changes: 5 additions & 2 deletions src/context/theme-context.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import React, { useState, createContext, ReactNode } from 'react';
import { isLocalStorageAvailable } from '../utils/helpers';

const getInitialTheme = () => {
// for server-side rendering, as window isn't availabe there
if (typeof window === 'undefined') return 'light';

const userPrefersTheme = window.localStorage.getItem('theme') || null;
const userPrefersTheme = isLocalStorageAvailable()
? window.localStorage.getItem('theme')
: null;
const browserPrefersDarkTheme = window.matchMedia(
'(prefers-color-scheme: dark)'
).matches;
Expand Down Expand Up @@ -35,7 +38,7 @@ const ThemeProvider = ({ children }: { children: ReactNode }) => {

const setTheme = (theme: string) => {
setCurTheme(theme);
window.localStorage.setItem('theme', theme);
if (isLocalStorageAvailable()) window.localStorage.setItem('theme', theme);
document.documentElement.dataset.theme = theme;
updateMetaTheme();
};
Expand Down
10 changes: 9 additions & 1 deletion src/pages/_document.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,17 @@ import Document, { Html, Head, Main, NextScript } from 'next/document';
const setInitialTheme = `
(() => {
document.documentElement.dataset.js = true;
const isLocalStorageAvailable = () => {
try {
window.localStorage.getItem('test');
return true;
} catch (e) {
return false;
}
}
let theme = 'light';
let themeColor = '#ffe5ef';
const userPrefersTheme = window.localStorage.getItem('theme') || null;
const userPrefersTheme = isLocalStorageAvailable() ? window.localStorage.getItem('theme') : null;
const browserPrefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
if (userPrefersTheme) theme = userPrefersTheme;
else if (browserPrefersDarkTheme) theme = 'dark';
Expand Down
10 changes: 10 additions & 0 deletions src/utils/helpers.ts
Original file line number Diff line number Diff line change
Expand Up @@ -103,3 +103,13 @@ export const getResTitleTypeHeading = (
if (el.id === titleType) return el.name;
}
};


export const isLocalStorageAvailable = () => {
try {
localStorage.getItem('test');
return true;
} catch (e) {
return false;
}
};

0 comments on commit 71d1d5b

Please sign in to comment.