Support I18n (#243)

* feat: support i18n

* feat: wip support i18n

* feat: complete space translation

* feat: complete page translation

* feat: update space translation

* feat: update workspace translation

* feat: update group translation

* feat: update workspace translation

* feat: update page translation

* feat: update user translation

* chore: update pnpm-lock

* feat: add query translation

* refactor: merge to single file

* chore: remove necessary code

* feat: save language to BE

* fix: only load current language

* feat: save language to locale column

* fix: cleanups

* add language menu to preferences page

* new translations

* translate editor

* Translate editor placeholders

* translate space selection component

---------

Co-authored-by: Philip Okugbe <phil@docmost.com>
Co-authored-by: Philip Okugbe <16838612+Philipinho@users.noreply.github.com>

apps/client/src/features/editor/components/slash-menu/command-list.tsx

@@ -13,6 +13,7 @@ import {
 } from "@mantine/core";
 import classes from "./slash-menu.module.css";
 import clsx from "clsx";
+import { useTranslation } from "react-i18next";
 
 const CommandList = ({
   items,
@@ -25,6 +26,7 @@ const CommandList = ({
   editor: any;
   range: any;
 }) => {
+  const { t } = useTranslation();
   const [selectedIndex, setSelectedIndex] = useState(0);
   const viewportRef = useRef<HTMLDivElement>(null);
 
@@ -104,18 +106,17 @@ const CommandList = ({
                   <ActionIcon
                     variant="default"
                     component="div"
-                    aria-label={item.title}
                   >
                     <item.icon size={18} />
                   </ActionIcon>
 
                   <div style={{ flex: 1 }}>
                     <Text size="sm" fw={500}>
-                      {item.title}
+                      {t(item.title)}
                     </Text>
 
                     <Text c="dimmed" size="xs">
-                      {item.description}
+                      {t(item.description)}
                     </Text>
                   </div>
                 </Group>