📎 Update test

* 🐛 Do not show deleted files on search

* 💄 Add cosmetic changes to dashboard deleted files page

backend/src/app/rpc/commands/search.clj

@@ -19,7 +19,7 @@
       inner join team_profile_rel as tpr on (tpr.team_id = p.team_id)
       where tpr.profile_id = ?
         and p.team_id = ?
-        and (p.deleted_at is null or p.deleted_at > now())
+        and (p.deleted_at is null)
         and (tpr.is_admin = true or
              tpr.is_owner = true or
              tpr.can_edit = true)
@@ -29,7 +29,7 @@
       inner join project_profile_rel as ppr on (ppr.project_id = p.id)
       where ppr.profile_id = ?
         and p.team_id = ?
-        and (p.deleted_at is null or p.deleted_at > now())
+        and (p.deleted_at is null)
         and (ppr.is_admin = true or
              ppr.is_owner = true or
              ppr.can_edit = true)
@@ -47,7 +47,7 @@
      left join file_thumbnail as ft on (ft.file_id = f.id and ft.revn = f.revn)
     inner join projects as pr on (f.project_id = pr.id)
     where f.name ilike ('%' || ? || '%')
-      and (f.deleted_at is null or f.deleted_at > now())
+      and (f.deleted_at is null)
     order by f.created_at asc")
 
 (defn search-files

frontend/playwright/ui/specs/dashboard-deleted.spec.js

@@ -20,12 +20,7 @@ test.describe("Dashboard Deleted Page", () => {
     // Navigate directly to deleted page
     await dashboardPage.goToDeleted();
 
-    // Check for the restore all and clear trash buttons
-    await expect(
-      page.getByRole("button", { name: "Restore All" }),
-    ).toBeVisible();
-    await expect(
-      page.getByRole("button", { name: "Clear trash" }),
-    ).toBeVisible();
+    // Check for the delete-page-section element
+    await expect(page.getByTestId("deleted-page-section")).toBeVisible();
   });
 });

frontend/src/app/main/ui/dashboard/deleted.cljs

@@ -32,6 +32,27 @@
 (def ^:private menu-icon
   (deprecated-icon/icon-xref :menu (stl/css :menu-icon)))
 
+(defn- on-restore-project
+  [project]
+  (let [on-accept #(st/emit! (dd/restore-project-immediately project))]
+    (st/emit! (modal/show
+               {:type :confirm
+                :title (tr "dashboard.restore-project-confirmation.title")
+                :message (tr "dashboard.restore-project-confirmation.description" (:name project))
+                :accept-style :primary
+                :accept-label (tr "labels.continue")
+                :on-accept on-accept}))))
+
+(defn- on-delete-project
+  [project]
+  (let [accept-fn #(st/emit! (dd/delete-project-immediately project))]
+    (st/emit! (modal/show
+               {:type :confirm
+                :title (tr "dashboard.delete-forever-confirmation.title")
+                :message (tr "dashboard.delete-project-forever-confirmation.description" (:name project))
+                :accept-label (tr "dashboard.delete-forever-confirmation.title")
+                :on-accept accept-fn}))))
+
 (mf/defc header*
   {::mf/props :obj
    ::mf/private true}
@@ -41,6 +62,7 @@
     [:h1 (tr "dashboard.projects-title")]]])
 
 (mf/defc deleted-project-menu*
+  {::mf/private true}
   [{:keys [project  show on-close top left]}]
   (let [top  (d/nilv top 0)
         left (d/nilv left 0)
@@ -48,25 +70,13 @@
         on-restore-project
         (mf/use-fn
          (mf/deps project)
-         (fn []
-           (let [on-accept #(st/emit! (dd/restore-project-immediately project))]
-             (st/emit! (modal/show {:type :confirm
-                                    :title (tr "dashboard.restore-project-confirmation.title")
-                                    :message (tr "dashboard.restore-project-confirmation.description" (:name project))
-                                    :accept-style :primary
-                                    :accept-label (tr "labels.continue")
-                                    :on-accept on-accept})))))
+         (partial on-restore-project project))
 
         on-delete-project
         (mf/use-fn
          (mf/deps project)
-         (fn []
-           (let [accept-fn #(st/emit! (dd/delete-project-immediately project))]
-             (st/emit! (modal/show {:type :confirm
-                                    :title (tr "dashboard.delete-forever-confirmation.title")
-                                    :message (tr "dashboard.delete-project-forever-confirmation.description" (:name project))
-                                    :accept-label (tr "dashboard.delete-forever-confirmation.title")
-                                    :on-accept accept-fn})))))
+         (partial on-delete-project project))
+
         options
         (mf/with-memo [on-restore-project on-delete-project]
           [{:name   (tr "dashboard.restore-project-button")
@@ -174,8 +184,8 @@
           :limit limit
           :selected-files selected-files}])]]))
 
-
 (mf/defc menu*
+  {::mf/private true}
   [{:keys [team-id section]}]
   (let [on-recent-click
         (mf/use-fn
@@ -222,7 +232,8 @@
                            (some #(= (:id project) (:project-id %))
                                  (vals deleted-map)))))
                (sort-by :modified-at)
-               (reverse)))
+               (reverse)
+               (not-empty)))
 
         team-id
         (get team :id)
