From 3e8ecdf0d8ab073344081d967904aed5a94d026b Mon Sep 17 00:00:00 2001
From: Roland Osborne <rolandosborne@gmail.com>
Date: Sat, 26 Mar 2022 22:57:09 -0700
Subject: [PATCH] styling sidebar

---
 net/web/src/AppContext/useAppContext.hook.js        | 13 ++++++-------
 net/web/src/User/Profile/Profile.jsx                |  2 +-
 net/web/src/User/Profile/Profile.styled.js          |  4 +++-
 net/web/src/User/Profile/useProfile.hook.js         |  6 +++---
 .../SideBar/Contacts/Cards/Registry/Registry.jsx    |  2 +-
 .../Contacts/Cards/Registry/Registry.styled.js      | 11 ++++++++++-
 6 files changed, 24 insertions(+), 14 deletions(-)

diff --git a/net/web/src/AppContext/useAppContext.hook.js b/net/web/src/AppContext/useAppContext.hook.js
index 05d0d3f2..68dddbd3 100644
--- a/net/web/src/AppContext/useAppContext.hook.js
+++ b/net/web/src/AppContext/useAppContext.hook.js
@@ -3,7 +3,6 @@ import { setProfileImage, setProfileData, getProfileImageUrl, getAccountStatus,
 
 async function updateAccount(token, updateData) {
   let status = await getAccountStatus(token);
-console.log(status);
   updateData({ status: status });
 }
 
@@ -112,18 +111,18 @@ export function useAppContext() {
     while(revision.current != null) {
       let rev = revision.current;
 
-      // update group if revision changed
-      if (rev.group != groupRevision.current) {
-        await updateGroups(token, groupRevision.current, groups.current, updateData);
-        groupRevision.current = rev.group
-      }
-
       // update profile if revision changed
       if (rev.profile != profileRevision.current) {
         await updateProfile(token, updateData) 
         profileRevision.current = rev.profile
       }
 
+      // update group if revision changed
+      if (rev.group != groupRevision.current) {
+        await updateGroups(token, groupRevision.current, groups.current, updateData);
+        groupRevision.current = rev.group
+      }
+
       // update account status if revision changed
       if (rev.account != accountRevision.current) {
         await updateAccount(token, updateData)
diff --git a/net/web/src/User/Profile/Profile.jsx b/net/web/src/User/Profile/Profile.jsx
index cc4c4e31..3ba05af5 100644
--- a/net/web/src/User/Profile/Profile.jsx
+++ b/net/web/src/User/Profile/Profile.jsx
@@ -96,10 +96,10 @@ export function Profile(props) {
             <Checkbox checked={state.searchable} onChange={(e) => onSearchable(e.target.checked)} />
           </div>
           <div class="avatar" onClick={() => setLogoVisible(true)}>
-            <Logo />
             <div class="logoedit">
               <EditIcon />
             </div>
+            <Logo />
           </div>
           <div class="block" onClick={() => setInfoVisible(true)}>
             <span class="label">details:</span>
diff --git a/net/web/src/User/Profile/Profile.styled.js b/net/web/src/User/Profile/Profile.styled.js
index 38ec5f40..da0f5d73 100644
--- a/net/web/src/User/Profile/Profile.styled.js
+++ b/net/web/src/User/Profile/Profile.styled.js
@@ -95,13 +95,15 @@ export const ProfileWrapper = styled.div`
   .logoedit {
     align-self: flex-end;
     font-size: 16px;
-    position: absolute;
+    position: relative;
     padding-right: 8px;
     cursor: pointer;
     background: #f6f5ed;
     padding-left: 8px;
     border-radius: 4px;
     border: 1px solid #dddddd;
+    z-index: 10;
+    left: 192px;
   }
 
   .detailedit {
diff --git a/net/web/src/User/Profile/useProfile.hook.js b/net/web/src/User/Profile/useProfile.hook.js
index e3d3538f..56fb9bd9 100644
--- a/net/web/src/User/Profile/useProfile.hook.js
+++ b/net/web/src/User/Profile/useProfile.hook.js
@@ -79,10 +79,10 @@ export function useProfile() {
               img.onload = () => {
                 var canvas = document.createElement("canvas");
                 var context = canvas.getContext('2d');
-                canvas.width = 256;
-                canvas.height = 256;
+                canvas.width = 128;
+                canvas.height = 128;
                 context.drawImage(img, state.crop.x, state.crop.y, state.crop.w, state.crop.h,
-                    0, 0, 256, 256);
+                    0, 0, 128, 128);
                 resolve(canvas.toDataURL());
               }
               img.onerror = reject;
diff --git a/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.jsx b/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.jsx
index 1bff3baa..5dfd3e23 100644
--- a/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.jsx
+++ b/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.jsx
@@ -6,7 +6,7 @@ export function Registry() {
   return (
     <RegistryWrapper>
       <Input.Search placeholder="Server" allowClear style={{ width: '100%' }} />
-    
+      <div class="contacts" />
     </RegistryWrapper>
   );
 }
diff --git a/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.styled.js b/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.styled.js
index 890dd2b2..e0e91632 100644
--- a/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.styled.js
+++ b/net/web/src/User/SideBar/Contacts/Cards/Registry/Registry.styled.js
@@ -2,10 +2,19 @@ import styled from 'styled-components';
 
 export const RegistryWrapper = styled.div`
   position: relative;
-  width: 100%;
   padding-left: 8px;
   padding-right: 8px;
   text-align: center;
+  height: calc(100vh - 143px);
+  display: flex;
+  flex-direction: column;
+
+  .contacts {
+    flex-grow: 1
+    background-color: #fefefe;
+    border-radius-bottom-right: 8px;
+    border-radius-bottom-left: 8px;
+  }
 `;