feat: localisation and multi-lang support (#95)

* feat: setup localisation with lingui

* Fix hydration and locale issues

* Add missing translations and tweak selector styling

* Extend language support

* Update lang support

* Extend lang support

* Fix build and add dyanmic imports

apps/web/src/components/NewWorkspaceForm.tsx

@@ -1,3 +1,4 @@
+import { t } from "@lingui/core/macro";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { HiXMark } from "react-icons/hi2";
@@ -34,8 +35,8 @@ export function NewWorkspaceForm() {
     },
     onError: () => {
       showPopup({
-        header: "Unable to create workspace",
-        message: "Please try again later, or contact customer support.",
+        header: t`Unable to create workspace`,
+        message: t`Please try again later, or contact customer support.`,
         icon: "error",
       });
     },
@@ -58,7 +59,7 @@ export function NewWorkspaceForm() {
       <div className="px-5 pt-5">
         <div className="flex w-full items-center justify-between pb-4">
           <h2 className="text-sm font-bold text-neutral-900 dark:text-dark-1000">
-            New workspace
+            {t`New workspace`}
           </h2>
           <button
             type="button"
@@ -74,7 +75,7 @@ export function NewWorkspaceForm() {
 
         <Input
           id="workspace-name"
-          placeholder="Workspace name"
+          placeholder={t`Workspace name`}
           {...register("name")}
           onKeyDown={async (e) => {
             if (e.key === "Enter") {
@@ -87,7 +88,7 @@ export function NewWorkspaceForm() {
       <div className="mt-12 flex items-center justify-end border-t border-light-600 px-5 pb-5 pt-5 dark:border-dark-600">
         <div>
           <Button type="submit" isLoading={createWorkspace.isPending}>
-            Create workspace
+            {t`Create workspace`}
           </Button>
         </div>
       </div>