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/views/card/components/Comment.tsx

@@ -1,3 +1,4 @@
+import { t } from "@lingui/core/macro";
 import { formatDistanceToNow } from "date-fns";
 import { useState } from "react";
 import ContentEditable from "react-contenteditable";
@@ -57,8 +58,8 @@ const Comment = ({
     },
     onError: () => {
       showPopup({
-        header: "Unable to update comment",
-        message: "Please try again later, or contact customer support.",
+        header: t`Unable to update comment`,
+        message: t`Please try again later, or contact customer support.`,
         icon: "error",
       });
     },
@@ -76,7 +77,7 @@ const Comment = ({
     ...(isAuthor
       ? [
           {
-            label: "Edit comment",
+            label: t`Edit comment`,
             action: () => setIsEditing(true),
             icon: <HiPencil className="h-[16px] w-[16px] text-dark-900" />,
           },
@@ -85,7 +86,7 @@ const Comment = ({
     ...(isAuthor || isAdmin
       ? [
           {
-            label: "Delete comment",
+            label: t`Delete comment`,
             action: () => openModal("DELETE_COMMENT", publicId),
             icon: <HiTrash className="h-[16px] w-[16px] text-dark-900" />,
           },
@@ -117,7 +118,7 @@ const Comment = ({
             </span>
             {isEdited && (
               <span className="text-light-900 dark:text-dark-800">
-                {" (edited)"}
+                {t` (edited)`}
               </span>
             )}
           </p>
@@ -140,7 +141,7 @@ const Comment = ({
       ) : (
         <form onSubmit={handleSubmit(onSubmit)}>
           <ContentEditable
-            placeholder="Add a comment..."
+            placeholder={t`Add a comment...`}
             html={watch("comment")}
             disabled={false}
             onChange={(e) => setValue("comment", e.target.value)}
@@ -152,14 +153,14 @@ const Comment = ({
               variant="ghost"
               onClick={() => setIsEditing(false)}
             >
-              Cancel
+              {t`Cancel`}
             </Button>
             <Button
               isLoading={updateCommentMutation.isPending}
               type="submit"
               size="sm"
             >
-              Save
+              {t`Save`}
             </Button>
           </div>
         </form>