9f2a822a54
* Rendered a static reading list button to each bookcard component * Attached click listener to bookmark button to log book data * Clicking bookmark button saves book information to a localStorage array * Updated card height to account for button * Updated saveBookToLocalStorage function to use objects instead of arrays * Can now toggle books in and out of localStorage * Reverted previous 4 commits so that data isn't directly written to localStorage * Created a sidebar link to reading list * Added placeholder bookmarks page * Bookmark button now updates state in index.js * Initialized context API * Wrote a reducer function to handle bookmark state changes * Configured reducer to add books in and out of state * Reading list is now preserved between state AND localStorage when changing categories * Fixed some code format issues * Rendered saved books in reading list component * Toggle apperance of bookmark button * Hacky fix for positioning of reading list sidebar link * Adjusted style and alignment of bookmark button * Added check to determine if window is defined in useEffect * Exported the gatsby-ssr API
26 lines
659 B
JavaScript
26 lines
659 B
JavaScript
import React, { useReducer, useEffect } from 'react'
|
|
import bookReducer from './bookReducer'
|
|
|
|
export const BookmarkContext = React.createContext()
|
|
|
|
export default function GlobalState({children}) {
|
|
let [readingList, updateReadingList] = useReducer(bookReducer, {
|
|
books: {},
|
|
bookIds: []
|
|
})
|
|
|
|
useEffect(() => {
|
|
if (typeof window !== undefined) {
|
|
const retrievedBooks = JSON.parse(localStorage.getItem('Bookmarks'))
|
|
console.log(retrievedBooks)
|
|
updateReadingList({type: 'init', content: retrievedBooks})
|
|
}
|
|
}, [])
|
|
|
|
return (
|
|
<BookmarkContext.Provider value={{readingList, updateReadingList}}>
|
|
{children}
|
|
</BookmarkContext.Provider>
|
|
)
|
|
}
|