@feedmepos/mf-order-setting 0.0.86 → 0.0.87

package/src/locales/en-US.json

@@ -216,7 +216,7 @@
         "dineInType": "Dine In Type",
         "disabled": "Disabled",
         "disableRemoteQueue": "Disable Remote Queue",
-        "disableSMS": "Disable SMS",
+        "disableSMS": "Disable notifications",
         "discountCampaign": "Discount Campaign",
         "discountRule": {
             "add": "Add discount rule",
@@ -468,6 +468,25 @@
         "showNotAvailable": "Show not available",
         "showNotAvailableMenuItem": "Show not available menu item",
         "sms": "SMS",
+        "notifications": "Notifications",
+        "notifyChannel": {
+            "title": "Channels",
+            "hint": "Tried in order. The next channel is used only if the one before it cannot reach the customer.",
+            "add": "Add channel",
+            "pushNote": "Push only reaches customers who have the app installed with notifications allowed. Otherwise the next channel is tried.",
+            "alongside": "{channel} is always sent, plus {route}",
+            "everyone": "All customers: {route}",
+            "member": "Signed-in customers: {route}",
+            "guest": "Guests: {route}",
+            "messageRequired": "Write a message before turning this on.",
+            "channel": {
+                "SMS": "SMS",
+                "APP_INBOX": "App Inbox",
+                "PUSH_NOTIFICATION": "Push notification",
+                "WHATSAPP": "WhatsApp",
+                "EMAIL": "Email"
+            }
+        },
         "sstInclusive": "{taxName} Inclusive",
         "start": "Start",
         "staticQRcode": "Static QR code",

package/src/locales/ja-JP.json

@@ -326,7 +326,7 @@
     "duration": "時間",
     "disableRemoteQueue": "リモート順番待ちを無効にする",
     "allowOverrideQueueCode": "整理番号の上書きを許可",
-    "disableSMS": "SMSを無効にする",
+    "disableSMS": "通知を無効にする",
     "printChecklist": "チェックリストを印刷",
     "printChecklistSublabel": "オンライン注文のみ",
     "onlinePaxDialog": "人数ダイアログ（オンライン注文）",
@@ -374,6 +374,25 @@
     "settings": "設定",
     "showNotAvailable": "利用不可を表示",
     "sms": "SMS",
+    "notifications": "通知",
+    "notifyChannel": {
+      "title": "送信チャネル",
+      "hint": "上から順に試します。前のチャネルでお客様に届かない場合のみ、次のチャネルを使います。",
+      "add": "チャネルを追加",
+      "pushNote": "プッシュ通知は、アプリをインストールし通知を許可しているお客様にのみ届きます。届かない場合は次のチャネルを試します。",
+      "alongside": "{channel}は常に送信、加えて {route}",
+      "everyone": "すべてのお客様：{route}",
+      "member": "ログイン済みのお客様：{route}",
+      "guest": "ゲスト：{route}",
+      "messageRequired": "有効にする前にメッセージを入力してください。",
+      "channel": {
+        "SMS": "SMS",
+        "APP_INBOX": "アプリ受信箱",
+        "PUSH_NOTIFICATION": "プッシュ通知",
+        "WHATSAPP": "WhatsApp",
+        "EMAIL": "メール"
+      }
+    },
     "sstInclusive": "{taxName}込み",
     "vatExclude": "VAT除外",
     "start": "開始",

package/src/locales/th-TH.json

@@ -429,7 +429,7 @@
     "duration": "ระยะเวลา",
     "disableRemoteQueue": "ปิดการรับคิวออนไลน์",
     "allowOverrideQueueCode": "อนุญาตให้แก้ไขรหัสคิว",
-    "disableSMS": "ปิดใช้งาน SMS",
+    "disableSMS": "ปิดใช้งานการแจ้งเตือน",
     "codeSettings": "ตั้งค่ารหัสคิว",
     "addCodeSetting": "เพิ่มการตั้งค่ารหัสคิว",
     "current": "ปัจจุบัน",
@@ -470,6 +470,25 @@
     "settings": "การตั้งค่า",
     "showNotAvailable": "ไม่แสดงข้อมูล",
     "sms": "SMS",
+    "notifications": "การแจ้งเตือน",
+    "notifyChannel": {
+      "title": "ช่องทาง",
+      "hint": "ลองตามลำดับ ช่องทางถัดไปจะใช้เมื่อช่องทางก่อนหน้าส่งถึงลูกค้าไม่ได้เท่านั้น",
+      "add": "เพิ่มช่องทาง",
+      "pushNote": "การแจ้งเตือนแบบพุชจะส่งถึงเฉพาะลูกค้าที่ติดตั้งแอปและอนุญาตการแจ้งเตือน มิฉะนั้นจะลองช่องทางถัดไป",
+      "alongside": "ส่ง{channel}เสมอ และ {route}",
+      "everyone": "ลูกค้าทุกคน: {route}",
+      "member": "ลูกค้าที่เข้าสู่ระบบ: {route}",
+      "guest": "ผู้ใช้ทั่วไป: {route}",
+      "messageRequired": "กรุณาเขียนข้อความก่อนเปิดใช้งาน",
+      "channel": {
+        "SMS": "SMS",
+        "APP_INBOX": "กล่องข้อความในแอป",
+        "PUSH_NOTIFICATION": "การแจ้งเตือนแบบพุช",
+        "WHATSAPP": "WhatsApp",
+        "EMAIL": "อีเมล"
+      }
+    },
     "sstInclusive": "{taxName} รวม",
     "vatExclude": "ราคาไม่รวมภาษีมูลค่าเพิ่ม",
     "start": "เริ่มต้น",

package/src/locales/zh-CN.json

@@ -431,7 +431,7 @@
     "duration": "持续时间",
     "disableRemoteQueue": "禁用远程排队",
     "allowOverrideQueueCode": "允许覆盖排队号码",
-    "disableSMS": "禁用短信",
+    "disableSMS": "禁用通知",
     "codeSettings": "代码设置",
     "addCodeSetting": "添加代码设置",
     "current": "当前",
@@ -474,6 +474,25 @@
     "settings": "设置",
     "showNotAvailable": "显示无可用",
     "sms": "短信",
+    "notifications": "通知",
+    "notifyChannel": {
+      "title": "发送渠道",
+      "hint": "按顺序尝试。只有前一个渠道无法送达顾客时，才会使用下一个。",
+      "add": "添加渠道",
+      "pushNote": "推送通知只能送达已安装应用并允许通知的顾客，否则会尝试下一个渠道。",
+      "alongside": "始终发送{channel}，另外：{route}",
+      "everyone": "所有顾客：{route}",
+      "member": "已登录顾客：{route}",
+      "guest": "访客：{route}",
+      "messageRequired": "请先填写消息内容再开启。",
+      "channel": {
+        "SMS": "短信",
+        "APP_INBOX": "应用收件箱",
+        "PUSH_NOTIFICATION": "推送通知",
+        "WHATSAPP": "WhatsApp",
+        "EMAIL": "电子邮件"
+      }
+    },
     "sstInclusive": "包含{taxName}",
     "vatExclude": "不含增值税",
     "start": "开始",

package/src/views/order-settings/OrderSettingsView.vue

@@ -61,7 +61,7 @@ const settingItem = computed<FmTabProps[]>(() => {
     { label: t('order.driveThru'), value: 'driveThru' },
     // { label: t('order.serviceCharge'), value: 'servicecharge' },
     // { label: t('order.discountRule.title'), value: 'discountRule' },
-    { label: t('order.sms'), value: 'sms' },
+    { label: t('order.notifications'), value: 'sms' },
     { label: t('order.general'), value: 'general' },
     { label: t('order.queue'), value: 'queue' }
   ]

package/src/views/order-settings/components/NotifyChannelEditor.vue

@@ -0,0 +1,130 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { F_ORDER_NOTIFY_CHANNEL, planSends, resolveChannels } from '@entity'
+import { useCoreStore, useI18n } from '@feedmepos/mf-common'
+
+import { canChooseNotifyChannels } from './notify-channel-country'
+
+const props = defineProps<{
+  modelValue?: F_ORDER_NOTIFY_CHANNEL[] | null
+  readonly?: boolean
+}>()
+const emit = defineEmits<{ 'update:modelValue': [value: F_ORDER_NOTIFY_CHANNEL[]] }>()
+
+const { t } = useI18n()
+
+// MY only: outside it a chosen channel cannot be delivered. See notify-channel-country.ts.
+// Gated here rather than at each use so the SMS row, its read-only summary and the
+// queue setting all follow one rule.
+const { currentCountry } = useCoreStore()
+const available = computed(() => canChooseNotifyChannels(currentCountry.value))
+
+const { SMS, APP_INBOX, PUSH_NOTIFICATION } = F_ORDER_NOTIFY_CHANNEL.Enum
+// EMAIL is dropped by routing and WHATSAPP is not offered yet. A stored value
+// set outside the portal is still listed so it can be seen and removed.
+const SELECTABLE: F_ORDER_NOTIFY_CHANNEL[] = [SMS, APP_INBOX, PUSH_NOTIFICATION]
+
+const channels = computed(() => props.modelValue ?? [])
+
+const addable = computed(() =>
+  SELECTABLE.filter((c) => !channels.value.includes(c)).map((c) => ({
+    label: channelLabel(c),
+    value: c
+  }))
+)
+
+function channelLabel(channel: F_ORDER_NOTIFY_CHANNEL) {
+  return t(`order.notifyChannel.channel.${channel}`)
+}
+
+function add(channel: F_ORDER_NOTIFY_CHANNEL) {
+  emit('update:modelValue', [...channels.value, channel])
+}
+
+function remove(index: number) {
+  emit(
+    'update:modelValue',
+    channels.value.filter((_, i) => i !== index)
+  )
+}
+
+function move(index: number, by: -1 | 1) {
+  const next = [...channels.value]
+  ;[next[index], next[index + by]] = [next[index + by], next[index]]
+  emit('update:modelValue', next)
+}
+
+function describe(hasAccount: boolean) {
+  const { alongside, chain } = planSends(
+    resolveChannels({ configured: channels.value, hasAppInboxUid: hasAccount })
+  )
+  const route = chain.map(channelLabel).join(' → ')
+  return alongside.length
+    ? t('order.notifyChannel.alongside', { channel: channelLabel(alongside[0]), route })
+    : route
+}
+
+const summary = computed(() => {
+  const member = describe(true)
+  const guest = describe(false)
+  if (member === guest) return [t('order.notifyChannel.everyone', { route: member })]
+  return [
+    t('order.notifyChannel.member', { route: member }),
+    t('order.notifyChannel.guest', { route: guest })
+  ]
+})
+</script>
+
+<template>
+  <div v-if="available" class="flex flex-col gap-2">
+    <span class="fm-typo-en-body-md-600">{{ t('order.notifyChannel.title') }}</span>
+
+    <template v-if="!readonly">
+      <span class="fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400">
+        {{ t('order.notifyChannel.hint') }}
+      </span>
+      <div
+        v-for="(channel, i) in channels"
+        :key="channel"
+        class="flex items-center gap-2 border border-fm-color-neutral-gray-200 rounded px-3 py-1"
+      >
+        <span class="flex-grow">{{ i + 1 }}. {{ channelLabel(channel) }}</span>
+        <FmButton
+          icon="arrow_upward"
+          variant="tertiary"
+          :disabled="i === 0"
+          @click="move(i, -1)"
+        />
+        <FmButton
+          icon="arrow_downward"
+          variant="tertiary"
+          :disabled="i === channels.length - 1"
+          @click="move(i, 1)"
+        />
+        <FmButton icon="close" variant="tertiary" @click="remove(i)" />
+      </div>
+      <FmSelect
+        v-if="addable.length"
+        class="w-1/2"
+        :model-value="null"
+        :items="addable"
+        :placeholder="t('order.notifyChannel.add')"
+        @update:model-value="add"
+      />
+      <span
+        v-if="channels.includes(PUSH_NOTIFICATION)"
+        class="fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400"
+      >
+        {{ t('order.notifyChannel.pushNote') }}
+      </span>
+    </template>
+
+    <span
+      v-for="line in summary"
+      :key="line"
+      class="fm-typo-en-body-sm-400 text-fm-color-neutral-gray-400"
+    >
+      {{ line }}
+    </span>
+  </div>
+</template>

package/src/views/order-settings/components/notify-channel-country.spec.ts

@@ -0,0 +1,20 @@
+import { describe, expect, it } from 'vitest'
+
+import { canChooseNotifyChannels } from './notify-channel-country'
+
+describe('canChooseNotifyChannels', () => {
+  it('allows MY, whatever the case or spacing', () => {
+    expect(canChooseNotifyChannels('MY')).toBe(true)
+    expect(canChooseNotifyChannels(' my ')).toBe(true)
+  })
+
+  it.each(['TH', 'SG', 'ID', 'VN', 'AE'])('hides the editor in %s', (country) => {
+    expect(canChooseNotifyChannels(country)).toBe(false)
+  })
+
+  it('hides the editor while the country is unknown', () => {
+    expect(canChooseNotifyChannels(undefined)).toBe(false)
+    expect(canChooseNotifyChannels(null)).toBe(false)
+    expect(canChooseNotifyChannels('')).toBe(false)
+  })
+})

package/src/views/order-settings/components/notify-channel-country.ts

@@ -0,0 +1,21 @@
+/**
+ * Where a merchant may choose order notification channels (KDI-5013).
+ *
+ * Only MY, for now. Every channel except plain SMS goes to sms-backend's
+ * /multi-channel/send, which order-backend reaches over the internal ingress —
+ * and that URL (SMS_BACKEND_INTERNAL_URL) is configured for MY only. App Inbox
+ * itself is MY-only on sms-backend too. Anywhere else a chosen channel would be
+ * sent to the public host, which refuses it, and the customer would be told
+ * nothing. So the editor is hidden outside MY and those merchants keep plain SMS.
+ *
+ * An unknown country (still loading, or missing) counts as "not MY": the editor
+ * appearing a moment late is harmless, offering it in the wrong market is not.
+ *
+ * To open another country, set SMS_BACKEND_INTERNAL_URL for its order-backend in
+ * gitops-apps first, then add the code here.
+ */
+const CHANNEL_COUNTRIES = new Set(['MY'])
+
+export function canChooseNotifyChannels(country: string | null | undefined): boolean {
+  return CHANNEL_COUNTRIES.has((country ?? '').trim().toUpperCase())
+}

package/src/views/order-settings/queue/QueueSetting.vue

@@ -10,6 +10,7 @@ import {
   OrderSettingUpdateDto
 } from '@entity'
 import RestaurantSelector from '../components/RestaurantSelector.vue'
+import NotifyChannelEditor from '../components/NotifyChannelEditor.vue'
 import { useCoreStore, useI18n } from '@feedmepos/mf-common'
 import { useSnackbarFunctions } from '@/components/snackbar'
 import { useDialog } from '@feedmepos/ui-library'
@@ -424,6 +425,12 @@ async function saveAllowOverrideQueueCode(value: boolean) {
           label-placement="right"
         />
 
+        <NotifyChannelEditor
+          v-if="!queueSettings.disableSMS"
+          :model-value="queueSettings.channels"
+          @update:model-value="(v) => updateQueueSetting('channels', v)"
+        />
+
         <FmSwitch
           :model-value="queueSettings.printChecklist ?? false"
           @update:model-value="(v: boolean) => updateQueueSetting('printChecklist', v)"

package/src/views/order-settings/sms/SmsSetting.vue

@@ -7,10 +7,12 @@ import {
   F_ORDER_TYPE,
   F_SMS_ACTION,
   F_SMS_KEY,
+  type F_ORDER_NOTIFY_CHANNEL,
   type OrderSettingsDto,
   type OrderSmsSettingDto
 } from '@entity'
 import RestaurantSelector from '../components/RestaurantSelector.vue'
+import NotifyChannelEditor from '../components/NotifyChannelEditor.vue'
 
 import { useCoreStore } from '@feedmepos/mf-common'
 import { Dinero } from '@feedmepos/core'
@@ -74,7 +76,9 @@ async function updateOrderSetting() {
     if (orderSettingDefault.value) {
       await OrderSettingApi.updateOrderSetting({
         ...orderSettingDefault.value,
-        smsSettings: orderSmsSettings.value.filter((e: OrderSmsSettingDto) => e.enable)
+        smsSettings: orderSmsSettings.value.filter(
+          (e: OrderSmsSettingDto) => e.enable || !!e.message.raw || !!e.channels?.length
+        )
       })
     }
     processEditing(undefined)
@@ -83,7 +87,17 @@ async function updateOrderSetting() {
   showSuccess('SMS setting updated. ')
 }
 
+// Only pickup has a code-owned body for a blank template (`SMS.processSms`).
+// Anything else would send an empty message.
+function needsMessage(sms: OrderSmsSettingDto) {
+  return sms.type !== F_ORDER_TYPE.Enum.PICKUP && !sms.message.raw?.trim()
+}
+
 async function toggleEnable(enable: boolean, sms: OrderSmsSettingDto) {
+  if (enable && needsMessage(sms)) {
+    showError(t('order.notifyChannel.messageRequired'))
+    return
+  }
   const smsSetting = orderSmsSettings.value.map((_sms: OrderSmsSettingDto) => {
     if (_sms.action === sms.action && _sms.type === sms.type) {
       _sms.enable = enable
@@ -115,6 +129,11 @@ function processEditing(index?: number) {
 
 async function confirmTextField(index: number) {
   if (index !== undefined) {
+    const setting = orderSmsSettings.value[index]
+    if (setting.enable && needsMessage(setting)) {
+      showError(t('order.notifyChannel.messageRequired'))
+      return
+    }
     await updateOrderSetting()
   }
 }
@@ -126,6 +145,13 @@ function updateRawMessage(rawMessage: string, index: number) {
   orderSmsSettings.value = settings
 }
 
+function updateChannels(channels: F_ORDER_NOTIFY_CHANNEL[], index: number) {
+  const settings = [...orderSmsSettings.value]
+  settings[index].channels = channels
+
+  orderSmsSettings.value = settings
+}
+
 function updateMessageKey(messageKey: string, option: string, index: number) {
   const settings = [...orderSmsSettings.value]
   settings[index].message.keys[messageKey] = F_SMS_KEY.parse(option)
@@ -150,6 +176,12 @@ function initOrderSmsSettings() {
       type: F_ORDER_TYPE.Enum.PICKUP,
       action: F_SMS_ACTION.Enum.SERVE,
       message: { raw: '', keys: {} }
+    },
+    {
+      enable: false,
+      type: F_ORDER_TYPE.Enum.DELIVERY,
+      action: F_SMS_ACTION.Enum.ACCEPT,
+      message: { raw: '', keys: {} }
     }
   ]
 }
@@ -158,6 +190,8 @@ function convertTypeI18n(type: F_ORDER_TYPE | F_ORDER_DINE_IN_TYPE) {
   switch (type) {
     case F_ORDER_TYPE.enum.PICKUP:
       return t('order.pickup')
+    case F_ORDER_TYPE.enum.DELIVERY:
+      return t('order.delivery')
     default:
       return ''
   }
@@ -225,7 +259,13 @@ function convertActionI18n(action: F_SMS_ACTION) {
                 />
               </div>
             </div>
+            <NotifyChannelEditor
+              class="mb-5"
+              :model-value="orderSmsSettings[i].channels"
+              @update:model-value="(channels) => updateChannels(channels, i)"
+            />
           </div>
+          <NotifyChannelEditor v-else class="mb-5" readonly :model-value="sms.channels" />
           <FmButton
             variant="secondary"
             text-color="primary"

package/src/views/order-settings/sms/notify-channels-dto.spec.ts

@@ -0,0 +1,42 @@
+import { OrderSettingUpdateDto } from '@entity'
+import { describe, expect, it } from 'vitest'
+
+// The server re-attaches a stored `channels` when a save omits it, so a DTO that
+// strips the field does not fail loudly: the merchant's change is just reverted.
+describe('OrderSettingUpdateDto keeps notification channels', () => {
+  it('on queueSettings', () => {
+    const parsed: any = OrderSettingUpdateDto.parse({
+      queueSettings: {
+        enableOrder: true,
+        autoCalledLimit: 0,
+        channels: ['PUSH_NOTIFICATION', 'APP_INBOX', 'SMS']
+      }
+    })
+
+    expect(parsed.queueSettings.channels).toEqual(['PUSH_NOTIFICATION', 'APP_INBOX', 'SMS'])
+  })
+
+  it('on smsSettings rows, including the delivery row', () => {
+    const parsed: any = OrderSettingUpdateDto.parse({
+      smsSettings: [
+        {
+          enable: true,
+          action: 'ACCEPT',
+          type: 'DELIVERY',
+          message: { raw: 'Accepted', keys: {} },
+          channels: ['APP_INBOX', 'SMS']
+        }
+      ]
+    })
+
+    expect(parsed.smsSettings[0].channels).toEqual(['APP_INBOX', 'SMS'])
+  })
+
+  it('keeps an explicit empty list, which is how a merchant goes back to SMS only', () => {
+    const parsed: any = OrderSettingUpdateDto.parse({
+      queueSettings: { enableOrder: true, autoCalledLimit: 0, channels: [] }
+    })
+
+    expect(parsed.queueSettings.channels).toEqual([])
+  })
+})