From 527aeeeced9fdcc2fc3a6a08c58ceb3a17ae2122 Mon Sep 17 00:00:00 2001
From: William Carroll <wpcarro@gmail.com>
Date: Tue, 24 Mar 2020 13:27:30 +0000
Subject: Add sandbox project using Contentful CMS

I used the boilerplate/typescript project as a starting point. This project
fetches and renders books that I'm defining in a Contentful CMS that I created.
---
 website/sandbox/contentful/src/store.ts | 36 +++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 website/sandbox/contentful/src/store.ts

(limited to 'website/sandbox/contentful/src/store.ts')

diff --git a/website/sandbox/contentful/src/store.ts b/website/sandbox/contentful/src/store.ts
new file mode 100644
index 000000000000..c4396d681a17
--- /dev/null
+++ b/website/sandbox/contentful/src/store.ts
@@ -0,0 +1,36 @@
+import { createSlice, configureStore, PayloadAction } from "@reduxjs/toolkit";
+import { useSelector, TypedUseSelectorHook } from "react-redux";
+
+export interface Book {
+  title: string;
+  author: string;
+  // TODO(wpcarro): Prefer datetime type here.
+  publicationDate: string;
+}
+
+export interface State {
+  isLoading: boolean;
+  books: Book[];
+}
+
+const initialState: State = {
+  isLoading: true,
+  books: [],
+};
+
+export const { actions, reducer } = createSlice({
+  name: "application",
+  initialState,
+  reducers: {
+    toggleIsLoading: state => ({ ...state, isLoading: !state.isLoading }),
+    setBooks: (state, action) => ({ ... state, books: action.payload }),
+  }
+});
+
+/**
+ * Defining and consuming this allows us to avoid annotating State in all of our
+ * selectors.
+ */
+export const useTypedSelector: TypedUseSelectorHook<State> = useSelector;
+
+export default configureStore({ reducer });
-- 
cgit 1.4.1