feat(SetOrg): update url to match page title (#5422)

blegesse-w · web-flow · commit 465a63740eeb · 2022-08-18T14:34:12.000-05:00
diff --git a/cypress/e2e/cloud/about.test.ts b/cypress/e2e/cloud/about.test.ts
@@ -10,7 +10,7 @@ describe.skip('About Page for free users with only 1 user', () => {
             accountType: 'free',
             hasUsers: false,
           }).then(() => {
-            cy.visit(`/orgs/${id}/about`)
+            cy.visit(`/orgs/${id}/org-settings`)
             cy.getByTestID('about-page--header').should('be.visible')
           })
         })
@@ -27,7 +27,7 @@ describe.skip('About Page for free users with only 1 user', () => {
 
     cy.location()
       .should(loc => {
-        expect(loc.pathname).to.include(`/about/delete`)
+        expect(loc.pathname).to.include(`/org-settings/delete`)
       })
       .then(() => {
         cy.getByTestID('delete-org--overlay').should('exist')
@@ -56,7 +56,7 @@ describe('About Page for free users with multiple users', () => {
             accountType: 'free',
             hasUsers: true,
           }).then(() => {
-            cy.visit(`/orgs/${id}/about`)
+            cy.visit(`/orgs/${id}/org-settings`)
             cy.getByTestID('about-page--header').should('be.visible')
           })
         })
@@ -75,7 +75,7 @@ describe('About Page for free users with multiple users', () => {
       })
 
     cy.location().should(loc => {
-      expect(loc.pathname).to.include(`/users`)
+      expect(loc.pathname).to.include(`/members`)
     })
   })
 })
@@ -88,7 +88,7 @@ describe('About Page for PAYG users', () => {
           cy.quartzProvision({
             accountType: 'pay_as_you_go',
           }).then(() => {
-            cy.visit(`/orgs/${id}/about`)
+            cy.visit(`/orgs/${id}/org-settings`)
             cy.getByTestID('about-page--header').should('be.visible')
           })
         })
