Fix after test (#412)

* fix(frontend): clear draft after navigation completes

When creating a conversation with seed opinions and clicking "Publier", the
review page briefly flashed showing empty fields before unmounting. This
occurred because the draft was being cleared before the component unmounted,
causing a reactive re-render of the form with empty values.

Previous fix (PR #411) kept the loading state active during navigation but
still cleared the draft in the review page before navigation completed.

Changes:
- Remove draft clearing from review page (services/agora/src/pages/conversation/new/review/index.vue was already fixed in PR #411)
- Add draft clearing to conversation page onMounted lifecycle
- Check cameFromConversationCreation flag to only clear after successful creation
- Use resetDraft() store method for proper cleanup

Flow:
1. User clicks "Publier" - loading state activates, draft data intact
2. Navigation starts - review page stays rendered with data
3. Review page unmounts - no re-render because draft wasn't cleared
4. Conversation page mounts and renders
5. Conversation page onMounted checks flag and silently clears draft
6. Draft is now empty for next conversation creation

This ensures the review page maintains its visual state during unmount,
preventing any flash of empty form fields during the transition.

* fix(frontend): translate "copied to clipboard" notifications

The "Copied link to clipboard" notification was hardcoded in English in
both PostDetails.vue and WebShare.ts. This change adds proper i18n support
to ensure all clipboard copy notifications are translated across all 7
supported languages.

Changes:
- Created PostDetails.i18n.ts with copiedToClipboard translations
- Updated PostDetails.vue to use translated notification in copyLinkCallback
- Created WebShare.i18n.ts with copiedToClipboard translations
- Updated WebShare.ts to use translated notification in fallback path
- Removed Platform.is.mobile check from WebShare to support Web Share API
  on all browsers where available

Now all "Copied link to clipboard" messages in the share flow are properly
translated and will display in the user's selected language.

Author: nicobao

services/agora/src/components/post/PostDetails.i18n.ts

@@ -0,0 +1,37 @@
+/**
+ * Internationalization translations for PostDetails component
+ * Supports all languages configured in the application
+ */
+
+import type { SupportedDisplayLanguageCodes } from "src/shared/languages";
+
+export interface PostDetailsTranslations {
+  copiedToClipboard: string;
+}
+
+export const postDetailsTranslations: Record<
+  SupportedDisplayLanguageCodes,
+  PostDetailsTranslations
+> = {
+  en: {
+    copiedToClipboard: "Copied link to clipboard",
+  },
+  ar: {
+    copiedToClipboard: "تم نسخ الرابط إلى الحافظة",
+  },
+  es: {
+    copiedToClipboard: "Enlace copiado al portapapeles",
+  },
+  fr: {
+    copiedToClipboard: "Lien copié dans le presse-papiers",
+  },
+  "zh-Hans": {
+    copiedToClipboard: "已复制链接到剪贴板",
+  },
+  "zh-Hant": {
+    copiedToClipboard: "已複製連結到剪貼簿",
+  },
+  ja: {
+    copiedToClipboard: "リンクをクリップボードにコピーしました",
+  },
+};

services/agora/src/components/post/PostDetails.vue

@@ -110,6 +110,11 @@ import { storeToRefs } from "pinia";
 import { useUserStore } from "src/stores/user";
 import { useShareActions } from "src/composables/share/useShareActions";
 import { useNotify } from "src/utils/ui/notify";
+import { useComponentI18n } from "src/composables/ui/useComponentI18n";
+import {
+  postDetailsTranslations,
+  type PostDetailsTranslations,
+} from "./PostDetails.i18n";
 
 const props = defineProps<{
   conversationData: ExtendedConversation;
@@ -129,6 +134,7 @@ const { invalidateAnalysis, forceRefreshAnalysis } =
   useInvalidateCommentQueries();
 const shareActions = useShareActions();
 const notify = useNotify();
+const { t } = useComponentI18n<PostDetailsTranslations>(postDetailsTranslations);
 
 const participantCountLocal = ref(
   props.conversationData.metadata.participantCount
@@ -234,7 +240,7 @@ function shareClicked(): void {
     targetAuthor: props.conversationData.metadata.authorUsername,
     copyLinkCallback: async () => {
       await copyToClipboard(sharePostUrl);
-      notify.showNotifyMessage("Copied link to clipboard");
+      notify.showNotifyMessage(t("copiedToClipboard"));
     },
     openQrCodeCallback: () => {
       $q.dialog({

services/agora/src/pages/conversation/[postSlugId].vue

@@ -31,13 +31,15 @@ import WidthWrapper from "src/components/navigation/WidthWrapper.vue";
 import DrawerLayout from "src/layouts/DrawerLayout.vue";
 import PostDetails from "src/components/post/PostDetails.vue";
 import { useConversationData } from "src/composables/conversation/useConversationData";
-import { ref, onBeforeUnmount } from "vue";
+import { ref, onBeforeUnmount, onMounted } from "vue";
 import { useNavigationStore } from "src/stores/navigation";
+import { useNewPostDraftsStore } from "src/stores/newConversationDrafts";
 
 const postDetailsRef = ref<InstanceType<typeof PostDetails>>();
 const { conversationData, hasConversationData, refreshConversation } =
   useConversationData();
 const navigationStore = useNavigationStore();
+const { resetDraft } = useNewPostDraftsStore();
 
 function handleRefresh(done: () => void): void {
   refreshConversation(() => {
@@ -49,6 +51,13 @@ function handleRefresh(done: () => void): void {
   });
 }
 
+// Clear draft only after successfully navigating from conversation creation
+onMounted(() => {
+  if (navigationStore.cameFromConversationCreation) {
+    resetDraft();
+  }
+});
+
 // Clear conversation creation context when leaving this page
 onBeforeUnmount(() => {
   navigationStore.clearConversationCreationContext();

services/agora/src/utils/share/WebShare.i18n.ts

@@ -0,0 +1,37 @@
+/**
+ * Internationalization translations for WebShare utility
+ * Supports all languages configured in the application
+ */
+
+import type { SupportedDisplayLanguageCodes } from "src/shared/languages";
+
+export interface WebShareTranslations {
+  copiedToClipboard: string;
+}
+
+export const webShareTranslations: Record<
+  SupportedDisplayLanguageCodes,
+  WebShareTranslations
+> = {
+  en: {
+    copiedToClipboard: "Copied link to clipboard",
+  },
+  ar: {
+    copiedToClipboard: "تم نسخ الرابط إلى الحافظة",
+  },
+  es: {
+    copiedToClipboard: "Enlace copiado al portapapeles",
+  },
+  fr: {
+    copiedToClipboard: "Lien copié dans le presse-papiers",
+  },
+  "zh-Hans": {
+    copiedToClipboard: "已复制链接到剪贴板",
+  },
+  "zh-Hant": {
+    copiedToClipboard: "已複製連結到剪貼簿",
+  },
+  ja: {
+    copiedToClipboard: "リンクをクリップボードにコピーしました",
+  },
+};

services/agora/src/utils/share/WebShare.ts

@@ -1,18 +1,22 @@
 import { useShare } from "@vueuse/core";
-import { Platform } from "quasar";
 import { useClipboard } from "@vueuse/core";
 import { useDialog } from "../ui/dialog";
 import { useNotify } from "../ui/notify";
+import { useComponentI18n } from "src/composables/ui/useComponentI18n";
+import {
+  webShareTranslations,
+  type WebShareTranslations,
+} from "./WebShare.i18n";
 
 export function useWebShare() {
   const webShare = useShare();
   const clipBoard = useClipboard();
   const dialog = useDialog();
   const notify = useNotify();
+  const { t } = useComponentI18n<WebShareTranslations>(webShareTranslations);
 
   function isSupportedSharePlatform() {
-    // Ignore desktop browsers
-    if (webShare.isSupported && Platform.is.mobile) {
+    if (webShare.isSupported) {
       return true;
     } else {
       console.log("Not a supported web share platform");
@@ -30,7 +34,7 @@ export function useWebShare() {
     } else {
       if (clipBoard.isSupported) {
         await clipBoard.copy(url);
-        notify.showNotifyMessage("Copied link to clipboard");
+        notify.showNotifyMessage(t("copiedToClipboard"));
       } else {
         console.log("Clipboard is not supported");
         dialog.showMessage("Share Link", url);