Merge pull request #335 from animeshdas2000/fix/undefined-url

Fix: After trying to delete the last remaining project, it keeps loading and returns undefined in the URL
This commit is contained in:
mv-turtle
2023-02-20 19:54:41 -08:00
committed by GitHub
2 changed files with 79 additions and 53 deletions
+73 -50
View File
@@ -167,7 +167,7 @@ export default function Dashboard() {
const [dropZoneData, setDropZoneData] = useState<SecretDataProps[]>(); const [dropZoneData, setDropZoneData] = useState<SecretDataProps[]>();
const [projectTags, setProjectTags] = useState<Tag[]>([]); const [projectTags, setProjectTags] = useState<Tag[]>([]);
const { hasUnsavedChanges, setHasUnsavedChanges } = useLeaveConfirm({initialValue: false}); const { hasUnsavedChanges, setHasUnsavedChanges } = useLeaveConfirm({ initialValue: false });
const { t } = useTranslation(); const { t } = useTranslation();
const { createNotification } = useNotificationContext(); const { createNotification } = useNotificationContext();
@@ -217,6 +217,9 @@ export default function Dashboard() {
useEffect(() => { useEffect(() => {
(async () => { (async () => {
if (router.isReady && workspaceId === 'undefined') {
router.push('/noprojects');
}
try { try {
const tempNumSnapshots = await getProjectSercetSnapshotsCount({ const tempNumSnapshots = await getProjectSercetSnapshotsCount({
workspaceId workspaceId
@@ -314,7 +317,7 @@ export default function Dashboard() {
valueOverride: undefined, valueOverride: undefined,
comment: '', comment: '',
tags: [] tags: []
}, }
]); ]);
}; };
@@ -750,11 +753,13 @@ export default function Dashboard() {
}; };
const handleOnEnvironmentChange = (envName: string) => { const handleOnEnvironmentChange = (envName: string) => {
if(hasUnsavedChanges) { if (hasUnsavedChanges) {
if (!window.confirm(leaveConfirmDefaultMessage)) return; if (!window.confirm(leaveConfirmDefaultMessage)) return;
} }
const selectedWorkspaceEnv = workspaceEnvs.find(({ name }: { name: string }) => envName === name) || { const selectedWorkspaceEnv = workspaceEnvs.find(
({ name }: { name: string }) => envName === name
) || {
name: 'unknown', name: 'unknown',
slug: 'unknown', slug: 'unknown',
isWriteDenied: false, isWriteDenied: false,
@@ -843,16 +848,18 @@ export default function Dashboard() {
</div> </div>
<div className="flex flex-row"> <div className="flex flex-row">
<div className="flex justify-start max-w-sm mt-1 mr-2"> <div className="flex justify-start max-w-sm mt-1 mr-2">
{!selectedEnv?.isReadDenied && <Button {!selectedEnv?.isReadDenied && (
text={String(`${numSnapshots} ${t('Commits')}`)} <Button
onButtonPressed={() => { text={String(`${numSnapshots} ${t('Commits')}`)}
toggleSidebar('None'); onButtonPressed={() => {
togglePITSidebar(true) toggleSidebar('None');
}} togglePITSidebar(true);
color="mineshaft" }}
size="md" color="mineshaft"
icon={faClockRotateLeft} size="md"
/>} icon={faClockRotateLeft}
/>
)}
</div> </div>
{(data?.length !== 0 || hasUnsavedChanges) && !snapshotData && ( {(data?.length !== 0 || hasUnsavedChanges) && !snapshotData && (
<div className="flex justify-start max-w-sm mt-1"> <div className="flex justify-start max-w-sm mt-1">
@@ -993,50 +1000,61 @@ export default function Dashboard() {
className="mt-1 max-h-[calc(100vh-280px)] overflow-hidden overflow-y-scroll no-scrollbar no-scrollbar::-webkit-scrollbar border border-mineshaft-600 rounded-md" className="mt-1 max-h-[calc(100vh-280px)] overflow-hidden overflow-y-scroll no-scrollbar no-scrollbar::-webkit-scrollbar border border-mineshaft-600 rounded-md"
> >
<div ref={secretsTop} /> <div ref={secretsTop} />
<div <div className="group flex flex-col items-center bg-mineshaft-800 border-b-2 border-mineshaft-500 duration-100 sticky top-0 z-[60]">
className='group flex flex-col items-center bg-mineshaft-800 border-b-2 border-mineshaft-500 duration-100 sticky top-0 z-[60]'
>
<div className="relative flex flex-row justify-between w-full mr-auto max-h-14 items-center"> <div className="relative flex flex-row justify-between w-full mr-auto max-h-14 items-center">
<div className="w-1/5 border-r border-mineshaft-600 flex flex-row items-center"> <div className="w-1/5 border-r border-mineshaft-600 flex flex-row items-center">
<div className='text-transparent text-xs flex items-center justify-center w-12 h-10 cursor-default'>0</div> <div className="text-transparent text-xs flex items-center justify-center w-12 h-10 cursor-default">
<span className='px-2 text-bunker-300 font-semibold'>Key</span> 0
{!snapshotData && <IconButton </div>
ariaLabel="copy icon" <span className="px-2 text-bunker-300 font-semibold">Key</span>
variant="plain" {!snapshotData && (
className="group relative ml-2" <IconButton
onClick={() => reorderRows(1)} ariaLabel="copy icon"
> variant="plain"
{sortMethod === 'alphabetical' ? <FontAwesomeIcon icon={faArrowUp} /> : <FontAwesomeIcon icon={faArrowDown} />} className="group relative ml-2"
</IconButton>} onClick={() => reorderRows(1)}
>
{sortMethod === 'alphabetical' ? (
<FontAwesomeIcon icon={faArrowUp} />
) : (
<FontAwesomeIcon icon={faArrowDown} />
)}
</IconButton>
)}
</div> </div>
<div className="w-5/12 border-r border-mineshaft-600"> <div className="w-5/12 border-r border-mineshaft-600">
<div <div className="flex items-center rounded-lg mt-4 md:mt-0 max-h-10">
className='flex items-center rounded-lg mt-4 md:mt-0 max-h-10' <div className="text-bunker-300 px-2 font-semibold h-10 flex items-center w-7/12">
> Value
<div className='text-bunker-300 px-2 font-semibold h-10 flex items-center w-7/12'>Value</div> </div>
</div> </div>
</div> </div>
<div className="w-[calc(10%)] border-r border-mineshaft-600"> <div className="w-[calc(10%)] border-r border-mineshaft-600">
<div className="flex items-center max-h-16 overflow-hidden"> <div className="flex items-center max-h-16 overflow-hidden">
<div className='text-bunker-300 px-2 font-semibold h-10 flex items-center w-3/12'>Comment</div> <div className="text-bunker-300 px-2 font-semibold h-10 flex items-center w-3/12">
Comment
</div>
</div> </div>
</div> </div>
<div className="w-2/12"> <div className="w-2/12">
<div className="flex items-center max-h-16"> <div className="flex items-center max-h-16">
<div className='text-bunker-300 px-2 font-semibold h-10 flex items-center w-3/12'>Tags</div> <div className="text-bunker-300 px-2 font-semibold h-10 flex items-center w-3/12">
Tags
</div>
</div> </div>
</div> </div>
<div <div className="w-[1.5rem] h-[2.35rem] ml-auto rounded-md flex flex-row justify-center items-center" />
className="w-[1.5rem] h-[2.35rem] ml-auto rounded-md flex flex-row justify-center items-center" <div className="w-[1.5rem] h-[2.35rem] mr-2 flex items-center justfy-center">
/>
<div className='w-[1.5rem] h-[2.35rem] mr-2 flex items-center justfy-center'>
<div <div
onKeyDown={() => null} onKeyDown={() => null}
role="none" role="none"
onClick={() => {}} onClick={() => {}}
className="invisible group-hover:visible" className="invisible group-hover:visible"
> >
<FontAwesomeIcon className="text-bunker-300 hover:text-red pl-2 pr-6 text-lg mt-0.5 invisible" icon={faXmark} /> <FontAwesomeIcon
className="text-bunker-300 hover:text-red pl-2 pr-6 text-lg mt-0.5 invisible"
icon={faXmark}
/>
</div> </div>
</div> </div>
</div> </div>
@@ -1044,10 +1062,16 @@ export default function Dashboard() {
<div className="bg-mineshaft-800 rounded-b-md border-bunker-600"> <div className="bg-mineshaft-800 rounded-b-md border-bunker-600">
{!snapshotData && {!snapshotData &&
data data
?.filter((row) => ?.filter(
row.key?.toUpperCase().includes(searchKeys.toUpperCase()) (row) =>
|| row.tags?.map(tag => tag.name).join(" ")?.toUpperCase().includes(searchKeys.toUpperCase()) row.key?.toUpperCase().includes(searchKeys.toUpperCase()) ||
|| row.comment?.toUpperCase().includes(searchKeys.toUpperCase())) row.tags
?.map((tag) => tag.name)
.join(' ')
?.toUpperCase()
.includes(searchKeys.toUpperCase()) ||
row.comment?.toUpperCase().includes(searchKeys.toUpperCase())
)
.filter((row) => !sharedToHide.includes(row.id)) .filter((row) => !sharedToHide.includes(row.id))
// .filter((row) => row.value !== undefined) // .filter((row) => row.value !== undefined)
.map((keyPair) => ( .map((keyPair) => (
@@ -1097,15 +1121,15 @@ export default function Dashboard() {
tags={projectTags} tags={projectTags}
/> />
))} ))}
<div className='bg-mineshaft-800 text-sm rounded-t-md hover:bg-mineshaft-700 h-10 w-full flex flex-row items-center border-b-2 border-mineshaft-500 sticky top-0 z-[60]'> <div className="bg-mineshaft-800 text-sm rounded-t-md hover:bg-mineshaft-700 h-10 w-full flex flex-row items-center border-b-2 border-mineshaft-500 sticky top-0 z-[60]">
<div className='w-10'/> <div className="w-10" />
<button <button
type="button" type="button"
className='text-bunker-300 relative font-normal h-10 flex items-center w-full cursor-pointer' className="text-bunker-300 relative font-normal h-10 flex items-center w-full cursor-pointer"
onClick={addRowToBottom} onClick={addRowToBottom}
> >
<FontAwesomeIcon icon={faPlus} className='mr-3'/> <FontAwesomeIcon icon={faPlus} className="mr-3" />
<span className='text-sm'>Add Secret</span> <span className="text-sm">Add Secret</span>
</button> </button>
</div> </div>
</div> </div>
@@ -1152,8 +1176,7 @@ export default function Dashboard() {
<SideBar <SideBar
toggleSidebar={toggleSidebar} toggleSidebar={toggleSidebar}
data={data.filter( data={data.filter(
(row: SecretDataProps) => (row: SecretDataProps) => row.id === sidebarSecretId && row.value !== undefined
row.id === sidebarSecretId && row.value !== undefined
)} )}
modifyKey={listenChangeKey} modifyKey={listenChangeKey}
modifyValue={listenChangeValue} modifyValue={listenChangeValue}
@@ -58,7 +58,7 @@ export const ProjectSettingsPage = () => {
const renameWorkspace = useRenameWorkspace(); const renameWorkspace = useRenameWorkspace();
const toggleAutoCapitalization = useToggleAutoCapitalization(); const toggleAutoCapitalization = useToggleAutoCapitalization();
const deleteWorkspace = useDeleteWorkspace(); const deleteWorkspace = useDeleteWorkspace();
// env crud operation // env crud operation
const createWsEnv = useCreateWsEnvironment(); const createWsEnv = useCreateWsEnvironment();
@@ -97,7 +97,7 @@ export const ProjectSettingsPage = () => {
} }
}; };
const onAutoCapitalizationToggle = async (state: boolean) => { const onAutoCapitalizationToggle = async (state: boolean) => {
try { try {
await toggleAutoCapitalization.mutateAsync({ await toggleAutoCapitalization.mutateAsync({
workspaceID, workspaceID,
@@ -123,6 +123,9 @@ export const ProjectSettingsPage = () => {
await deleteWorkspace.mutateAsync({ workspaceID }); await deleteWorkspace.mutateAsync({ workspaceID });
// redirect user to first workspace user is part of // redirect user to first workspace user is part of
const ws = workspaces.find(({ _id }) => _id !== workspaceID); const ws = workspaces.find(({ _id }) => _id !== workspaceID);
if (!ws) {
router.push('/noprojects');
}
router.push(`/dashboard/${ws?._id}`); router.push(`/dashboard/${ws?._id}`);
createNotification({ createNotification({
text: 'Successfully deleted workspace', text: 'Successfully deleted workspace',
@@ -247,7 +250,7 @@ export const ProjectSettingsPage = () => {
const res = await createWsTag.mutateAsync({ const res = await createWsTag.mutateAsync({
workspaceID, workspaceID,
tagName: name, tagName: name,
tagSlug: name.replace(" ", "_") tagSlug: name.replace(' ', '_')
}); });
createNotification({ createNotification({
text: 'Successfully created a tag', text: 'Successfully created a tag',