Fix/delete remote project redirect (#5403)

* return an empty list if the project doesn't exist

* display the sync dropdown only for remote collections

* update sync dropdown styles for disconnected collections

* fix refetch the backend project on deletion

packages/insomnia/src/ui/components/dropdowns/sync-dropdown.tsx

@@ -327,10 +327,22 @@ export const SyncDropdown: FC<Props> = ({ vcs, workspace, project }) => {
   if (!vcs.hasBackendProject()) {
     return (
       <div>
-        <Dropdown className="wide tall" onOpen={() => refreshVCSAndRefetchRemote()}>
-          <DropdownButton className="btn btn--compact wide">
+        <Dropdown
+          style={{
+            marginLeft: 'var(--padding-md)',
+          }}
+          className="wide tall"
+          onOpen={() => refreshVCSAndRefetchRemote()}
+        >
+          <DropdownButton
+            buttonClass={Button}
+            // @ts-expect-error -- TSCONVERSION
+            size="small"
+            className="btn--clicky-small btn-sync wide text-left overflow-hidden row-spaced"
+          >
             <i className="fa fa-code-fork " /> Setup Sync
           </DropdownButton>
+
           {syncMenuHeader}
           {remoteBackendProjects.length === 0 && (
             <DropdownItem

packages/insomnia/src/ui/components/modals/sync-delete-modal.tsx

@@ -49,11 +49,12 @@ export const SyncDeleteModal = forwardRef<SyncDeleteModalHandle, Props>(({ vcs }
     try {
       await interceptAccessError({
         action: 'delete',
-        callback: () => vcs.archiveProject(),
+        callback: async () => await vcs.archiveProject(),
         resourceName: state.workspaceName,
         resourceType: strings.collection.singular.toLowerCase(),
       });
       modalRef.current?.hide();
+      state.onHide?.();
     } catch (err) {
       setState(state => ({
         ...state,

packages/insomnia/src/ui/routes/remote-collections.tsx

@@ -48,11 +48,9 @@ export const remoteCollectionsLoader: LoaderFunction = async ({ params }): Promi
   const { projectId } = params;
   invariant(typeof projectId === 'string', 'Project Id is required');
 
-  const project = await models.project.getById(projectId);
-
-  invariant(project, 'Project not found');
-
   try {
+    const project = await models.project.getById(projectId);
+    invariant(project, 'Project not found');
     const vcs = getVCS();
     invariant(vcs, 'VCS is not defined');
 

packages/insomnia/src/ui/routes/root.tsx

@@ -117,7 +117,7 @@ const WorkspaceNavigation: FC = () => {
       <Breadcrumb crumbs={crumbs} />
       {isDesign(activeWorkspace) && <ActivityToggle />}
       {isDesign(activeWorkspace) && gitVCS && <GitSyncDropdown key={workspaceId} workspace={activeWorkspace} vcs={gitVCS} />}
-      {isCollection(activeWorkspace) && vcs && <SyncDropdown key={workspaceId} workspace={activeWorkspace} project={activeProject} vcs={vcs} />}
+      {isCollection(activeWorkspace) && isRemoteProject(activeProject) && vcs && <SyncDropdown key={workspaceId} workspace={activeWorkspace} project={activeProject} vcs={vcs} />}
     </Fragment>
   );
 };