From af498e744e51947f0e79abfa1678bb9fd72ff51e Mon Sep 17 00:00:00 2001
From: John Kane <john@kanej.me>
Date: Fri, 25 Oct 2019 16:23:53 +0100
Subject: [PATCH] feat(header): remove placeholders

Removes the user avatar placeholders on the page header, and the group name

#62
---
 src/Layout.tsx | 45 ++++-----------------------------------------
 src/Store.ts   |  1 -
 2 files changed, 4 insertions(+), 42 deletions(-)

diff --git a/src/Layout.tsx b/src/Layout.tsx
index fed95d3..17c51dd 100644
--- a/src/Layout.tsx
+++ b/src/Layout.tsx
@@ -10,27 +10,15 @@ const HEADER_HEIGHT = 80
 const FOOTER_HEIGHT = 60
 const BACKGROUND = '3578E5'
 
-function useLayout({ store }: { store: Store }) {
-  const members = [1, 2, 3, 4, 5]
-
-  useEffect(() => {
-    store.groupsGetAll()
-  }, [store])
-
-  return {
-    members
-  }
-}
-
 export interface LayoutProps {
   store: Store
   children: ReactElement
 }
 
 const Layout = ({ store, children }: LayoutProps) => {
-  const { members } = useLayout({
-    store
-  })
+  useEffect(() => {
+    store.groupsGetAll()
+  }, [store])
 
   return (
     <Section>
@@ -43,20 +31,7 @@ const Layout = ({ store, children }: LayoutProps) => {
           Permaweb
         </Title>
         <Bar>
-          <Sub>Group name</Sub>
           <Info>
-            <div>90</div>
-            <Members maxCount={5}>
-              {members.map((member, i) => {
-                return (
-                  <Img
-                    src="https://picsum.photos/seed/picsum/30/30"
-                    alt=""
-                    key={i}
-                  />
-                )
-              })}
-            </Members>
             <div>Share</div>
             <div>Edit</div>
           </Info>
@@ -119,17 +94,12 @@ const Title = styled.h1`
 
 const Bar = styled.div`
   display: grid;
-  grid-template-columns: auto 1fr;
+  grid-template-columns: auto;
   align-items: center;
   height: ${HEADER_HEIGHT}px;
   padding: 0 10px;
 `
 
-const Sub = styled.h2`
-  padding: 0;
-  margin: 0;
-`
-
 const Info = styled.div`
   display: inline-grid;
   grid-template-columns: auto auto auto auto;
@@ -138,13 +108,6 @@ const Info = styled.div`
   margin-left: auto;
 `
 
-const Members = styled.div`
-  display: grid;
-  grid-template-columns: ${({ maxCount }: { maxCount: number }) =>
-    `repeat(${maxCount}, auto)`};
-  grid-gap: 5px;
-`
-
 /* content */
 
 const Main = styled.main`
diff --git a/src/Store.ts b/src/Store.ts
index 5750b02..3af9c1b 100644
--- a/src/Store.ts
+++ b/src/Store.ts
@@ -78,7 +78,6 @@ class Store {
   }
 
   @action
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   async groupsAdd(groupName: string) {
     if (!this.schema) {
       throw new Error('Schema not loaded')