[WEB-4677] improvement: add defaultOpen property to CustomSearchSelect (#7576)

* [WEB-4677] improvement: add defaultOpen property to CustomSearchSelect

* improvement: add utils to format time duration

* improvement: added initializing state for project store

* improvement: minor changes in automations page

apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/[projectId]/automations/page.tsx

@@ -15,10 +15,14 @@ import { PageHead } from "@/components/core";
 // hooks
 import { SettingsContentWrapper, SettingsHeading } from "@/components/settings";
 import { useProject, useUserPermissions } from "@/hooks/store";
+// plane web imports
+import { CustomAutomationsRoot } from "@/plane-web/components/automations/root";
 
 const AutomationSettingsPage = observer(() => {
   // router
-  const { workspaceSlug, projectId } = useParams();
+  const { workspaceSlug: workspaceSlugParam, projectId: projectIdParam } = useParams();
+  const workspaceSlug = workspaceSlugParam?.toString();
+  const projectId = projectIdParam?.toString();
   // store hooks
   const { workspaceUserInfo, allowPermissions } = useUserPermissions();
   const { currentProjectDetails: projectDetails, updateProject } = useProject();
@@ -48,7 +52,7 @@ const AutomationSettingsPage = observer(() => {
   }
 
   return (
-    <SettingsContentWrapper>
+    <SettingsContentWrapper size="lg">
       <PageHead title={pageTitle} />
       <section className={`w-full ${canPerformProjectAdminActions ? "" : "opacity-60"}`}>
         <SettingsHeading
@@ -58,6 +62,7 @@ const AutomationSettingsPage = observer(() => {
         <AutoArchiveAutomation handleChange={handleChange} />
         <AutoCloseAutomation handleChange={handleChange} />
       </section>
+      <CustomAutomationsRoot projectId={projectId} workspaceSlug={workspaceSlug} />
     </SettingsContentWrapper>
   );
 });

apps/web/ce/components/automations/root.tsx

@@ -0,0 +1,10 @@
+"use client";
+
+import React, { FC } from "react";
+
+export type TCustomAutomationsRootProps = {
+  projectId: string;
+  workspaceSlug: string;
+};
+
+export const CustomAutomationsRoot: FC<TCustomAutomationsRootProps> = () => <></>;

apps/web/core/components/automation/auto-close-automation.tsx

@@ -84,7 +84,7 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
         handleClose={() => setmonthModal(false)}
         handleChange={handleChange}
       />
-      <div className="flex flex-col gap-4 border-b border-custom-border-200 py-6">
+      <div className="flex flex-col gap-4 py-6">
         <div className="flex items-center justify-between">
           <div className="flex items-start gap-3">
             <div className="flex items-center justify-center rounded bg-custom-background-90 p-3">

apps/web/core/store/project/project.store.ts

@@ -25,6 +25,7 @@ export interface IProjectStore {
   projectMap: Record<string, TProject>; // projectId: project info
   projectAnalyticsCountMap: Record<string, TProjectAnalyticsCount>; // projectId: project analytics count
   // computed
+  isInitializingProjects: boolean;
   filteredProjectIds: string[] | undefined;
   workspaceProjectIds: string[] | undefined;
   archivedProjectIds: string[] | undefined;
@@ -101,6 +102,7 @@ export class ProjectStore implements IProjectStore {
       openCollapsibleSection: observable.ref,
       lastCollapsibleAction: observable.ref,
       // computed
+      isInitializingProjects: computed,
       filteredProjectIds: computed,
       workspaceProjectIds: computed,
       archivedProjectIds: computed,
@@ -138,6 +140,13 @@ export class ProjectStore implements IProjectStore {
     this.stateService = new ProjectStateService();
   }
 
+  /**
+   * @description returns true if projects are still initializing
+   */
+  get isInitializingProjects() {
+    return this.loader === "init-loader";
+  }
+
   /**
    * @description returns filtered projects based on filters and search query
    */