localstorage is not defined nextjs

1// components
2function Storage(props) {
3	const LocalStorage = ({ type, keys, value, onLocalStorage }) => {
4		switch (type) {
5			case 'set':
6				keys !== undefined && window.localStorage.setItem(keys, value)
7				break
8			case 'get':
9				keys !== undefined && onLocalStorage(window.localStorage.getItem(keys))
10				break
11			case 'remove':
12				keys !== undefined && window.localStorage.removeItem(keys)
13				break
14			case 'clear':
15				keys !== undefined && window.localStorage.clear()
16				break
17			default:
18				alert('localStorage type undefined')
19				break
20		}
21	}
22
23	return <div>{LocalStorage(props)}</div>
24}
25
26export default Storage
27
28// pages component
29import dynamic from 'next/dynamic'
30
31const LocaStorage = dynamic(() => import('../components/Storage'), { ssr: false })
32
33function Home() {
34	const getLocalStorage = (val) => console.log(val)
35
36	return (
37		<>
38			<LocaStorage type={'set'} keys={'name'} value={'My name is restu wahyu saputra'} />
39			<LocaStorage type={'get'} keys={'name'} onLocalStorage={getLocalStorage} />
40		</>
41	)
42}
43
44export default Home