more translations

apps/client/src/features/search/components/search-result-item.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Group, Center, Text, Badge, ActionIcon } from "@mantine/core";
+import { Group, Center, Text, Badge, ActionIcon, Tooltip } from "@mantine/core";
 import { Spotlight } from "@mantine/spotlight";
 import { Link } from "react-router-dom";
 import { IconFile, IconDownload } from "@tabler/icons-react";
@@ -10,6 +10,7 @@ import {
   IPageSearch,
 } from "@/features/search/types/search.types";
 import DOMPurify from "dompurify";
+import { useTranslation } from "react-i18next";
 
 interface SearchResultItemProps {
   result: IPageSearch | IAttachmentSearch;
@@ -22,6 +23,8 @@ export function SearchResultItem({
   isAttachmentResult,
   showSpace,
 }: SearchResultItemProps) {
+  const { t } = useTranslation();
+  
   if (isAttachmentResult) {
     const attachmentResult = result as IAttachmentSearch;
 
@@ -68,14 +71,15 @@ export function SearchResultItem({
             )}
           </div>
 
-          <ActionIcon
-            variant="subtle"
-            color="gray"
-            onClick={handleDownload}
-            title="Download attachment"
-          >
-            <IconDownload size={18} />
-          </ActionIcon>
+          <Tooltip label={t("Download attachment")} withArrow>
+            <ActionIcon
+              variant="subtle"
+              color="gray"
+              onClick={handleDownload}
+            >
+              <IconDownload size={18} />
+            </ActionIcon>
+          </Tooltip>
         </Group>
       </Spotlight.Action>
     );

apps/client/src/features/search/components/search-spotlight-filters.tsx

@@ -75,10 +75,10 @@ export function SearchSpotlightFilters({
   }, []);
 
   const contentTypeOptions = [
-    { value: "page", label: "Pages" },
+    { value: "page", label: t("Pages") },
     {
       value: "attachment",
-      label: "Attachments",
+      label: t("Attachments"),
       disabled: !hasLicenseKey,
     },
   ];
@@ -136,13 +136,13 @@ export function SearchSpotlightFilters({
             fw={500}
           >
             {selectedSpaceId
-              ? `Space: ${selectedSpaceData?.name || "Unknown"}`
-              : "Space: All spaces"}
+              ? `${t("Space")}: ${selectedSpaceData?.name || t("Unknown")}`
+              : `${t("Space")}: ${t("All spaces")}`}
           </Button>
         </Menu.Target>
         <Menu.Dropdown>
           <TextInput
-            placeholder="Find a space"
+            placeholder={t("Find a space")}
             data-autofocus
             autoFocus
             leftSection={<IconSearch size={16} />}
@@ -160,15 +160,15 @@ export function SearchSpotlightFilters({
                 <Avatar
                   color="initials"
                   variant="filled"
-                  name="All spaces"
+                  name={t("All spaces")}
                   size={20}
                 />
                 <div style={{ flex: 1 }}>
                   <Text size="sm" fw={500}>
-                    All spaces
+                    {t("All spaces")}
                   </Text>
                   <Text size="xs" c="dimmed">
-                    Search in all your spaces
+                    {t("Search in all your spaces")}
                   </Text>
                 </div>
                 {!selectedSpaceId && <IconCheck size={20} />}
@@ -217,8 +217,8 @@ export function SearchSpotlightFilters({
             fw={500}
           >
             {contentType
-              ? `Type: ${contentTypeOptions.find((opt) => opt.value === contentType)?.label || contentType}`
-              : "Type"}
+              ? `${t("Type")}: ${contentTypeOptions.find((opt) => opt.value === contentType)?.label || t(contentType === "page" ? "Pages" : "Attachments")}`
+              : t("Type")}
           </Button>
         </Menu.Target>
         <Menu.Dropdown>
@@ -237,7 +237,7 @@ export function SearchSpotlightFilters({
                   <Text size="sm">{option.label}</Text>
                   {option.disabled && (
                     <Badge size="xs" mt={4}>
-                      Enterprise
+                      {t("Enterprise")}
                     </Badge>
                   )}
                 </div>