Organization List Redesign #799

elraphty · 2023-10-06T15:59:47Z

Describe your changes

This PR updates the new Organization redesign list

Issue ticket number and link

Closes #770

Type of change

Bug fix (non-breaking change which fixes an issue)

Checklist before requesting a review

I have performed a self-review of my code
I have tested on Chrome and Firefox
I have tested on a mobile device

kevkevinpal · 2023-10-10T20:57:58Z

frontend/app/src/components/common/IconButton.tsx

@@ -8,7 +8,7 @@ interface BProps {
  background: string;
  width: string;
 }
-const B = styled(EuiButton)<BProps>`
+const B = styled(EuiButton) <BProps>`


do you know the reason why you're adding these changes, our prettier script will just add them back and it makes it more difficult to review

kevkevinpal · 2023-10-10T20:59:11Z

frontend/app/src/pages/people/tabs/index.tsx

            <div
              style={{
-                padding: 20,
+                padding: '20px 30px',


can we make this a styled component?

kevkevinpal · 2023-10-10T21:01:50Z

frontend/app/src/people/widgetViews/ManageOrgButton.tsx

+                (isOrganizationAdmin ||
+                    userHasRole(main.bountyRoles, userRoles, 'ADD USER') ||
+                    userHasRole(main.bountyRoles, userRoles, 'VIEW REPORT'))


lets just define this as a boolean above to make the react part look simple, we can call it shouldShowButton: boolean

kevkevinpal · 2023-10-10T21:02:06Z

frontend/app/src/components/common/IconButton2.tsx

@@ -10,7 +10,7 @@ interface ButtonHoverProps {
  shadowcolor?: string;
 }

-const B = styled(EuiButton)<ButtonHoverProps>`
+const B = styled(EuiButton) <ButtonHoverProps>`


kevkevinpal · 2023-10-10T21:02:30Z

frontend/app/src/components/common/IconButton2.tsx

+        r: parseInt(result[1], 16),
+        g: parseInt(result[2], 16),
+        b: parseInt(result[3], 16)
+      }


kevkevinpal · 2023-10-10T21:03:14Z

frontend/app/src/pages/people/PersonPage.tsx

@@ -82,7 +82,7 @@ export const PersonPage = observer(() => {
            height: '100%'
          }}
        >
-          <Panel isMobile={isMobile} style={{ paddingBottom: 0, paddingTop: 80 }}>
+          <Panel isMobile={isMobile} style={{ paddingBottom: isMobile ? 80 : 0, paddingTop: 80 }}>


is there anyway to make this a styled component and use the isMobile in the styled component?

kevkevinpal · 2023-10-10T21:03:22Z

frontend/app/src/pages/people/tabs/index.tsx

+                  if ('show' in f) {
+                    // show has a value
+                    if (!f.show) return false;
+                  }
+                  // if no value default to true
+                  return true;
+                }).length


kevkevinpal · 2023-10-10T21:03:55Z

frontend/app/src/people/Person.tsx

@@ -190,7 +189,7 @@ export default function Person(props: PersonProps) {
            <Img
              style={{ height: '100%', width: '100%', borderRadius: 0 }}
              src={img}
-              // src={img || getUserPlaceholder(owner_pubkey)}
+            // src={img || getUserPlaceholder(owner_pubkey)}


we can probably delete this comment but also prettier

kevkevinpal · 2023-10-10T21:04:03Z

frontend/app/src/people/main/FocusView.tsx

+  thumbColor: '#5a606c',
+  trackBackgroundColor: 'rgba(0,0,0,0)'
+})}


kevkevinpal · 2023-10-10T21:04:10Z

frontend/app/src/people/main/FocusView.tsx

+      label: toCapitalize(org.name),
+      value: org.uuid
+    }))


kevkevinpal · 2023-10-10T21:04:19Z

frontend/app/src/people/main/FocusView.tsx