diff --git a/cypress/e2e/cloud/deepLinks.test.ts b/cypress/e2e/cloud/deepLinks.test.ts
@@ -12,8 +12,8 @@ describe('Deep linking', () => {
   // so you'll probably need to follow-up with the docs and/or marketing teams.
   it('should be redirected to the approprate page from a shortened link', () => {
     cy.get('@org').then((org: Organization) => {
-      cy.visit('/me/about')
-      cy.location('pathname').should('eq', `/orgs/${org.id}/about`)
+      cy.visit('/me/org-settings')
+      cy.location('pathname').should('eq', `/orgs/${org.id}/org-settings`)
 
       cy.visit('/me/alerts')
       cy.location('pathname').should('eq', `/orgs/${org.id}/alerting`)
@@ -123,8 +123,8 @@ describe('Deep linking', () => {
       cy.visit('/me/usage')
       cy.location('pathname').should('eq', `/orgs/${org.id}/usage`)
 
-      cy.visit('/me/users')
-      cy.location('pathname').should('eq', `/orgs/${org.id}/users`)
+      cy.visit('/me/members')
+      cy.location('pathname').should('eq', `/orgs/${org.id}/members`)
 
       cy.visit('/me/variables')
       cy.location('pathname').should('eq', `/orgs/${org.id}/settings/variables`)
diff --git a/cypress/e2e/cloud/globalHeader.ts b/cypress/e2e/cloud/globalHeader.ts
@@ -108,7 +108,7 @@ describe('change-account change-org global header', () => {
           .should('be.visible')
           .click()
 
-        cy.location('pathname').should('eq', `/orgs/${idpeOrgID}/about`)
+        cy.location('pathname').should('eq', `/orgs/${idpeOrgID}/org-settings`)
         cy.getByTestID('org-profile--panel')
           .should('be.visible')
           .and('contain', 'Organization Profile')
@@ -123,7 +123,7 @@ describe('change-account change-org global header', () => {
           .should('be.visible')
           .click()
 
-        cy.location('pathname').should('eq', `/orgs/${idpeOrgID}/users`)
+        cy.location('pathname').should('eq', `/orgs/${idpeOrgID}/members`)
         cy.getByTestID('tabs--container')
           .should('be.visible')
           .and('contain', 'Add a new user to your organization')
diff --git a/cypress/e2e/cloud/users.test.ts b/cypress/e2e/cloud/users.test.ts
@@ -8,7 +8,7 @@ describe('Users Page', () => {
           cy.quartzProvision({
             hasUsers: true,
           }).then(() => {
-            cy.visit(`/orgs/${id}/users`)
+            cy.visit(`/orgs/${id}/members`)
             cy.getByTestID('users-page--header').should('be.visible')
           })
         })
diff --git a/cypress/e2e/shared/about.test.ts b/cypress/e2e/shared/about.test.ts
@@ -6,7 +6,7 @@ describe('About Page', () => {
     cy.signin()
 
     cy.get('@org').then((org: Organization) => {
-      cy.visit(`/orgs/${org.id}/about`)
+      cy.visit(`/orgs/${org.id}/org-settings`)
       cy.getByTestID('about-page--header').should('be.visible')
     })
   })
diff --git a/cypress/e2e/shared/nav.test.ts b/cypress/e2e/shared/nav.test.ts
@@ -63,11 +63,12 @@ describe('navigation', () => {
 
      \**/
 
-    // User Nav -- About
+    // User Nav -- Settings
     cy.getByTestID('user-nav').click()
     cy.getByTestID('user-nav-item-about').click()
     cy.getByTestID('about-page--header').should('exist')
-    cy.url().should('contain', 'about')
+    const url = Cypress.env('dexUrl') === 'OSS' ? 'about' : 'org-settings'
+    cy.url().should('contain', url)
 
     /** \
 
diff --git a/src/checkout/SuccessOverlay.tsx b/src/checkout/SuccessOverlay.tsx
@@ -19,7 +19,7 @@ const SuccessOverlay: FC = () => {
   const orgId = useSelector(getOrg)?.id
 
   const handleClick = () => {
-    history.push(`/orgs/${orgId}/users`)
+    history.push(`/orgs/${orgId}/members`)
   }
 
   return (
diff --git a/src/identity/components/GlobalHeader/OrgDropdown.tsx b/src/identity/components/GlobalHeader/OrgDropdown.tsx
@@ -33,12 +33,12 @@ export const OrgDropdown: FC<Props> = ({activeOrg, orgsList}) => {
     {
       name: 'Settings',
       iconFont: IconFont.CogSolid_New,
-      href: `/orgs/${activeOrg.id}/about`,
+      href: `/orgs/${activeOrg.id}/org-settings`,
     },
     {
       name: 'Members',
       iconFont: IconFont.Group,
-      href: `/orgs/${activeOrg.id}/users`,
+      href: `/orgs/${activeOrg.id}/members`,
     },
     {
       name: 'Usage',
diff --git a/src/organizations/components/OrgNavigation.tsx b/src/organizations/components/OrgNavigation.tsx
@@ -44,13 +44,13 @@ const OrgNavigation: FC<Props> = ({activeTab}) => {
       text: 'Settings',
       id: Tab.About,
       enabled: () => CLOUD,
-      link: `/orgs/${orgID}/about`,
+      link: `/orgs/${orgID}/org-settings`,
     },
     {
       text: 'Members',
       id: Tab.Users,
       enabled: () => CLOUD,
-      link: `/orgs/${orgID}/users`,
+      link: `/orgs/${orgID}/members`,
     },
     {
       text: 'About',
diff --git a/src/organizations/components/OrgProfileTab/CopyableLabeledData.tsx b/src/organizations/components/OrgProfileTab/CopyableLabeledData.tsx
@@ -48,7 +48,7 @@ const CopyableLabeledData: FC<Props> = ({
   }
 
   const handleShowEditOverlay = () => {
-    history.push(`/orgs/${org.id}/about/rename`)
+    history.push(`/orgs/${org.id}/org-settings/rename`)
   }
 
   return (
diff --git a/src/organizations/components/OrgProfileTab/DeletePanel.tsx b/src/organizations/components/OrgProfileTab/DeletePanel.tsx
@@ -43,12 +43,12 @@ const DeletePanel: FC = () => {
       track('DeleteOrgInitiation', payload)
     }
 
-    history.push(`/orgs/${org.id}/about/delete`)
+    history.push(`/orgs/${org.id}/org-settings/delete`)
   }
 
   const handleShowWarning = () => {
     const buttonElement: NotificationButtonElement = onDismiss =>
-      getDeleteAccountWarningButton(`/orgs/${org.id}/users`, onDismiss)
+      getDeleteAccountWarningButton(`/orgs/${org.id}/members`, onDismiss)
     dispatch(notify(deleteAccountWarning(buttonElement)))
   }
 
diff --git a/src/organizations/components/RenameOrgForm.tsx b/src/organizations/components/RenameOrgForm.tsx
@@ -112,7 +112,7 @@ class RenameOrgForm extends PureComponent<Props, State> {
   }
 
   private handleGoBack = () => {
-    this.props.history.push(`/orgs/${this.props.startOrg.id}/about`)
+    this.props.history.push(`/orgs/${this.props.startOrg.id}/org-settings`)
   }
 
   private handleValidation = (orgName: string): string | null => {
diff --git a/src/organizations/containers/OrgProfilePage.tsx b/src/organizations/containers/OrgProfilePage.tsx
@@ -31,11 +31,14 @@ const OrgProfilePage: FC = () => {
         </OrgTabbedPage>
       </Page>
       <Switch>
-        <Route path="/orgs/:orgID/about/rename" component={RenameOrgOverlay} />
+        <Route
+          path="/orgs/:orgID/org-settings/rename"
+          component={RenameOrgOverlay}
+        />
         {CLOUD && quartzMe?.accountType === 'free' && (
           <DeleteOrgProvider>
             <Route
-              path="/orgs/:orgID/about/delete"
+              path="/orgs/:orgID/org-settings/delete"
               component={DeleteOrgOverlay}
             />
           </DeleteOrgProvider>
diff --git a/src/pageLayout/components/UserWidget.tsx b/src/pageLayout/components/UserWidget.tsx
@@ -63,15 +63,15 @@ const UserWidget: FC<Props> = ({
           label="Settings"
           testID="user-nav-item-about"
           linkElement={className => (
-            <Link className={className} to={`${orgPrefix}/about`} />
+            <Link className={className} to={`${orgPrefix}/org-settings`} />
           )}
         />
         <TreeNav.UserItem
           id="users"
           label="Members"
           testID="user-nav-item-users"
           linkElement={className => (
-            <Link className={className} to={`${orgPrefix}/users`} />
+            <Link className={className} to={`${orgPrefix}/members`} />
           )}
         />
         <TreeNav.UserItem
diff --git a/src/shared/constants/index.ts b/src/shared/constants/index.ts
@@ -107,7 +107,6 @@ export const CLOUD_CHECKOUT_PATH = '/checkout'
 export const CLOUD_BILLING_PATH = '/billing'
 export const CLOUD_USAGE_PATH = '/usage'
 export const CLOUD_LOGOUT_PATH = '/logout'
-export const CLOUD_USERS_PATH = '/users'
 
 export const FLUX_RESPONSE_BYTES_LIMIT = CLOUD
   ? 27 * 1024 * 1024 // 27 MiB  (desa: this was determined by looking at queries responses in the cloud app)
diff --git a/src/shared/containers/SetOrg.tsx b/src/shared/containers/SetOrg.tsx
@@ -254,8 +254,13 @@ const SetOrg: FC = () => {
             path={`${orgPath}/${SETTINGS}`}
             component={VariablesIndex}
           />
-          {/* Users */}
-          {CLOUD && <Route path={`${orgPath}/users`} component={UsersPage} />}
+          {/* Users - route has multiple paths to ensure backwards compatibility while https://github.com/influxdata/ui/issues/5396 is being worked on*/}
+          {CLOUD && (
+            <Route
+              path={[`${orgPath}/users`, `${orgPath}/members`]}
+              component={UsersPage}
+            />
+          )}
           {/* Billing */}
           {CLOUD && (
             <Route path={`${orgPath}/billing`} component={BillingPage} />
@@ -266,8 +271,11 @@ const SetOrg: FC = () => {
           {!CLOUD && (
             <Route path={`${orgPath}/members`} component={MembersIndex} />
           )}
-          {/* About */}
-          <Route path={`${orgPath}/about`} component={OrgProfilePage} />
+          {/* About - route has multiple paths to ensure backwards compatibility while https://github.com/influxdata/ui/issues/5396 is being worked on*/}
+          <Route
+            path={[`${orgPath}/about`, `${orgPath}/org-settings`]}
+            component={OrgProfilePage}
+          />
           {/* account settings page */}
           <Route
             path={`${orgPath}/accounts/settings`}
diff --git a/src/utils/deepLinks.ts b/src/utils/deepLinks.ts
@@ -1,7 +1,8 @@
 import {PROJECT_NAME_PLURAL} from 'src/flows'
 
 export const buildDeepLinkingMap = (orgId: string) => ({
-  '/me/about': `/orgs/${orgId}/about`,
+  '/me/about': `/orgs/${orgId}/org-settings`,
+  '/me/org-settings': `/orgs/${orgId}/org-settings`,
   '/me/alerts': `/orgs/${orgId}/alerting`,
   '/me/billing': `/orgs/${orgId}/billing`,
   '/me/buckets': `/orgs/${orgId}/load-data/buckets`,
@@ -30,6 +31,7 @@ export const buildDeepLinkingMap = (orgId: string) => ({
   '/me/templates': `/orgs/${orgId}/settings/templates`,
   '/me/tokens': `/orgs/${orgId}/load-data/tokens`,
   '/me/usage': `/orgs/${orgId}/usage`,
-  '/me/users': `/orgs/${orgId}/users`,
+  '/me/users': `/orgs/${orgId}/members`,
+  '/me/members': `/orgs/${orgId}/members`,
   '/me/variables': `/orgs/${orgId}/settings/variables`,
 })

Original file line number	Diff line number	Diff line change
`@@ -19,7 +19,7 @@ const SuccessOverlay: FC = () => {`
`19`	`19`	`const orgId = useSelector(getOrg)?.id`
`20`	`20`
`21`	`21`	`const handleClick = () => {`
`22`		- history.push(`/orgs/${orgId}/users`)
	`22`	+ history.push(`/orgs/${orgId}/members`)
`23`	`23`	`}`
`24`	`24`
`25`	`25`	`return (`
Original file line number	Diff line number	Diff line change
`@@ -33,12 +33,12 @@ export const OrgDropdown: FC<Props> = ({activeOrg, orgsList}) => {`
`33`	`33`	`{`
`34`	`34`	`name: 'Settings',`
`35`	`35`	`iconFont: IconFont.CogSolid_New,`
`36`		- href: `/orgs/${activeOrg.id}/about`,
	`36`	+ href: `/orgs/${activeOrg.id}/org-settings`,
`37`	`37`	`},`
`38`	`38`	`{`
`39`	`39`	`name: 'Members',`
`40`	`40`	`iconFont: IconFont.Group,`
`41`		- href: `/orgs/${activeOrg.id}/users`,
	`41`	+ href: `/orgs/${activeOrg.id}/members`,
`42`	`42`	`},`
`43`	`43`	`{`
`44`	`44`	`name: 'Usage',`
Original file line number	Diff line number	Diff line change
`@@ -48,7 +48,7 @@ const CopyableLabeledData: FC<Props> = ({`
`48`	`48`	`}`
`49`	`49`
`50`	`50`	`const handleShowEditOverlay = () => {`
`51`		- history.push(`/orgs/${org.id}/about/rename`)
	`51`	+ history.push(`/orgs/${org.id}/org-settings/rename`)
`52`	`52`	`}`
`53`	`53`
`54`	`54`	`return (`