From ffff8285670c8f5e8a0e7cd5ed2d44ec4fd62e59 Mon Sep 17 00:00:00 2001
From: wrigh393 <wrigh393@purdue.edu>
Date: Wed, 24 Mar 2021 16:24:09 -0400
Subject: [PATCH] Added toolbar icon for Dark mode controls in Storybook

---
 .storybook/preview.js | 21 +++++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/.storybook/preview.js b/.storybook/preview.js
index cf44e79..ccc2100 100644
--- a/.storybook/preview.js
+++ b/.storybook/preview.js
@@ -1,9 +1,22 @@
-import React from "react";
+import React, { useState } from "react";
 import ItemProvider from '../src/components/ItemProvider';
 import { ThemeProvider } from "@material-ui/core/styles";
 import webqueueTheme from "../src/theme";
 
-const theme = webqueueTheme();
+const theme = webqueueTheme(false);
+
+export const globalTypes = {
+  theme: {
+    name: 'Theme',
+    description: 'Global theme for components',
+    defaultValue: 'false',
+    toolbar: {
+      icon: 'mirror',
+      // array of plain string values or MenuItem shape (see below)
+      items: ["light", "dark"],
+    },
+  },
+};
 
 export const decorators = [
   (Story) => (
@@ -11,9 +24,9 @@ export const decorators = [
       <Story />
     </ItemProvider>
   ),
-  (Story) => (
+  (Story, context) => (
     <ThemeProvider theme={theme}>
-      <Story />
+      <Story {...context} />
     </ThemeProvider>
   ),
 ];