More things

frontend/app/components/ProposalSentModal.vue

@@ -0,0 +1,62 @@
+<script setup lang="ts">
+/* The member's "request sent" confirmation, in ConfirmModal's shape: teleported
+   overlay, dismissed by the backdrop or its one button (Esc is left to the
+   caller, which orders its popups). It says the save went to the admins as a
+   proposal — and dismissing it is what walks out of the editor, so a sent
+   draft never sits there waiting to be submitted a second time. */
+const props = defineProps<{
+  open: boolean
+  /* a request for a page the wiki does not have yet says different words */
+  creating?: boolean
+}>()
+
+const { t } = useI18n()
+
+/* the wording lives here rather than in withDefaults static defaults so it
+   follows the interface language as it changes */
+const titleText = computed(() => t('editor.proposalSentTitle'))
+const messageText = computed(() =>
+  props.creating ? t('editor.proposalSentCreate') : t('editor.proposalSent')
+)
+const doneText = computed(() => t('common.done'))
+
+const emit = defineEmits<{ close: [] }>()
+
+const doneButtonEl = ref<HTMLButtonElement | null>(null)
+
+/* land on the one button when the popup opens, so Enter always means
+   "seen it" — the way out of the editor */
+watch(
+  () => props.open,
+  async (isOpen) => {
+    if (!isOpen) return
+    await nextTick()
+    doneButtonEl.value?.focus()
+  },
+  { flush: 'post' }
+)
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition name="confirm-popup">
+      <div v-if="open" class="confirm-overlay" @click.self="emit('close')">
+        <div class="confirm-modal" role="dialog" aria-modal="true" :aria-label="titleText">
+          <div class="sent-check" aria-hidden="true">✓</div>
+          <h2 class="confirm-title">{{ titleText }}</h2>
+          <p class="confirm-message">{{ messageText }}</p>
+          <div class="confirm-actions">
+            <button
+              ref="doneButtonEl"
+              type="button"
+              class="btn btn-primary"
+              @click="emit('close')"
+            >
+              {{ doneText }}
+            </button>
+          </div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>