@ossy/booking 3.10.0 → 3.11.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ossy/booking",
   "description": "Booking feature package — services, availability, and appointment management for Ossy providers",
-  "version": "3.10.0",
+  "version": "3.11.1",
   "type": "module",
   "main": "./src/index.js",
   "module": "./src/index.js",
@@ -15,13 +15,13 @@
   },
   "dependencies": {
     "@ossy/config": "^3.0.9",
-    "@ossy/email": "^3.0.9",
-    "@ossy/event-store": "^3.8.0",
+    "@ossy/email": "^3.11.0",
+    "@ossy/event-store": "^3.11.1",
     "@ossy/observability": "^3.0.9",
-    "@ossy/platform": "^3.9.0",
-    "@ossy/resources": "^3.10.0",
-    "@ossy/users": "^3.8.0",
-    "@ossy/workspaces": "^3.9.0"
+    "@ossy/platform": "^3.11.1",
+    "@ossy/resources": "^3.11.1",
+    "@ossy/users": "^3.11.1",
+    "@ossy/workspaces": "^3.11.1"
   },
   "peerDependencies": {
     "@ossy/app": ">=1.0.0",
@@ -38,5 +38,5 @@
     "/src",
     "README.md"
   ],
-  "gitHead": "198084eb98871876396ae625d043dd0f03aa0325"
+  "gitHead": "f279de3535b6bc76631cbc6b943dae8f92a1565f"
 }

package/src/BookingSalesPage.jsx

@@ -1,54 +1,55 @@
-import React, { useState, useCallback } from 'react'
+import React, { useState, useCallback, useMemo } from 'react'
 import { GetWorkspace, EnableService } from '@ossy/workspaces'
-import { useSdk, cacheKey } from '@ossy/sdk-react'
-import { Text, View, Button, Page, useLocale } from '@ossy/design-system'
+import { useSdk } from '@ossy/sdk-react'
+import { Text, View, useLocale } from '@ossy/design-system'
 import SalesSection from './SalesSection.jsx'
 import { useBookingHomeContent } from './booking-home-content.js'
 
 export default function BookingSalesPage ({ isAuthenticated }) {
   const { t } = useLocale()
-  const { invoke, invalidate } = useSdk()
+  const { invoke, read } = useSdk()
+  // Shared GetWorkspace cache with useShellWorkspace — refetch (not bare invalidate)
+  // awaits the post-enable read so home can switch sales → product reliably.
+  const { refetch: refetchWorkspace } = read(GetWorkspace, undefined, {
+    enabled: !!isAuthenticated,
+  })
   const [error, setError] = useState(null)
   const { cover: baseCover, features } = useBookingHomeContent()
 
   const handleEnable = useCallback(() => {
     setError(null)
     invoke(EnableService, { service: '@ossy/booking' })
-      .then(() => invalidate(cacheKey(GetWorkspace)))
+      .then(() => refetchWorkspace())
       .catch(() => setError(t('booking.sales.enableError')))
-  }, [invoke, invalidate, t])
+  }, [invoke, refetchWorkspace, t])
 
