dashboard: created page.tsx

dashboard/APIController/API.ts

@@ -63,6 +63,24 @@ export const GetUser = (jwt : string) => {
   })
 }
 
+export const UpdateUser = (firstName : string, lastName : string,
+  jwt : string) => {
+  return new Promise((resolve: Function, reject: Function) => {
+    axios.put('/user', { first_name: firstName, last_name: lastName },
+      { headers: { 'Authorization': `Bearer ${jwt}` }})
+      .then((res : AxiosResponse) => {
+	resolve(res.data)
+      })
+      .catch((err : AxiosError) => {
+	if (err.response && IsAPIFailure(err.response.data)) {
+	  resolve(err.response.data)
+	  return
+	}
+	reject(err)
+      })
+  })
+}
+
 export function IsAPISuccess(obj : any): obj is APIResponse {
   return typeof (obj as APIResponse).message !== 'undefined'
 }

dashboard/app/authorize/page.tsx

@@ -160,9 +160,9 @@ export default function Page() {
       return (<SignupForm setView={setView} />)
     }
 
-    // No URL parameters and user is already signed in, redirect to account page.
+    // No URL parameters and user is already signed in, redirect to dashboard.
     if (typeof jwt !== "undefined" && client.response_type === null) {
-      redirect("/account")
+      redirect("/")
       return null
     }
 

dashboard/app/globals.scss

@@ -15,3 +15,12 @@
     letter-spacing: 0;
     color: #161616;
 }
+
+.account {
+    height: calc(100vh - 48px - 32px - 32px);
+    width: calc(100vw - 32px - 32px);
+}
+
+.account--tablist {
+    margin-top: 20px;
+}

dashboard/app/page.tsx

@@ -0,0 +1,38 @@
+'use client'
+
+import { redirect } from 'next/navigation'
+import { useCookies } from 'next-client-cookies'
+import MyAccount from '@/components/MyAccount/MyAccount'
+import { Heading, Tabs, TabList, Tab, TabPanels, TabPanel } from '@carbon/react'
+
+export default function Page() {
+  const cookies = useCookies()
+  const jwt = cookies.get('ows-jwt')
+  if (typeof jwt === "undefined") {
+    redirect("/authorize")
+  }
+
+  return (
+    <div className="account">
+      <Heading> Dashboard </Heading>
+      <Tabs>
+	<TabList contained className="account--tablist">
+	  <Tab>Analytics</Tab>
+	  <Tab>Clients</Tab>
+	  <Tab>Users</Tab>
+	  <Tab disabled>DNS</Tab>
+	  <Tab disabled>CDN</Tab>
+	  <Tab>My Account</Tab>
+	</TabList>
+	<TabPanels>
+	  <TabPanel> Tab Panel 1 </TabPanel>
+	  <TabPanel> Tab Panel 2 </TabPanel>
+	  <TabPanel> Tab Panel 3 </TabPanel>
+	  <TabPanel> Tab Panel 4 </TabPanel>
+	  <TabPanel> Tab Panel 5 </TabPanel>
+	  <TabPanel><MyAccount /></TabPanel>
+	</TabPanels>
+      </Tabs>
+    </div>
+  )
+}

dashboard/components/NavHeader.tsx

@@ -44,9 +44,6 @@ const NavHeader = (props : { setTheme: Function }) => {
 	  {
 	    (typeof jwt !== "undefined") ? (
 	      <>
-		<HeaderGlobalAction aria-label="Account" tooltipAlignment="center">
-		  <UserAvatar size={20} onClick={() => location.replace("/account")}/>
-		</HeaderGlobalAction>
 		<HeaderGlobalAction aria-label="Logout" tooltipAlignment="center"
 		  onClick={onSignout}>
 		  <Logout size={20} />