+                    twitter: `<span>Post this to your twitter account to verify:</span><br/><strong>Sphinx Verification: ${ui.meInfo.verification_signature}</strong>`
+                  }


kevkevinpal · 2023-10-10T21:05:24Z

frontend/app/src/people/utils/NoneSpace.tsx

@@ -141,7 +141,7 @@ export default function NoneSpace(props: NoneSpaceProps) {
            leadingIcon={props.buttonIcon}
            width={210}
            height={48}
-            style={{ marginTop: 40 }}
+            style={{ marginTop: 20, borderRadius: 10 }}


lets make this a styled component

kevkevinpal · 2023-10-10T21:09:17Z

frontend/app/src/people/utils/OrgNoResults.tsx

+        buttonText={tabs['organizations'].action.text}
+        buttonIcon={tabs['organizations'].action.icon}


above you can use this to create two vars from this const {text, icon} = tabs['organizations'].action

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

i would actually do this directly from widgetConfigs so
const {text, icon} = widgetConfigs['organizations'].action

kevkevinpal · 2023-10-10T21:11:35Z

frontend/app/src/people/utils/OrgNoResults.tsx

+        style={{
+          margin: 'auto',
+          marginTop: '10%'
+        }}


looks like the nonespace below uses the same style you can make this a styled component

kevkevinpal · 2023-10-10T21:12:17Z

frontend/app/src/people/widgetViews/ManageOrgButton.tsx

+                    style={{
+                        width: 112,
+                        height: 40,
+                        color: '#000000',
+                        borderRadius: 10
+                    }}


lets make this a styled component

kevkevinpal · 2023-10-10T21:12:59Z

frontend/app/src/people/widgetViews/OrganizationDetails.tsx

+                      <MaterialIcon
+                        onClick={() => handleSettingsClick(user)}
+                        icon={'settings'}
+                        style={{
+                          fontSize: 20,
+                          marginLeft: 10,
+                          cursor: 'pointer',
+                          color: 'green'
+                        }}
+                      />
+                    )}


kevkevinpal · 2023-10-10T21:13:09Z

frontend/app/src/people/widgetViews/OrganizationDetails.tsx

+                      <MaterialIcon
+                        onClick={() => {
+                          deleteOrganizationUser(user);
+                        }}
+                        icon={'delete'}
+                        style={{
+                          fontSize: 20,
+                          marginLeft: 10,
+                          cursor: 'pointer',
+                          color: 'red'
+                        }}
+                      />
+                    )}


kevkevinpal · 2023-10-10T21:13:18Z

frontend/app/src/people/widgetViews/OrganizationDetails.tsx

+                              display: 'none'
+                            }


kevkevinpal · 2023-10-10T21:15:56Z

frontend/app/src/people/widgetViews/OrganizationView.tsx

+                                  display: 'none'
+                                }


kevkevinpal · 2023-10-10T21:16:41Z

frontend/app/src/people/widgetViews/OrganizationView.tsx

+                        style={{
+                          width: '100%',
+                          borderRadius: 10,
+                          height: 45,
+                          marginTop: 15
+                        }}


lets make this a styled component

kevkevinpal · 2023-10-10T21:16:53Z

frontend/app/src/people/widgetViews/OrganizationView.tsx

      <EuiGlobalToastList toasts={toasts} dismissToast={removeToast} toastLifeTimeMs={5000} />
-    </Container>
+    </Container >


kevkevinpal · 2023-10-10T21:17:00Z

frontend/app/src/people/widgetViews/OrganizationView.tsx

+      )
+      }


kevkevinpal · 2023-10-10T21:17:11Z

frontend/app/src/people/widgetViews/RenderWidgets.tsx

+          minHeight: 132
+        }
        : {
-            maxWidth: 291,
-            minWidth: 291,
-            marginRight: 20,
-            marginBottom: 20,
-            minHeight: 472
-          };
+          maxWidth: 291,
+          minWidth: 291,
+          marginRight: 20,
+          marginBottom: 20,
+          minHeight: 472
+        };