@@ -273,37 +284,44 @@
 
     [:*
      [:> header* {:team team}]
-     [:section {:class (stl/css :dashboard-container :no-bg)}
+     [:section {:class (stl/css :dashboard-container :no-bg)
+                :data-testid "deleted-page-section"}
       [:*
        [:div {:class (stl/css :no-bg)}
 
         [:> menu* {:team-id team-id :section :dashboard-deleted}]
 
-        [:div {:class (stl/css :deleted-info-content)}
-         [:p {:class (stl/css :deleted-info)}
-          (tr "dashboard.trash-info-text-part1")
-          [:span {:class (stl/css :info-text-highlight)}
-           (tr "dashboard.trash-info-text-part2" deletion-days)]
-          (tr "dashboard.trash-info-text-part3")
-          [:br]
-          (tr "dashboard.trash-info-text-part4")]
-         [:div {:class (stl/css :deleted-options)}
-          [:> button* {:variant "ghost"
-                       :type "button"
-                       :on-click on-restore-all}
-           (tr "dashboard.restore-all-deleted-button")]
-          [:> button* {:variant "destructive"
-                       :type "button"
-                       :icon "delete"
-                       :on-click on-delete-all}
-           (tr "dashboard.clear-trash-button")]]]
+        (if (seq projects)
+          [:*
+           [:div {:class (stl/css :deleted-info-content)}
+            [:p {:class (stl/css :deleted-info)}
+             (tr "dashboard.trash-info-text-part1")
+             [:span {:class (stl/css :info-text-highlight)}
+              (tr "dashboard.trash-info-text-part2" deletion-days)]
+             (tr "dashboard.trash-info-text-part3")
+             [:br]
+             (tr "dashboard.trash-info-text-part4")]
+            [:div {:class (stl/css :deleted-options)}
+             [:> button* {:variant "ghost"
+                          :type "button"
+                          :on-click on-restore-all}
+              (tr "dashboard.restore-all-deleted-button")]
+             [:> button* {:variant "destructive"
+                          :type "button"
+                          :icon "delete"
+                          :on-click on-delete-all}
+              (tr "dashboard.clear-trash-button")]]]
 
-        (when (seq projects)
-          (for [{:keys [id] :as project} projects]
-            (let [files (when deleted-map
-                          (->> (vals deleted-map)
-                               (filterv #(= id (:project-id %)))
-                               (sort-by :modified-at #(compare %2 %1))))]
-              [:> deleted-project-item* {:project project
-                                         :files files
-                                         :key id}])))]]]]))
+           (for [{:keys [id] :as project} projects]
+             (let [files (when deleted-map
+                           (->> (vals deleted-map)
+                                (filterv #(= id (:project-id %)))
+                                (sort-by :modified-at #(compare %2 %1))))]
+               [:> deleted-project-item* {:project project
+                                          :files files
+                                          :key id}]))]
+
+          ;; when no deleted projects
+          [:div {:class (stl/css :deleted-info-content)}
+           [:p {:class (stl/css :deleted-info)}
+            (tr "dashboard.trash-info-text-no-projects")]])]]]]))

frontend/src/app/main/ui/dashboard/projects.scss

@@ -4,35 +4,36 @@
 //
 // Copyright (c) KALEIDOS INC
 
-@use "common/refactor/common-refactor.scss" as deprecated;
 @use "common/refactor/common-dashboard";
-@use "../ds/typography.scss" as t;
-@use "../ds/_borders.scss" as *;
-@use "../ds/spacing.scss" as *;
-@use "../ds/_sizes.scss" as *;
-@use "../ds/z-index.scss" as *;
+@use "ds/typography.scss" as t;
+@use "ds/_borders.scss" as *;
+@use "ds/spacing.scss" as *;
+@use "ds/_sizes.scss" as *;
+@use "ds/z-index.scss" as *;
+@use "ds/mixins.scss" as *;
+@use "ds/_utils.scss" as *;
 
 .dashboard-container {
   flex: 1 0 0;
-  width: 100%;
+  inline-size: 100%;
   margin-inline-end: var(--sp-l);
-  border-top: $b-1 solid var(--panel-border-color);
+  border-block-start: $b-1 solid var(--panel-border-color);
   overflow-y: auto;
-  padding-bottom: var(--sp-xxxl);
+  padding-block-end: var(--sp-xxxl);
 }
 
 .dashboard-projects {
   user-select: none;
-  height: calc(100vh - deprecated.$s-64);
+  block-size: calc(100vh - px2rem(64));
 }
 
 .with-team-hero {
-  height: calc(100vh - deprecated.$s-280);
+  block-size: calc(100vh - px2rem(280));
 }
 
 .dashboard-shared {
-  width: calc(100vw - deprecated.$s-320);
-  margin-inline-end: deprecated.$s-52;
+  inline-size: calc(100vw - px2rem(320));
+  margin-inline-end: px2rem(52);
 }
 
 .search {
@@ -66,8 +67,8 @@
   align-items: center;
   justify-content: space-between;
   gap: var(--sp-s);
-  width: 99%;
-  max-height: $sz-40;
+  inline-size: 99%;
+  max-block-size: $sz-40;
   padding: var(--sp-s) var(--sp-s) var(--sp-s) var(--sp-l);
   margin-block-start: var(--sp-l);
   border-radius: $br-4;
@@ -77,19 +78,19 @@
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  width: 100%;
-  min-height: var(--sp-xxxl);
+  inline-size: 100%;
+  min-block-size: $sz-32;
   margin-inline-start: var(--sp-s);
 }
 
 .project-name {
+  @include textEllipsis;
   @include t.use-typography("body-large");
-  width: fit-content;
-  margin-inline-end: var(--sp-m);
-  line-height: 0.8;
   color: var(--title-foreground-color-hover);
   cursor: pointer;
-  height: var(--sp-l);
+  block-size: $sz-16;
+  line-height: 0.8;
+  margin-inline-end: var(--sp-m);
 }
 
 .info-wrapper {
@@ -116,8 +117,8 @@
 .add-file-btn,
 .options-btn {
   @extend .button-tertiary;
-  height: var(--sp-xxxl);
-  width: var(--sp-xxxl);
+  block-size: $sz-32;
+  inline-size: $sz-32;
   margin: 0 var(--sp-s);
   padding: var(--sp-s);
 }
@@ -129,7 +130,7 @@
 }
 
 .grid-container {
-  width: 100%;
+  inline-size: 100%;
   padding: 0 var(--sp-xs);
 }
 
@@ -139,11 +140,13 @@
 
 .show-more {
   --show-more-color: var(--button-secondary-foreground-color-rest);
-  @include deprecated.buttonStyle;
   @include t.use-typography("body-medium");
+  border: none;
+  background: none;
+  cursor: pointer;
   position: absolute;
-  top: var(--sp-s);
-  right: deprecated.$s-52;
+  inset-block-start: var(--sp-s);
+  inset-inline-end: px2rem(52);
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -156,8 +159,8 @@
 }
 
 .show-more-icon {
-  height: var(--sp-l);
-  width: var(--sp-l);
+  block-size: $sz-16;
+  inline-size: $sz-16;
   fill: none;
   stroke: var(--show-more-color);
 }
@@ -165,7 +168,7 @@
 // Team hero
 .team-hero {
   background-color: var(--color-background-tertiary);
-  border-radius: deprecated.$br-8;
+  border-radius: $br-8;
   border: none;
   display: flex;
   margin: var(--sp-l);
@@ -174,12 +177,11 @@
 
   img {
     border-radius: $br-4;
-    height: var(--sp-xl) 0;
-    width: auto;
+    inline-size: auto;
 
     @media (max-width: 1200px) {
       display: none;
-      width: 0;
+      inline-size: 0;
     }
   }
 }
@@ -193,9 +195,8 @@
 }
 
 .title {
-  font-size: $sz-24;
   color: var(--color-foreground-primary);
-  font-weight: deprecated.$fw400;
+  font-size: px2rem(24);
 }
 
 .info {
@@ -215,8 +216,8 @@
   --close-icon-foreground-color: var(--icon-foreground);
   position: absolute;
   top: var(--sp-xl);
-  right: var(--sp-xxl);
-  width: var(--sp-xxl);
+  inset-inline-end: var(--sp-xxl);
+  inline-size: var(--sp-xxl);
   background-color: transparent;
   border: none;
   cursor: pointer;
@@ -231,20 +232,20 @@
 }
 
 .invite {
-  height: var(--sp-xxxl);
-  width: deprecated.$s-180;
+  block-size: $sz-32;
+  inline-size: px2rem(180);
 }
 
 .img-wrapper {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: var(--sp-xl) 0;
-  height: var(--sp-xl) 0;
+  inline-size: var(--sp-xl) 0;
+  block-size: var(--sp-xl) 0;
   overflow: hidden;
-  border-radius: deprecated.$br-4;
+  border-radius: $br-4;
   @media (max-width: 1200px) {
     display: none;
-    width: 0;
+    inline-size: 0;
   }
 }

frontend/translations/en.po

@@ -8489,6 +8489,9 @@ msgstr "Restore project"
 msgid "dashboard.delete-project-button"
 msgstr "Delete project"
 
+msgid "dashboard.trash-info-text-no-projects"
+msgstr "Your trash is empty. Deleted files and projects will appear here."
+
 msgid "dashboard.trash-info-text-part1"
 msgstr "Deleted files will remain in the trash for"
 

frontend/translations/es.po

@@ -8342,6 +8342,9 @@ msgstr "Restaurar proyecto"
 msgid "dashboard.delete-project-button"
 msgstr "Eliminar proyecto"
 
+msgid "dashboard.trash-info-text-no-projects"
+msgstr "Tu papelera está vacía. Los archivos y proyectos eliminados aparecerán aquí."
+
 msgid "dashboard.trash-info-text-part1"
 msgstr "Los archivos eliminados permanecerán en la papelera durante"