From 879db2000b99e1bc51aae0758c71beabcc9768bb Mon Sep 17 00:00:00 2001
From: Ramon Wenger <ramon.wenger@iterativ.ch>
Date: Mon, 17 Feb 2020 16:14:48 +0100
Subject: [PATCH] Toggle the new sidebar

---
 client/src/components/UserWidget.vue                | 13 ++++++++++++-
 client/src/graphql/client.js                        |  4 ++++
 .../graphql/gql/local/mutations/toggleSidebar.gql   |  3 +++
 client/src/graphql/gql/local/sidebar.gql            |  5 +++++
 client/src/graphql/resolvers.js                     |  7 +++++++
 client/src/graphql/typedefs.js                      |  4 ++++
 6 files changed, 35 insertions(+), 1 deletion(-)
 create mode 100644 client/src/graphql/gql/local/mutations/toggleSidebar.gql
 create mode 100644 client/src/graphql/gql/local/sidebar.gql

diff --git a/client/src/components/UserWidget.vue b/client/src/components/UserWidget.vue
index 7de9e75d..ff653128 100644
--- a/client/src/components/UserWidget.vue
+++ b/client/src/components/UserWidget.vue
@@ -1,8 +1,9 @@
 <template>
   <div class="user-widget" :class="{'user-widget--is-profile': isProfile}">
-    <div class="user-widget__avatar" @click="toggleShowPopover()">
+    <div class="user-widget__avatar" @click="openSidebar()">
       <avatar :avatar-url="avatarUrl" :icon-highlighted="isProfile"/>
     </div>
+    <!-- todo: migrate and remove -->
     <widget-popover v-if="showPopover && showMenu"
                     @hide-me="showPopover = false"
                     :mobile="mobile"
@@ -27,6 +28,7 @@
 
 <script>
   import LOGOUT_MUTATION from '@/graphql/gql/mutations/logoutUser.gql';
+  import TOGGLE_SIDEBAR from '@/graphql/gql/local/mutations/toggleSidebar.gql';
   import Avatar from '@/components/profile/Avatar';
   import WidgetPopover from '@/components/WidgetPopover';
 
@@ -58,6 +60,15 @@
     },
 
     methods: {
+      openSidebar() {
+        this.$apollo.mutate({
+          mutation: TOGGLE_SIDEBAR,
+          variables: {
+            open: true
+          }
+        });
+      },
+      // todo: remove
       toggleShowPopover() {
         if (this.showMenu) {
           this.showPopover = !this.showPopover;
diff --git a/client/src/graphql/client.js b/client/src/graphql/client.js
index 9d287d8b..36667b23 100644
--- a/client/src/graphql/client.js
+++ b/client/src/graphql/client.js
@@ -102,6 +102,10 @@ export default function (uri) {
       scrollPosition: {
         __typename: 'ScrollPosition',
         scrollTo: ''
+      },
+      sidebar: {
+        __typename: 'Sidebar',
+        open: false
       }
     }
   });
diff --git a/client/src/graphql/gql/local/mutations/toggleSidebar.gql b/client/src/graphql/gql/local/mutations/toggleSidebar.gql
new file mode 100644
index 00000000..fc32729e
--- /dev/null
+++ b/client/src/graphql/gql/local/mutations/toggleSidebar.gql
@@ -0,0 +1,3 @@
+mutation($open: Boolean!) {
+  toggleSidebar(open: $open) @client
+}
diff --git a/client/src/graphql/gql/local/sidebar.gql b/client/src/graphql/gql/local/sidebar.gql
new file mode 100644
index 00000000..4cdb1bc6
--- /dev/null
+++ b/client/src/graphql/gql/local/sidebar.gql
@@ -0,0 +1,5 @@
+query Sidebar {
+  sidebar @client {
+    open
+  }
+}
diff --git a/client/src/graphql/resolvers.js b/client/src/graphql/resolvers.js
index 4b8b8845..bf816210 100644
--- a/client/src/graphql/resolvers.js
+++ b/client/src/graphql/resolvers.js
@@ -1,4 +1,5 @@
 import SCROLL_POSITION from '@/graphql/gql/local/scrollPosition.gql';
+import SIDEBAR from '@/graphql/gql/local/sidebar.gql';
 
 export const resolvers = {
   Mutation: {
@@ -7,6 +8,12 @@ export const resolvers = {
       data.scrollPosition.scrollTo = scrollTo;
       cache.writeQuery({query: SCROLL_POSITION, data});
       return data.scrollPosition;
+    },
+    toggleSidebar: (_, {open}, {cache}) => {
+      const data = cache.readQuery({query: SIDEBAR});
+      data.sidebar.open = open;
+      cache.writeQuery({query: SIDEBAR, data});
+      return data.sidebar;
     }
   }
 };
diff --git a/client/src/graphql/typedefs.js b/client/src/graphql/typedefs.js
index effdbebf..acd05f0c 100644
--- a/client/src/graphql/typedefs.js
+++ b/client/src/graphql/typedefs.js
@@ -5,6 +5,10 @@ export const typeDefs = gql`
     scrollTo: String!
   }
   
+  type Sidebar {    
+    open: Boolean!
+  }
+  
   type Mutation {
     scrollTo(scrollTo: String!): ScrollPosition
   }