kevkevinpal · 2023-10-10T21:17:16Z

frontend/app/src/people/widgetViews/RenderWidgets.tsx

+                border: '1px solid #dde1e5',
+                boxShadow: 'none'
+              }


kevkevinpal · 2023-10-10T21:17:51Z

frontend/app/src/people/widgetViews/summaries/wantedSummaries/CodingBounty.tsx

+        ui.meInfo?.owner_alias &&
+        { ...person }?.owner_alias === ui.meInfo?.owner_alias ? (


kevkevinpal · 2023-10-10T21:18:08Z

handlers/invoiceCron.go

+				fmt.Println("Invoice Response ===", invoiceRes.Response.Settled)
+				fmt.Println("Invoice Payment Request ===", invoiceRes.Response.Payment_request)


delete logs

kevkevinpal · 2023-10-10T21:18:14Z

handlers/invoiceCron.go

@@ -206,6 +209,7 @@ func InitInvoiceCron() {
 				}

 				if invoiceRes.Response.Settled {
+					fmt.Println("Settled ===", invoiceRes.Response.Settled)


delete logs

kevkevinpal

added some comments for all the "prettier" comments you can run yarn run prettier and it should fix them but I'm assuming your vscode or editor is using a different prettier file than the one we have in the project

elraphty added 6 commits October 5, 2023 18:04

started new org design

258df82

Merge branch 'master' into feat/update_org_admin

4427712

Merge branch 'master' into feat/update_org_admin

99323a2

redesigned organization list

21c014d

centralized assigned tickets no result

84f569e

finished org list redesign

cec4693

elraphty requested a review from kevkevinpal October 6, 2023 15:59

updated organization mobile designs

565df29

kevkevinpal reviewed Oct 10, 2023

View reviewed changes

frontend/app/src/people/widgetViews/OrganizationDetails.tsx

Comment on lines +590 to +591

display: 'none'

}

Copy link

Contributor

kevkevinpal Oct 10, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

prettier

kevkevinpal reviewed Oct 10, 2023

View reviewed changes

frontend/app/src/people/widgetViews/OrganizationView.tsx

Comment on lines +375 to +376

display: 'none'

}

Copy link

Contributor

kevkevinpal Oct 10, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

prettier

kevkevinpal reviewed Oct 10, 2023

View reviewed changes

frontend/app/src/people/widgetViews/OrganizationView.tsx

Comment on lines +404 to +405

)

}

Copy link

Contributor

kevkevinpal Oct 10, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

prettier

kevkevinpal reviewed Oct 10, 2023

View reviewed changes

elraphty added 2 commits October 11, 2023 01:16

fixed merge conflicts

34aa02b

added an .editorconfig file

c634226

elraphty closed this Oct 11, 2023

Evanfeenstra deleted the feat/update_org_admin branch January 26, 2024 17:57

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Organization List Redesign #799

Organization List Redesign #799

elraphty commented Oct 6, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal Oct 10, 2023

kevkevinpal left a comment

		twitter: `<span>Post this to your twitter account to verify:</span><br/><strong>Sphinx Verification: ${ui.meInfo.verification_signature}</strong>`
		}

		buttonText={tabs['organizations'].action.text}
		buttonIcon={tabs['organizations'].action.icon}

		ui.meInfo?.owner_alias &&
		{ ...person }?.owner_alias === ui.meInfo?.owner_alias ? (

		fmt.Println("Invoice Response ===", invoiceRes.Response.Settled)
		fmt.Println("Invoice Payment Request ===", invoiceRes.Response.Payment_request)

Organization List Redesign #799

Organization List Redesign #799

Conversation

elraphty commented Oct 6, 2023

Describe your changes

Issue ticket number and link

Type of change

Checklist before requesting a review

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

kevkevinpal left a comment

Choose a reason for hiding this comment