-  const enableAction = {
-    ...EnableService,
-    'data-service': '@ossy/booking',
-    variant: 'cta',
-    label: 'booking.sales.enable',
-    onClick: handleEnable,
-  }
-
-  const cover = isAuthenticated
-    ? {
-        ...baseCover,
-        // Keep the secondary example link only. The enable CTA lives in the
-        // section below — putting it in the hero left a duplicate that Playwright
-        // clicked first while the following Page intercepted pointer events.
-        actions: baseCover.actions.slice(1),
-      }
-    : baseCover
+  const cover = useMemo(() => {
+    if (!isAuthenticated) return baseCover
+    return {
+      ...baseCover,
+      // Hero CTA (not a sibling below the height:100% sales scroller) so pointer
+      // events reach the React onClick — required for Enable booking e2e.
+      actions: [
+        {
+          ...EnableService,
+          'data-service': '@ossy/booking',
+          variant: 'cta',
+          // HeroCover passes label as Button children (already translated).
+          label: t('booking.sales.enable'),
+          onClick: handleEnable,
+        },
+        { label: t('booking.home.cover.ctaSecondary'), variant: 'secondary', href: '/boka/demo' },
+      ],
+    }
+  }, [baseCover, handleEnable, isAuthenticated, t])
 
   return (
     <View data-booking-status="off">
       <SalesSection cover={cover} features={features} />
-
-      {isAuthenticated && (
-        <Page maxWidth="xl" gap="l">
-          <View gap="m" inset="l">
-            <Text variant="heading-secondary" as="h2" text="booking.sales.enable" />
-            <Text style={{ maxWidth: '600px' }} text="booking.sales.enableDescription" />
-            <Button {...enableAction} variant="cta" />
-            {error && <Text variant="small">{error}</Text>}
-          </View>
-        </Page>
+      {error && (
+        <View inset="l">
+          <Text variant="small">{error}</Text>
+        </View>
       )}
     </View>
   )

package/src/ServiceCard.jsx

@@ -1,9 +1,13 @@
 import React from 'react'
 import { View, Text, Badge } from '@ossy/design-system'
 
-const formatPrice = (cents, currency) => {
+const formatPrice = (cents, currency = 'SEK') => {
   if (cents === 0) return 'Free'
-  return new Intl.NumberFormat('sv-SE', { style: 'currency', currency }).format(cents / 100)
+  try {
+    return new Intl.NumberFormat('sv-SE', { style: 'currency', currency }).format(cents / 100)
+  } catch {
+    return `${(cents / 100).toFixed(2)} ${currency}`
+  }
 }
 
 const formatDuration = (minutes) => {

package/src/booking-cancellation.email.jsx

@@ -45,3 +45,7 @@ export default function BookingCancellationEmail({ clientName, startAt, duration
     </EmailLayout>
   )
 }
+
+BookingCancellationEmail.id = id
+BookingCancellationEmail.subject = subject
+

package/src/booking-card.component.jsx

@@ -69,7 +69,7 @@ export function BookingCard ({ booking, resource, onConfirm, onDecline, onCancel
   const isConfirmed = data.status === 'confirmed'
 
   return (
-    <View surface="secondary" roundness="m" inset="m" gap="s">
+    <View surface="secondary" roundness="m" inset="m" gap="s" data-booking-status={data.status}>
       <View layout="row" justifyContent="space-between" alignItems="flex-start" gap="m">
         <View gap="xs" style={{ flex: 1, minWidth: 0 }}>
           <View layout="row" gap="s" alignItems="center" style={{ flexWrap: 'wrap' }}>

package/src/booking-confirmation.email.jsx

@@ -107,3 +107,7 @@ export default function BookingConfirmationEmail({
     </EmailLayout>
   )
 }
+
+BookingConfirmationEmail.id = id
+BookingConfirmationEmail.subject = subject
+

package/src/booking-reminder.email.jsx

@@ -68,3 +68,7 @@ export default function BookingReminderEmail({ clientName, providerName, consult
     </EmailLayout>
   )
 }
+
+BookingReminderEmail.id = id
+BookingReminderEmail.subject = subject
+

package/src/booking-request.email.jsx

@@ -97,3 +97,7 @@ export default function BookingRequestEmail({
     </EmailLayout>
   )
 }
+
+BookingRequestEmail.id = id
+BookingRequestEmail.subject = subject
+

package/src/bookings.page.jsx

@@ -22,17 +22,21 @@ export default function BookingsPage () {
   const { t } = useLocale()
   const sdk = useSdk()
   const router = useRouter()
-  const [activeTab, setActiveTab] = useState('pending')
+  const initialTab = ['pending', 'confirmed', 'all'].includes(router.searchParams?.tab)
+    ? router.searchParams.tab
+    : 'pending'
+  const [activeTab, setActiveTab] = useState(initialTab)
   const [bookings, setBookings] = useState([])
   const [loading, setLoading] = useState(true)
   const [error, setError] = useState(null)
 
   const TABS = useMemo(() => [
-    { id: 'pending', label: t('booking.bookings.tab.pending') },
-    { id: 'confirmed', label: t('booking.bookings.tab.confirmed') },
-    { id: 'all', label: t('booking.bookings.tab.all') },
+    { id: 'pending', label: t('booking.bookings.tab.pending'), 'data-bookings-tab': 'pending' },
+    { id: 'confirmed', label: t('booking.bookings.tab.confirmed'), 'data-bookings-tab': 'confirmed' },
+    { id: 'all', label: t('booking.bookings.tab.all'), 'data-bookings-tab': 'all' },
   ], [t])
 
+
   const EMPTY_MESSAGES = useMemo(() => ({
     pending: {
       heading: t('booking.bookings.empty.pending.heading'),

package/src/cancel-booking.flow.js

@@ -0,0 +1,30 @@
+import confirmBooking from './confirm-booking.flow.js'
+import { metadata as CancelBooking } from './cancel-booking.action.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/cancel-booking',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 150_000,
+}
+
+/**
+ * Provider cancels a confirmed booking from the bookings list.
+ *
+ * Composes after confirm-booking. Opens the confirmed tab via search param,
+ * cancels, then asserts cancelled status on the all tab.
+ */
+export default {
+  title: 'Cancel booking',
+  description:
+    'Client books; provider confirms via email; provider cancels from the confirmed bookings list',
+  steps: [
+    ...confirmBooking.steps,
+    { page: '@booking/bookings', search: { tab: 'confirmed' } },
+    { result: { action: CancelBooking, timeout: 20000 } },
+    { action: CancelBooking },
+    { result: { action: CancelBooking, hidden: true, timeout: 15000 } },
+    { page: '@booking/bookings', search: { tab: 'all' } },
+    { result: { selector: '[data-booking-status="cancelled"]', timeout: 15000 } },
+  ],
+}

package/src/cancel-booking.task.js

@@ -26,6 +26,8 @@ export async function run ({ payload, req, log, integrations }) {
     bookingId,
     ResourcesEvents.Patched({
       createdBy: req?.userId ?? 'system',
+      // Required for BookingListProjection.scopeFromEvent (live projection updates).
+      belongsTo: booking.belongsTo,
       content: { ...booking.content, status: 'cancelled' },
     }),
   )

package/src/client-booking.flow.js

@@ -0,0 +1,89 @@
+import providerOnboard from './provider-onboard.flow.js'
+import { metadata as OpenServices } from './open-services.action.js'
+import { metadata as OpenCreateService } from './open-create-service.action.js'
+import { metadata as CreateService } from './create-service.action.js'
+import { metadata as OpenDeleteService } from './open-delete-service.action.js'
+import { metadata as ServiceForm } from './service.form.js'
+import { metadata as SaveAvailability } from './save-availability.action.js'
+import { metadata as OpenAvailabilitySetup } from './open-availability-setup.action.js'
+import { metadata as CreateBooking } from './create-booking.action.js'
+import { metadata as PublicBookingForm } from './public-booking-form.form.js'
+import {
+  ToggleAvailabilityDay1,
+  ToggleAvailabilityDay2,
+  ToggleAvailabilityDay3,
+  ToggleAvailabilityDay4,
+  ToggleAvailabilityDay5,
+  SelectDuration60,
+} from './availability-action-maps.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/client-booking',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 90_000,
+}
+
+/**
+ * Client books via the public page after the provider has a catalog service
+ * and weekly availability. Composes provider onboard + catalog + availability.
+ *
+ * Next: confirm-booking (provider confirms via request email).
+ */
+export default {
+  title: 'Book as client',
+  description:
+    'Provider enables booking, adds a service and availability; a client picks a slot and submits a booking request',
+  steps: [
+    ...providerOnboard.steps,
+
+    // Catalog service
+    { action: OpenServices },
+    { result: { selector: '[data-services-status]', timeout: 15000 } },
+    { result: { action: OpenCreateService, timeout: 10000 } },
+    { action: OpenCreateService },
+    { result: { action: CreateService, timeout: 15000 } },
+    { form: ServiceForm },
+    { action: CreateService },
+    { result: { action: OpenDeleteService, timeout: 15000 } },
+
+    // Availability + capture public booking slug
+    { page: '@booking/home' },
+    { result: { action: OpenAvailabilitySetup, timeout: 10000 } },
+    { action: OpenAvailabilitySetup },
+    { result: { action: SaveAvailability, timeout: 10000 } },
+    { action: ToggleAvailabilityDay1 },
+    { action: ToggleAvailabilityDay2 },
+    { action: ToggleAvailabilityDay3 },
+    { action: ToggleAvailabilityDay4 },
+    { action: ToggleAvailabilityDay5 },
+    { action: SelectDuration60 },
+    { action: SaveAvailability },
+    { result: { selector: '[data-availability-status="saved"]', timeout: 10000 } },
+    {
+      capture: {
+        providerSlug: { selector: '[data-provider-slug]', attr: 'data-provider-slug' },
+        providerEmail: '$email',
+      },
+    },
+
+    // Public client booking journey
+    { page: '@public-booking', params: { providerSlug: '$providerSlug' } },
+    { result: { action: 'public-booking/continue', timeout: 15000 } },
+    { pickFirst: 'service' },
+    { action: 'public-booking/continue' },
+    {
+      result: {
+        selector: '[data-action="public-booking/pick-date"]:not([disabled])',
+        timeout: 20000,
+      },
+    },
+    { pickFirst: 'date' },
+    { pickFirst: 'slot' },
+    { action: 'public-booking/continue' },
+    { result: { action: CreateBooking, timeout: 10000 } },
+    { form: PublicBookingForm },
+    { action: CreateBooking },
+    { result: { selector: '[data-flow-stage="booking-pending"]', timeout: 20000 } },
+  ],
+}

package/src/confirm-booking-inbox.flow.js

@@ -0,0 +1,42 @@
+import clientBooking from './client-booking.flow.js'
+import { metadata as ConfirmBooking } from './confirm-booking.action.js'
+import { metadata as OpenBookings } from './open-bookings.action.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/confirm-booking-inbox',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 150_000,
+}
+
+/**
+ * Provider confirms a pending booking from the in-app bookings inbox
+ * (not the request email link).
+ *
+ * Composes after client-booking; session remains the provider.
+ */
+export default {
+  title: 'Confirm booking from inbox',
+  description:
+    'Client submits a booking request; provider opens bookings inbox and confirms the pending card',
+  steps: [
+    ...clientBooking.steps,
+    { page: '@booking/home' },
+    { result: { selector: '[data-booking-status="on"]', timeout: 15000 } },
+    { result: { action: OpenBookings, timeout: 10000 } },
+    { action: OpenBookings },
+    { result: { page: '@booking/bookings', timeout: 15000 } },
+    { result: { selector: '[data-booking-status="pending"]', timeout: 20000 } },
+    { result: { action: ConfirmBooking, timeout: 10000 } },
+    { action: ConfirmBooking },
+    {
+      result: {
+        selector: '[data-booking-status="pending"]',
+        hidden: true,
+        timeout: 15000,
+      },
+    },
+    { page: '@booking/bookings', search: { tab: 'confirmed' } },
+    { result: { selector: '[data-booking-status="confirmed"]', timeout: 15000 } },
+  ],
+}

package/src/confirm-booking.flow.js

@@ -0,0 +1,32 @@
+import clientBooking from './client-booking.flow.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/confirm-booking',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 120_000,
+}
+
+/**
+ * Provider confirms a pending booking via the request email link.
+ *
+ * Composes after client-booking. Captures `providerEmail` before the client
+ * form overwrites `$email` with the client address.
+ */
+export default {
+  title: 'Confirm booking',
+  description:
+    'Client submits a booking request; provider confirms via the booking-request email link',
+  steps: [
+    ...clientBooking.steps,
+    {
+      email: {
+        to: '$providerEmail',
+        id: '@ossy/booking/emails/request',
+        click: 'Bekräfta bokning',
+        timeout: 20000,
+      },
+    },
+    { result: { url: /\/api\/v0\/booking\/confirm/, timeout: 15000 } },
+  ],
+}

package/src/confirm-booking.task.js

@@ -1,5 +1,5 @@
 import { ResourcesEvents, mutateResource, viewResource } from '@ossy/resources/server'
-import BookingConfirmationEmail from './booking-confirmation.email.jsx'
+import BookingConfirmationEmail, { id as bookingConfirmationEmailId } from './booking-confirmation.email.jsx'
 import { resolveProviderName, workspaceIdFromContent } from './provider-fields.js'
 import { resolveWorkspaceContact } from './resolve-workspace-contact.js'
 
@@ -33,6 +33,8 @@ export async function run ({ payload, req, log, integrations }) {
     bookingId,
     ResourcesEvents.Patched({
       createdBy: req?.userId ?? 'system',
+      // Required for BookingListProjection.scopeFromEvent (live projection updates).
+      belongsTo: booking.belongsTo,
       content: { ...booking.content, status: 'confirmed' },
     }),
   )
@@ -55,6 +57,7 @@ export async function run ({ payload, req, log, integrations }) {
           to: booking.content.clientEmail,
           from: 'noreply@ossy.se',
           subject: 'Bokningsbekräftelse',
+          templateId: bookingConfirmationEmailId,
         },
       )
       log?.info(`[booking/tasks/confirm] Confirmation email sent to ${booking.content.clientEmail}`)

package/src/create-booking.task.js

@@ -7,7 +7,7 @@ import { toMs } from './time.js'
 import { getBookingResources } from './booking-resources.js'
 import { createBookingEmailToken } from './booking-email-token.js'
 import { bookings } from './locations.js'
-import BookingRequestEmail from './booking-request.email.jsx'
+import BookingRequestEmail, { id as bookingRequestEmailId } from './booking-request.email.jsx'
 import {
   resolveProviderEmail,
   resolveProviderName,
@@ -178,6 +178,7 @@ export async function run({ payload, req, log, integrations }) {
             to: providerEmail,
             from: 'noreply@ossy.se',
             subject: 'Ny bokningsförfrågan',
+            templateId: bookingRequestEmailId,
           },
         )
         log?.info(`[booking/tasks/create] Booking request email sent to provider ${providerEmail}`)

package/src/decline-booking-inbox.flow.js

@@ -0,0 +1,43 @@
+import clientBooking from './client-booking.flow.js'
+import { metadata as DeclineBooking } from './decline-booking.action.js'
+import { metadata as OpenBookings } from './open-bookings.action.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/decline-booking-inbox',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 150_000,
+}
+
+/**
+ * Provider declines a pending booking from the in-app bookings inbox
+ * (not the request email link).
+ *
+ * Composes after client-booking; session remains the provider.
+ * Decline sets status to cancelled (same as cancel-booking task).
+ */
+export default {
+  title: 'Decline booking from inbox',
+  description:
+    'Client submits a booking request; provider opens bookings inbox and declines the pending card',
+  steps: [
+    ...clientBooking.steps,
+    { page: '@booking/home' },
+    { result: { selector: '[data-booking-status="on"]', timeout: 15000 } },
+    { result: { action: OpenBookings, timeout: 10000 } },
+    { action: OpenBookings },
+    { result: { page: '@booking/bookings', timeout: 15000 } },
+    { result: { selector: '[data-booking-status="pending"]', timeout: 20000 } },
+    { result: { action: DeclineBooking, timeout: 10000 } },
+    { action: DeclineBooking },
+    {
+      result: {
+        selector: '[data-booking-status="pending"]',
+        hidden: true,
+        timeout: 15000,
+      },
+    },
+    { page: '@booking/bookings', search: { tab: 'all' } },
+    { result: { selector: '[data-booking-status="cancelled"]', timeout: 15000 } },
+  ],
+}

package/src/decline-booking.flow.js

@@ -0,0 +1,32 @@
+import clientBooking from './client-booking.flow.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/decline-booking',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 120_000,
+}
+
+/**
+ * Provider declines a pending booking via the request email link.
+ *
+ * Composes after client-booking. Captures `providerEmail` before the client
+ * form overwrites `$email` with the client address.
+ */
+export default {
+  title: 'Decline booking',
+  description:
+    'Client submits a booking request; provider declines via the booking-request email link',
+  steps: [
+    ...clientBooking.steps,
+    {
+      email: {
+        to: '$providerEmail',
+        id: '@ossy/booking/emails/request',
+        click: 'Avböj förfrågan',
+        timeout: 20000,
+      },
+    },
+    { result: { url: /\/api\/v0\/booking\/decline/, timeout: 15000 } },
+  ],
+}

package/src/decline-booking.task.js

@@ -31,6 +31,8 @@ export async function run ({ payload, req, log, integrations }) {
     bookingId,
     ResourcesEvents.Patched({
       createdBy: req?.userId ?? 'system',
+      // Required for BookingListProjection.scopeFromEvent (live projection updates).
+      belongsTo: booking.belongsTo,
       content: { ...booking.content, status: 'cancelled', declineReason: reason ?? '' },
     }),
   )

package/src/delete-service.flow.js

@@ -0,0 +1,40 @@
+import providerCatalogFlow from './provider-catalog.flow.js'
+import { metadata as OpenDeleteService } from './open-delete-service.action.js'
+import { metadata as DeleteService } from './delete-service.action.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/delete-service',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 120_000,
+}
+
+/**
+ * After creating a catalog service, open delete from the services list, confirm
+ * via Guide, and assert the catalog is empty again.
+ */
+export default {
+  title: 'Delete booking service',
+  description:
+    'Signed-in provider creates a catalog service, deletes it from the confirm dialog, and sees an empty services list',
+  steps: [
+    ...providerCatalogFlow.steps,
+    { result: { action: OpenDeleteService, timeout: 10000 } },
+    { action: OpenDeleteService },
+    { result: { action: DeleteService, timeout: 10000 } },
+    { action: DeleteService },
+    {
+      result: {
+        selector: '[data-services-status="empty"]',
+        timeout: 20000,
+      },
+    },
+    {
+      result: {
+        selector: '[data-service-id]',
+        hidden: true,
+        timeout: 10000,
+      },
+    },
+  ],
+}

package/src/disable-booking.flow.js

@@ -0,0 +1,58 @@
+import providerOnboardFlow from './provider-onboard.flow.js'
+import { DisableService, EnableService } from '@ossy/workspaces'
+
+const BOOKING = '@ossy/booking'
+
+export const metadata = {
+  id: '@ossy/booking/flows/disable-booking',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 120_000,
+}
+
+/**
+ * After enabling booking, disable the package from the catalog detail
+ * toggle and confirm the booking home returns to the sales (off) state.
+ */
+export default {
+  title: 'Disable booking',
+  description:
+    'Signed-in user enables booking, disables it from the package catalog, and sees the sales home again',
+  steps: [
+    ...providerOnboardFlow.steps,
+    { page: '@packages/detail', params: { packageSlug: 'booking' } },
+    {
+      result: {
+        action: { ...DisableService, service: BOOKING },
+        timeout: 15000,
+      },
+    },
+    {
+      result: {
+        selector: `[data-package-service="${BOOKING}"][data-service-enabled="true"]`,
+        timeout: 10000,
+      },
+    },
+    { action: { ...DisableService, service: BOOKING } },
+    {
+      result: {
+        action: { ...EnableService, service: BOOKING },
+        timeout: 20000,
+      },
+    },
+    {
+      result: {
+        selector: `[data-package-service="${BOOKING}"][data-service-enabled="false"]`,
+        timeout: 10000,
+      },
+    },
+    { page: '@booking/home' },
+    { result: { selector: '[data-booking-status="off"]', timeout: 20000 } },
+    {
+      result: {
+        action: { ...EnableService, service: BOOKING },
+        timeout: 10000,
+      },
+    },
+  ],
+}

package/src/en.translations.json

@@ -242,6 +242,10 @@
   "@ossy/booking/actions/update-service.description": "Update an existing bookable service",
   "@ossy/booking/actions/delete-service.label": "Delete service",
   "@ossy/booking/actions/delete-service.description": "Remove a bookable service",
+  "@ossy/booking/actions/open-delete-service.label": "Delete service",
+  "@ossy/booking/actions/open-delete-service.description": "Open delete confirmation for a bookable service",
+  "@ossy/booking/actions/open-edit-service.label": "Edit service",
+  "@ossy/booking/actions/open-edit-service.description": "Open the form to edit an existing bookable service",
   "@ossy/booking/actions/open-availability-setup.label": "Set up availability",
   "@ossy/booking/actions/open-availability-setup.description": "Open availability settings",
   "@ossy/booking/actions/open-services.label": "Manage services",
@@ -276,6 +280,8 @@
   "booking.services.errorSave": "Could not save service",
   "booking.services.errorDelete": "Could not delete service",
   "booking.services.deleteConfirm": "Delete this service?",
+  "booking.services.deleteTitle": "Delete this service?",
+  "booking.services.deleteText": "This removes the service from your catalog. Existing bookings are not changed.",
   "booking.services.editService": "Edit service",
   "booking.services.newService": "New service",
   "booking.services.save": "Save",

package/src/index.js

@@ -12,6 +12,8 @@ export { metadata as ServiceForm } from './service.form.js'
 export { metadata as PublicBookingForm } from './public-booking-form.form.js'
 export { metadata as UpdateService } from './update-service.action.js'
 export { metadata as DeleteService } from './delete-service.action.js'
+export { metadata as OpenDeleteService } from './open-delete-service.action.js'
+export { metadata as OpenEditService } from './open-edit-service.action.js'
 export { metadata as SaveAvailability } from './save-availability.action.js'
 export { metadata as ConfirmBooking } from './confirm-booking.action.js'
 export { metadata as DeclineBooking } from './decline-booking.action.js'

package/src/open-delete-service.action.js

@@ -0,0 +1,7 @@
+/** Client-only — opens the service delete confirmation dialog. */
+export const metadata = {
+  id: '@ossy/booking/actions/open-delete-service',
+  access: 'workspace',
+  label: 'booking.services.delete',
+  icon: 'trash-empty',
+}

package/src/open-edit-service.action.js

@@ -0,0 +1,7 @@
+/** Client-only — opens the service edit form for an existing catalog service. */
+export const metadata = {
+  id: '@ossy/booking/actions/open-edit-service',
+  access: 'workspace',
+  label: 'booking.services.edit',
+  icon: 'pen',
+}

package/src/provider-availability-weekend.flow.js

@@ -0,0 +1,34 @@
+import providerOnboard from './provider-onboard.flow.js'
+import { metadata as SaveAvailability } from './save-availability.action.js'
+import { metadata as OpenAvailabilitySetup } from './open-availability-setup.action.js'
+import {
+  ToggleAvailabilityDay0,
+  ToggleAvailabilityDay6,
+  SelectDuration90,
+} from './availability-action-maps.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/provider-availability-weekend',
+  feature: 'booking',
+  requires: ['server', 'database'],
+}
+
+/**
+ * Issue #5 — cover weekend day toggles and 90-minute duration (sibling of the
+ * Mon–Fri + 60m provider-availability flow).
+ */
+export default {
+  title: 'Set up weekend availability',
+  description:
+    'New service provider enables booking and saves Saturday/Sunday availability with 90-minute slots',
+  steps: [
+    ...providerOnboard.steps,
+    { action: OpenAvailabilitySetup },
+    { result: { action: SaveAvailability, timeout: 10000 } },
+    { action: ToggleAvailabilityDay0 },
+    { action: ToggleAvailabilityDay6 },
+    { action: SelectDuration90 },
+    { action: SaveAvailability },
+    { result: { selector: '[data-availability-status="saved"]', timeout: 10000 } },
+  ],
+}

package/src/provider-catalog.flow.js

@@ -0,0 +1,35 @@
+import providerOnboard from './provider-onboard.flow.js'
+import { metadata as OpenServices } from './open-services.action.js'
+import { metadata as OpenCreateService } from './open-create-service.action.js'
+import { metadata as CreateService } from './create-service.action.js'
+import { metadata as OpenDeleteService } from './open-delete-service.action.js'
+import { metadata as ServiceForm } from './service.form.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/provider-catalog',
+  feature: 'booking',
+  requires: ['server', 'database'],
+}
+
+/**
+ * Step 2 — provider enables booking and adds a catalog service.
+ *
+ * Composes after provider-onboard. client-booking / confirm-booking compose
+ * catalog + availability after onboard for the public booking journey.
+ */
+export default {
+  title: 'Create booking service',
+  description:
+    'New service provider registers, verifies email, enables booking, and creates a catalog service',
+  steps: [
+    ...providerOnboard.steps,
+    { action: OpenServices },
+    { result: { selector: '[data-services-status]', timeout: 15000 } },
+    { result: { action: OpenCreateService, timeout: 10000 } },
+    { action: OpenCreateService },
+    { result: { action: CreateService, timeout: 15000 } },
+    { form: ServiceForm },
+    { action: CreateService },
+    { result: { action: OpenDeleteService, timeout: 15000 } },
+  ],
+}

package/src/provider-onboard.flow.js

@@ -10,7 +10,7 @@ export const metadata = {
 /**
  * Step 1 — provider signs up and enables the booking capability for their workspace.
  *
- * Next flows (catalog setup, client booking, confirm) will compose after this.
+ * Next: provider-catalog (service setup), then client booking / confirm.
  */
 export default {
   title: 'Enable booking',
@@ -18,8 +18,8 @@ export default {
   steps: [
     ...signUpFlow.steps,
     { page: '@booking/home' },
-    { result: { action: { ...EnableService, service: '@ossy/booking' }, timeout: 10000 } },
+    { result: { action: { ...EnableService, service: '@ossy/booking' }, timeout: 15000 } },
     { action: { ...EnableService, service: '@ossy/booking' } },
-    { result: { selector: '[data-booking-status="on"]', timeout: 10000 } },
+    { result: { selector: '[data-booking-status="on"]', timeout: 20000 } },
   ],
 }

package/src/public-booking.page.jsx

@@ -151,7 +151,7 @@ function BookingForm ({ slot, service, providerSlug, providerContact, onSuccess,
 
 function PendingScreen ({ slot, t, language }) {
   return (
-    <View gap="m" alignItems="center" style={{ textAlign: 'center' }}>
+    <View gap="m" alignItems="center" style={{ textAlign: 'center' }} data-flow-stage="booking-pending">
       <Text variant="heading-secondary" as="h2" text="publicBooking.pending.title" />
       <Text color="secondary" text="publicBooking.pending.body" />
       <Alert variant="warning" title={t('publicBooking.pending.requestedTime')}>
@@ -175,7 +175,11 @@ function ServicePicker ({ services, selectedService, onSelect, t, language }) {
   }
   const formatPrice = (cents, currency) => {
     if (!cents) return t('publicBooking.serviceFree')
-    return new Intl.NumberFormat(language === 'sv' ? 'sv-SE' : 'en-GB', { style: 'currency', currency: currency || 'SEK' }).format(cents / 100)
+    try {
+      return new Intl.NumberFormat(language === 'sv' ? 'sv-SE' : 'en-GB', { style: 'currency', currency: currency || 'SEK' }).format(cents / 100)
+    } catch {
+      return `${(cents / 100).toFixed(2)} ${currency || 'SEK'}`
+    }
   }
   return (
     <View gap="s">

package/src/service-card-slot.component.jsx

@@ -3,9 +3,13 @@ import { View, Text, Badge } from '@ossy/design-system'
 
 export const metadata = { id: '@ossy/booking/view/service/card' }
 
-const formatPrice = (cents, currency) => {
+const formatPrice = (cents, currency = 'SEK') => {
   if (cents === 0) return 'Free'
-  return new Intl.NumberFormat('sv-SE', { style: 'currency', currency }).format(cents / 100)
+  try {
+    return new Intl.NumberFormat('sv-SE', { style: 'currency', currency }).format(cents / 100)
+  } catch {
+    return `${(cents / 100).toFixed(2)} ${currency}`
+  }
 }
 
 const formatDuration = (minutes) => {

package/src/service-detail.component.jsx

@@ -3,9 +3,13 @@ import { View, Text, Badge } from '@ossy/design-system'
 
 export const metadata = { id: '@ossy/booking/view/service' }
 
-const formatPrice = (cents, currency) => {
+const formatPrice = (cents, currency = 'SEK') => {
   if (cents === 0) return 'Free'
-  return new Intl.NumberFormat('sv-SE', { style: 'currency', currency }).format(cents / 100)
+  try {
+    return new Intl.NumberFormat('sv-SE', { style: 'currency', currency }).format(cents / 100)
+  } catch {
+    return `${(cents / 100).toFixed(2)} ${currency}`
+  }
 }
 
 const formatDuration = (minutes) => {

package/src/service.schema.js

@@ -5,9 +5,9 @@ export default {
   icon: 'calendar',
   fields: [
     { name: 'name', type: 'text', required: true },
-    { name: 'duration', type: 'number', required: true },
+    { name: 'duration', type: 'select', required: true, options: ['30', '60', '90'] },
     { name: 'price', type: 'number' },
-    { name: 'currency', type: 'text' },
+    { name: 'currency', type: 'select', options: ['SEK', 'EUR', 'USD', 'NOK', 'DKK'] },
     { name: 'description', type: 'textarea' },
     { name: 'active', type: 'boolean' },
   ],

package/src/services.page.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useCallback } from 'react'
-import { View, Text, Button, Alert, Form, FieldFactory, FormStatus, ContentHeader, Page, useLocale } from '@ossy/design-system'
+import { View, Text, Button, Alert, Form, FieldFactory, FormStatus, ContentHeader, Page, Overlay, Guide, useLocale } from '@ossy/design-system'
 import { useSdk } from '@ossy/sdk-react'
 import { useDocumentValidator } from '@ossy/resources'
 import { Definition } from './Definition.js'
@@ -7,6 +7,8 @@ import { ServiceCard } from './ServiceCard.jsx'
 import { metadata as CreateService } from './create-service.action.js'
 import { metadata as UpdateService } from './update-service.action.js'
 import { metadata as DeleteService } from './delete-service.action.js'
+import { metadata as OpenDeleteService } from './open-delete-service.action.js'
+import { metadata as OpenEditService } from './open-edit-service.action.js'
 import { metadata as GetServices } from './get-services.action.js'
 import { metadata as OpenCreateService } from './open-create-service.action.js'
 import { metadata as ServiceForm } from './service.form.js'
@@ -23,7 +25,7 @@ export const metadata = {
 
 const EMPTY_FORM = {
   name: '',
-  duration: 60,
+  duration: '60',
   price: 0,
   currency: 'SEK',
   description: '',
@@ -40,6 +42,8 @@ export default function ServicesPage () {
   const [editingId, setEditingId] = useState(null)
   const [formDefaults, setFormDefaults] = useState(EMPTY_FORM)
   const [saving, setSaving] = useState(false)
+  const [serviceToDelete, setServiceToDelete] = useState(null)
+  const [deleting, setDeleting] = useState(false)
   const validate = useDocumentValidator(serviceTemplate)
 
   const loadServices = useCallback(async () => {
@@ -69,7 +73,7 @@ export default function ServicesPage () {
     setEditingId(service.id)
     setFormDefaults({
       name: service.name ?? '',
-      duration: service.duration ?? 60,
+      duration: String(service.duration ?? 60),
       price: service.price ?? 0,
       currency: service.currency ?? 'SEK',
       description: service.description ?? '',
@@ -94,14 +98,18 @@ export default function ServicesPage () {
     }
   }
 
-  const handleDelete = async (serviceId) => {
-    if (!window.confirm(t('booking.services.deleteConfirm'))) return
+  const confirmDelete = async () => {
+    if (!serviceToDelete?.id) return
+    setDeleting(true)
     setError(null)
     try {
-      await sdk.invoke(DeleteService, { serviceId })
+      await sdk.invoke(DeleteService, { serviceId: serviceToDelete.id })
+      setServiceToDelete(null)
       await loadServices()
     } catch (err) {
       setError(await invokeErrorMessage(err, t('booking.services.errorDelete')))
+    } finally {
+      setDeleting(false)
     }
   }
 
@@ -157,7 +165,10 @@ export default function ServicesPage () {
         </Form>
       )}
 
-      <View gap="s">
+      <View
+        gap="s"
+        data-services-status={loading ? 'loading' : services.length === 0 ? 'empty' : 'populated'}
+      >
         <Text variant="heading-secondary" as="h2" text="booking.services.yourServices" />
         {loading ? (
           <Text color="secondary" text="booking.services.loading" />
@@ -166,7 +177,12 @@ export default function ServicesPage () {
         ) : (
           <View gap="s">
             {services.map(service => (
-              <View key={service.id} gap="xs">
+              <View
+                key={service.id}
+                gap="xs"
+                data-service-id={service.id}
+                data-service-name={service.name}
+              >
                 <ServiceCard
                   name={service.name}
                   duration={service.duration}
@@ -176,14 +192,54 @@ export default function ServicesPage () {
                   active={service.active !== false}
                 />
                 <View layout="row" gap="s">
-                  <Button variant="link" size="s" label="booking.services.edit" onClick={() => openEdit(service)} />
-                  <Button {...DeleteService} variant="link" size="s" label="booking.services.delete" onClick={() => handleDelete(service.id)} />
+                  <Button
+                    {...OpenEditService}
+                    variant="link"
+                    size="s"
+                    label="booking.services.edit"
+                    onClick={() => openEdit(service)}
+                  />
+                  <Button
+                    {...OpenDeleteService}
+                    variant="link"
+                    size="s"
+                    label="booking.services.delete"
+                    onClick={() => setServiceToDelete(service)}
+                  />
                 </View>
               </View>
             ))}
           </View>
         )}
       </View>
+
+      <Overlay isVisible={Boolean(serviceToDelete)} onClose={() => !deleting && setServiceToDelete(null)}>
+        <View layout="off-center-s" style={{ height: '100%' }}>
+          <View data-region="content">
+            <View surface="primary" roundness="s" inset="l">
+              <Guide
+                title="booking.services.deleteTitle"
+                text="booking.services.deleteText"
+                actions={[
+                  {
+                    label: 'booking.services.cancel',
+                    variant: 'command',
+                    disabled: deleting,
+                    onClick: () => setServiceToDelete(null),
+                  },
+                  {
+                    ...DeleteService,
+                    label: 'booking.services.delete',
+                    variant: 'command-danger',
+                    disabled: deleting,
+                    onClick: confirmDelete,
+                  },
+                ]}
+              />
+            </View>
+          </View>
+        </View>
+      </Overlay>
     </Page>
   )
 }

package/src/sv.translations.json

@@ -242,6 +242,10 @@
   "@ossy/booking/actions/update-service.description": "Uppdatera en befintlig bokningsbar tjänst",
   "@ossy/booking/actions/delete-service.label": "Ta bort tjänst",
   "@ossy/booking/actions/delete-service.description": "Ta bort en bokningsbar tjänst",
+  "@ossy/booking/actions/open-delete-service.label": "Ta bort tjänst",
+  "@ossy/booking/actions/open-delete-service.description": "Öppna bekräftelse för att ta bort en bokningsbar tjänst",
+  "@ossy/booking/actions/open-edit-service.label": "Redigera tjänst",
+  "@ossy/booking/actions/open-edit-service.description": "Öppna formuläret för att redigera en befintlig bokningsbar tjänst",
   "@ossy/booking/actions/open-availability-setup.label": "Ställ in tillgänglighet",
   "@ossy/booking/actions/open-availability-setup.description": "Öppna tillgänglighetsinställningar",
   "@ossy/booking/actions/open-services.label": "Hantera tjänster",
@@ -276,6 +280,8 @@
   "booking.services.errorSave": "Kunde inte spara tjänst",
   "booking.services.errorDelete": "Kunde inte ta bort tjänst",
   "booking.services.deleteConfirm": "Ta bort denna tjänst?",
+  "booking.services.deleteTitle": "Ta bort denna tjänst?",
+  "booking.services.deleteText": "Detta tar bort tjänsten från din katalog. Befintliga bokningar påverkas inte.",
   "booking.services.editService": "Redigera tjänst",
   "booking.services.newService": "Ny tjänst",
   "booking.services.save": "Spara",

package/src/update-service.flow.js

@@ -0,0 +1,42 @@
+import providerCatalogFlow from './provider-catalog.flow.js'
+import { metadata as OpenEditService } from './open-edit-service.action.js'
+import { metadata as UpdateService } from './update-service.action.js'
+import { metadata as ServiceForm } from './service.form.js'
+
+export const metadata = {
+  id: '@ossy/booking/flows/update-service',
+  feature: 'booking',
+  requires: ['server', 'database'],
+  timeout: 120_000,
+}
+
+/**
+ * After creating a catalog service, open edit, change fields, save via
+ * UpdateService, and assert the list shows the updated name.
+ */
+export default {
+  title: 'Update booking service',
+  description:
+    'Signed-in provider creates a catalog service, edits it from the services list, and sees the updated name',
+  steps: [
+    ...providerCatalogFlow.steps,
+    { result: { action: OpenEditService, timeout: 10000 } },
+    { action: OpenEditService },
+    { result: { action: UpdateService, timeout: 10000 } },
+    { form: ServiceForm, fields: { name: 'e2e-updated-service' } },
+    { action: UpdateService },
+    {
+      result: {
+        selector: '[data-service-name="e2e-updated-service"]',
+        timeout: 20000,
+      },
+    },
+    {
+      result: {
+        selector: '[data-action="@ossy/booking/actions/update-service"]',
+        hidden: true,
+        timeout: 10000,
+      },
+    },
+  ],
+}