@dev.smartpricing/message-composer-layer 4.5.1-next.1 → 4.5.1-next.2

package/README.md

@@ -85,7 +85,7 @@ watch(
 )
 ```
 
-**WABA.** The Host does not supply the WABA: the WABAs follow the Organization and the backend resolves them (ADR [0015](../../docs/adr/0015-message-group-waba-fixed-at-first-submission.md)). WhatsApp is configured when the Host's `channels` include `whatsapp` and the Organization has at least one WABA. A Message Group is submitted to one WABA, chosen at its first submission and fixed from then on; with several WABAs the user picks one when requesting approval. `metaWabaId` in the context is optional and is only the preselection in that picker.
+**WABA.** The Host does not supply the WABA: the WABAs follow the Organization and the backend resolves them (ADR [0015](../../docs/adr/0015-message-group-waba-fixed-at-first-submission.md)). WhatsApp is configured when the Host's `channels` include `whatsapp` and the Organization has at least one WABA. A Message Group is submitted to one WABA, chosen at its first submission and fixed from then on; with several WABAs the user picks one when requesting approval. `metaWabaId` in the context is optional and is only the preselection in that picker. A Host that sends from one WABA only also sets `metaWabaLocked: ref(true)`: a new Message Group is then submitted to `metaWabaId` without asking, as long as it is one of the Organization's WABAs.
 
 ### Upgrading to 4.5.0
 

package/app/components/TemplateList/BaseTable.vue

@@ -322,6 +322,17 @@ const paginationSummary = computed(() => {
         v-model:sorting="sorting"
         :data-testid="templateListTableTestIds.table"
       >
+        <!-- Shown instead of the "no data" row while a list with no rows is loading. -->
+        <template #loading>
+          <div
+            class="flex items-center justify-center gap-2 text-muted"
+            :data-testid="templateListTableTestIds.loading"
+          >
+            <UIcon name="ph:circle-notch-bold" class="size-4 animate-spin" />
+            <span>{{ t('pages.message_library.loading') }}</span>
+          </div>
+        </template>
+
         <template #name-cell="{ row }">
           <div
             class="flex items-center gap-2"

package/app/composables/composerContext.ts

@@ -22,6 +22,12 @@ export interface ComposerContext {
    * the Organization's (ADR 0015).
    */
   metaWabaId?: Ref<string>
+  /**
+   * The Host works on `metaWabaId` only (Smartconnect): a new Message Group
+   * is submitted to it and the user is not asked. Applies while `metaWabaId`
+   * is one of the Organization's WABAs; otherwise the choice stays the user's.
+   */
+  metaWabaLocked?: Ref<boolean>
   isAdmin?: Ref<boolean>
   organizationData?: Ref<OrganizationData>
 }

package/app/composables/useMessageGroupWaba.ts

@@ -9,7 +9,7 @@ import WabaSelectModal from '~/components/Composer/WabaSelectModal.vue'
  */
 export function useMessageGroupWaba(storedWabaId: MaybeRefOrGetter<string | null | undefined>) {
   const { data: wabas, refresh } = useOrganizationWabasQuery()
-  const { metaWabaId } = storeToRefs(useAppContextStore())
+  const { metaWabaId, metaWabaLocked } = storeToRefs(useAppContextStore())
   const modal = useOverlay().create(WabaSelectModal)
 
   // A submission of one language does not read the Message Group again: its
@@ -45,9 +45,10 @@ export function useMessageGroupWaba(storedWabaId: MaybeRefOrGetter<string | null
   /**
    * The WABA to name in a submission. Asks the user only at the first
    * submission of a Message Group whose Organization has several WABAs;
-   * otherwise names none and the backend resolves it. A lookup that has not
-   * answered yet is waited for; one that failed leaves it to the backend.
-   * Returns null when the user gives up.
+   * otherwise names none and the backend resolves it. A Host that works on
+   * its own WABA only (`metaWabaLocked`) is not asked: that WABA is named.
+   * A lookup that has not answered yet is waited for; one that failed leaves
+   * it to the backend. Returns null when the user gives up.
    */
   async function chooseWaba(): Promise<{ wabaId?: string } | null> {
     if (wabaId.value) return {}
@@ -58,6 +59,8 @@ export function useMessageGroupWaba(storedWabaId: MaybeRefOrGetter<string | null
     const preselected = candidates.some((candidate) => candidate.id === metaWabaId.value)
       ? metaWabaId.value
       : undefined
+    if (preselected && metaWabaLocked.value) return { wabaId: preselected }
+
     const chosen = await modal.open({ wabas: candidates, preselected }).result
 
     return chosen ? { wabaId: chosen } : null

package/app/queries/messageGroups.ts

@@ -56,7 +56,9 @@ export function useMessageGroupListQuery(
     // Never across Organizations: a switch must not show the previous one's rows.
     placeholderData: (previousData, previousEntry) =>
       previousEntry?.key.at(-1) === listOrganizationId() ? previousData : undefined,
-    ...enabledOption(queryOptions.enabled),
+    // Until an Organization is resolved the list waits (pending, so callers
+    // show it as loading) instead of failing into an empty table.
+    enabled: () => toValue(queryOptions.enabled ?? true) && !!listOrganizationId(),
   })
 }
 

package/app/stores/appContext.ts

@@ -25,6 +25,8 @@ export const useAppContextStore = defineStore('appContext', () => {
   const isAdmin = computed(() => ctx.isAdmin?.value ?? false)
   // The Host's preselection among the Organization's WABAs (ADR 0015).
   const metaWabaId = computed(() => ctx.metaWabaId?.value || undefined)
+  // The Host's WABA is the only one it works on: no choice is offered.
+  const metaWabaLocked = computed(() => ctx.metaWabaLocked?.value ?? false)
 
   // Sync i18n locale when mainLanguage changes
   watch(
@@ -58,6 +60,7 @@ export const useAppContextStore = defineStore('appContext', () => {
     default_tags,
     isAdmin,
     metaWabaId,
+    metaWabaLocked,
 
     validationErrors,
   }

package/app/utils/testIds.const.ts

@@ -519,6 +519,7 @@ export const templateListTableTestIds = {
   paginationSummary: 'template-list-table-pagination-summary',
   card: 'template-list-table-card',
   table: 'template-list-table-table',
+  loading: 'template-list-table-loading',
   rowName: 'template-list-table-row-name',
   rowInternalBadge: 'template-list-table-row-internal-badge',
   rowCategoryBadge: 'template-list-table-row-category-badge',

package/i18n/locales/de.ts

@@ -825,6 +825,7 @@ export default {
         status: 'Status',
         updated_at: 'Aktualisiert am',
       },
+      loading: 'Nachrichten werden geladen...',
       pagination_summary: '{from}–{to} von {total}',
       product_placeholder: 'Produkt auswählen',
       render_type_placeholder: 'Render-Typ auswählen',

package/i18n/locales/en.ts

@@ -814,6 +814,7 @@ export default {
         status: 'Status',
         updated_at: 'Updated at',
       },
+      loading: 'Loading messages...',
       pagination_summary: '{from}–{to} of {total}',
       product_placeholder: 'Select product',
       render_type_placeholder: 'Select render type',

package/i18n/locales/es.ts

@@ -823,6 +823,7 @@ export default {
         status: 'Estado',
         updated_at: 'Actualizado el',
       },
+      loading: 'Cargando mensajes...',
       pagination_summary: '{from}–{to} de {total}',
       product_placeholder: 'Seleccionar producto',
       render_type_placeholder: 'Seleccionar tipo de renderizado',

package/i18n/locales/fr.ts

@@ -827,6 +827,7 @@ export default {
         status: 'Statut',
         updated_at: 'Mis à jour le',
       },
+      loading: 'Chargement des messages...',
       pagination_summary: '{from}–{to} sur {total}',
       product_placeholder: 'Sélectionner un produit',
       render_type_placeholder: 'Sélectionner le type de rendu',

package/i18n/locales/it.ts

@@ -820,6 +820,7 @@ export default {
         status: 'Stato',
         updated_at: 'Aggiornato il',
       },
+      loading: 'Caricamento dei messaggi...',
       pagination_summary: '{from}–{to} di {total}',
       product_placeholder: 'Seleziona prodotto',
       render_type_placeholder: 'Seleziona tipo di rendering',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dev.smartpricing/message-composer-layer",
-  "version": "4.5.1-next.1",
+  "version": "4.5.1-next.2",
   "private": false,
   "type": "module",
   "main": "./nuxt.config.ts",
@@ -35,7 +35,7 @@
     "vue-router": "^5.0.7",
     "vue3-emoji-picker": "^1.1.8",
     "zod": "^4.4.3",
-    "@dev.smartpricing/message-composer-utils": "4.5.1-next.1"
+    "@dev.smartpricing/message-composer-utils": "4.5.1-next.2"
   },
   "devDependencies": {
     "@dev.smartpricing/platform-layer": "^0.0.23",