From cfc9470a6f4a2bb09e7fe5a5a8a2d1d82ea67078 Mon Sep 17 00:00:00 2001
From: Vladyslav Matsiiako <matsiiako@gmail.com>
Date: Fri, 14 Apr 2023 19:33:25 -0700
Subject: [PATCH] Fixed merge conflicts

---
 frontend/src/pages/dashboard/[id].tsx | 63 ++++++++++-----------------
 1 file changed, 24 insertions(+), 39 deletions(-)

diff --git a/frontend/src/pages/dashboard/[id].tsx b/frontend/src/pages/dashboard/[id].tsx
index 0e77bd99c..8aa480c81 100644
--- a/frontend/src/pages/dashboard/[id].tsx
+++ b/frontend/src/pages/dashboard/[id].tsx
@@ -2,7 +2,6 @@
 import { UIEvent, useCallback, useEffect, useRef, useState } from 'react';
 import Head from 'next/head';
 import Image from 'next/image';
-import queryString from 'query-string';
 import { useRouter } from 'next/router';
 import { useTranslation } from 'next-i18next';
 import {
@@ -20,9 +19,9 @@ import {
 } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { Tag } from 'public/data/frequentInterfaces';
+import queryString from 'query-string';
 
 import Button from '@app/components/basic/buttons/Button';
-import ListBox from '@app/components/basic/Listbox';
 import BottonRightPopup from '@app/components/basic/popups/BottomRightPopup';
 import { useNotificationContext } from '@app/components/context/Notifications/NotificationProvider';
 import ConfirmEnvOverwriteModal from '@app/components/dashboard/ConfirmEnvOverwriteModal';
@@ -36,14 +35,14 @@ import guidGenerator from '@app/components/utilities/randomId';
 import encryptSecrets from '@app/components/utilities/secrets/encryptSecrets';
 import getSecretsForProject from '@app/components/utilities/secrets/getSecretsForProject';
 import { getTranslatedServerSideProps } from '@app/components/utilities/withTranslateProps';
-import { DashboardPage } from  '@app/views/DashboardPage';
-import { DashboardEnvOverview } from '@app/views/DashboardPage/DashboardEnvOverview';
 import { IconButton } from '@app/components/v2';
 import { leaveConfirmDefaultMessage } from '@app/const';
 import getProjectSercetSnapshotsCount from '@app/ee/api/secrets/GetProjectSercetSnapshotsCount';
 import performSecretRollback from '@app/ee/api/secrets/PerformSecretRollback';
 import PITRecoverySidebar from '@app/ee/components/PITRecoverySidebar';
 import { useLeaveConfirm } from '@app/hooks';
+// import { DashboardPage } from  '@app/views/DashboardPage';
+import { DashboardEnvOverview } from '@app/views/DashboardPage/DashboardEnvOverview';
 
 // import addSecrets from '../api/files/AddSecrets';
 // import deleteSecrets from '../api/files/DeleteSecrets';
@@ -150,7 +149,6 @@ function findDuplicates(arr: any[]) {
 export default function Dashboard() {
   const [data, setData] = useState<SecretDataProps[] | null>();
   const [initialData, setInitialData] = useState<SecretDataProps[] | null | undefined>([]);
-  const router = useRouter();
   const [blurred, setBlurred] = useState(true);
   const [isKeyAvailable, setIsKeyAvailable] = useState(true);
   const [isNew, setIsNew] = useState(false);
@@ -175,7 +173,7 @@ export default function Dashboard() {
   
   const { createNotification } = useNotificationContext();
   const router = useRouter();
-  const env = queryString.parse(router.asPath.split('?')[1])?.env;
+  const envInURL = queryString.parse(router.asPath.split('?')[1])?.env;
 
   const workspaceId = router.query.id as string;
   const [workspaceEnvs, setWorkspaceEnvs] = useState<WorkspaceEnv[]>([]);
@@ -789,13 +787,13 @@ export default function Dashboard() {
     deleteRow({ ids, secretName });
   };
 
-  const handleOnEnvironmentChange = (envName: string) => {
+  const handleOnEnvironmentChange = (envSlug: string) => {
     if (hasUnsavedChanges) {
       if (!window.confirm(leaveConfirmDefaultMessage)) return;
     }
 
     const selectedWorkspaceEnv = workspaceEnvs.find(
-      ({ name }: { name: string }) => envName === name
+      ({ slug }: { slug: string }) => envSlug === slug
     ) || {
       name: 'unknown',
       slug: 'unknown',
@@ -803,6 +801,8 @@ export default function Dashboard() {
       isReadDenied: false
     };
 
+    console.log(124, envSlug, selectedWorkspaceEnv)
+
     if (selectedWorkspaceEnv) {
       if (snapshotData) setSelectedSnapshotEnv(selectedWorkspaceEnv);
       else setSelectedEnv(selectedWorkspaceEnv);
@@ -815,10 +815,10 @@ export default function Dashboard() {
     })
   };
 
-  return <>
-    {!env 
+  return <div>
+    {!envInURL 
     ? <DashboardEnvOverview />
-    : data ? (
+    : (data ? (
     <div className="bg-bunker-800 max-h-screen h-full relative flex flex-col justify-between text-white dark">
       <Head>
         <title>{t('common:head-title', { title: t('dashboard:title') })}</title>
@@ -844,7 +844,13 @@ export default function Dashboard() {
           }
         />
         <div className="w-full max-h-96 pb-2 dark:[color-scheme:dark]">
-          <NavHeader pageName={t('dashboard:title')} isProjectRelated />
+          <NavHeader 
+            pageName={t('dashboard:title')} 
+            currentEnv={workspaceEnvs?.filter(envir => envir.slug === envInURL)[0].name || ''} 
+            isProjectRelated 
+            userAvailableEnvs={workspaceEnvs}
+            onEnvChange={handleOnEnvironmentChange}
+          />
           {checkDocsPopUpVisible && (
             <BottonRightPopup
               buttonText={t('dashboard:check-docs.button')}
@@ -860,7 +866,7 @@ export default function Dashboard() {
             {snapshotData && (
               <div className="flex justify-start max-w-sm mt-1 mr-2">
                 <Button
-                  text={String(t('Go back to current'))}
+                  text={String(t('To Current'))}
                   onButtonPressed={() => setSnapshotData(undefined)}
                   color="mineshaft"
                   size="md"
@@ -872,7 +878,7 @@ export default function Dashboard() {
               <div className="font-semibold mr-4 mt-1 flex flex-row items-center">
                 <p>{snapshotData ? 'Secret Snapshot' : t('dashboard:title')}</p>
                 {snapshotData && (
-                  <span className="bg-primary-800 text-sm ml-4 mt-1 px-1.5 rounded-md">
+                  <span className="bg-primary-800 text-xs ml-4 mt-1 px-1.5 rounded-md w-min">
                     {new Date(snapshotData.createdAt).toLocaleString()}
                   </span>
                 )}
@@ -882,13 +888,6 @@ export default function Dashboard() {
                   </span>
                 )}
               </div>
-              {!snapshotData && data?.length === 0 && selectedEnv && (
-                <ListBox
-                  isSelected={selectedEnv.name}
-                  data={workspaceEnvs.map(({ name }) => name)}
-                  onChange={handleOnEnvironmentChange}
-                />
-              )}
             </div>
             <div className="flex flex-row">
               <div className="flex justify-start max-w-sm mt-1 mr-2">
@@ -969,20 +968,7 @@ export default function Dashboard() {
               <div className="w-full flex flex-row items-start">
                 {(snapshotData || data?.length !== 0) && selectedEnv && (
                   <>
-                    {!snapshotData ? (
-                      <ListBox
-                        isSelected={selectedEnv.name}
-                        data={workspaceEnvs.map(({ name }) => name)}
-                        onChange={handleOnEnvironmentChange}
-                      />
-                    ) : (
-                      <ListBox
-                        isSelected={selectedSnapshotEnv?.name || ''}
-                        data={workspaceEnvs.map(({ name }) => name)}
-                        onChange={handleOnEnvironmentChange}
-                      />
-                    )}
-                    <div className="h-10 w-full bg-mineshaft-700 hover:bg-white/10 ml-2 rounded-md flex flex-row items-center">
+                    <div className="h-10 w-full bg-mineshaft-700 hover:bg-white/10 rounded-md flex flex-row items-center">
                       <FontAwesomeIcon
                         className="bg-transparent rounded-l-md py-[0.7rem] pl-4 pr-2 text-bunker-300 text-sm"
                         icon={faMagnifyingGlass}
@@ -1032,7 +1018,7 @@ export default function Dashboard() {
               <div className="flex items-center justify-center h-full my-48">
                 <Image
                   src="/images/loading/loading.gif"
-                  height={60}
+                  height={600}
                   width={100}
                   alt="infisical loading indicator"
                 />
@@ -1232,11 +1218,10 @@ export default function Dashboard() {
       </div>
     </div>
   ) : (
-    <div className="relative z-10 w-10/12 mr-auto h-full ml-2 bg-bunker-800 flex flex-col items-center justify-center">
+    <div className="relative z-10 w-10/12 mr-auto h-screen ml-2 bg-bunker-800 flex flex-col items-center justify-center">
       <Image src="/images/loading/loading.gif" height={70} width={120} alt="loading animation" />
     </div>
-  )
-  </>
+  ))}</div>
 }
 
 Dashboard.requireAuth = true;