From c2734ab5be4908f3b0e56d6f347b56f0a5983cd7 Mon Sep 17 00:00:00 2001
From: Andrew Nicolaou <me@andrewnicolaou.co.uk>
Date: Sun, 19 Apr 2020 20:29:17 +0200
Subject: [PATCH] Send current theme variables directly into provider

---
 client/index.jsx |  2 +-
 client/theme.js  | 26 ++++++++++++++++++++------
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/client/index.jsx b/client/index.jsx
index 140ef596..a1a880bb 100644
--- a/client/index.jsx
+++ b/client/index.jsx
@@ -22,7 +22,7 @@ const store = configureStore(initialState);
 const currentTheme = Theme.light;
 
 const App = () => (
-  <ThemeProvider theme={{ ...theme, current: theme[currentTheme] }}>
+  <ThemeProvider theme={{ ...theme[currentTheme] }}>
     <Provider store={store}>
       <Router history={history} routes={routes(store)} />
     </Provider>
diff --git a/client/theme.js b/client/theme.js
index 1d90e8fc..2a8b54f3 100644
--- a/client/theme.js
+++ b/client/theme.js
@@ -15,7 +15,15 @@ export const common = {
 
 export const remSize = size => `${size / common.baseFontSize}rem`;
 
-export const prop = key => props => props.theme[key];
+export const prop = key => (props) => {
+  const value = props.theme[key];
+
+  if (value == null) {
+    throw new Error(`themed prop ${key} not found`);
+  }
+
+  return value;
+};
 
 export default {
   [Theme.light]: {
@@ -23,32 +31,38 @@ export default {
     ...common,
     primaryTextColor: '#333',
 
-    buttonColor: '#f10046',
-    buttonColorBackground: '#fff',
+    buttonColor: '#000',
+    buttonColorBackground: '#f4f4f4',
     buttonBorderColor: '#b5b5b5',
     buttonHoverColor: '#fff',
     buttonHoverColorBackground: colors.p5pink,
+    buttonDisabledColor: '#f10046',
+    buttonDisabledColorBackground: '#fff',
   },
   [Theme.dark]: {
     colors,
     ...common,
     primaryTextColor: '#FFF',
 
-    buttonColor: '#f10046',
-    buttonColorBackground: '#fff',
+    buttonColor: '#000',
+    buttonColorBackground: '#f4f4f4',
     buttonBorderColor: '#b5b5b5',
     buttonHoverColor: '#fff',
     buttonHoverColorBackground: colors.p5pink,
+    buttonDisabledColor: '#f10046',
+    buttonDisabledColorBackground: '#fff',
   },
   [Theme.contrast]: {
     colors,
     ...common,
     primaryTextColor: '#F5DC23',
 
-    buttonColor: '#333',
+    buttonColor: '#000',
     buttonColorBackground: colors.yellow,
     buttonBorderColor: '#b5b5b5',
     buttonHoverColor: '#333',
     buttonHoverColorBackground: '#fff',
+    buttonDisabledColor: '#333',
+    buttonDisabledColorBackground: colors.yellow,
   },
 };