@ossy/booking 1.15.7 → 1.16.0

package/src/bookings.page.jsx

@@ -1,5 +1,5 @@
-import React, { useState, useEffect, useCallback } from 'react'
-import { View, Title, Text, Tabs, Alert } from '@ossy/design-system'
+import React, { useState, useEffect, useCallback, useMemo } from 'react'
+import { View, Title, Text, Tabs, Alert, useLocale } from '@ossy/design-system'
 import { Definition } from './Definition.js'
 import { BookingCard } from './booking-card.component.jsx'
 
@@ -11,24 +11,34 @@ export const metadata = {
   },
 }
 
-const TABS = [
-  { id: 'pending', label: 'Förfrågningar' },
-  { id: 'confirmed', label: 'Bekräftade' },
-  { id: 'all', label: 'Alla' },
-]
-
-const EMPTY_MESSAGES = {
-  pending: { heading: 'Inga förfrågningar', body: 'Du har inga väntande bokningsförfrågningar just nu.' },
-  confirmed: { heading: 'Inga bekräftade bokningar', body: 'Bekräftade bokningar visas här.' },
-  all: { heading: 'Inga bokningar', body: 'Bokningar från dina klienter visas här.' },
-}
-
 export default function BookingsPage () {
+  const { t } = useLocale()
   const [activeTab, setActiveTab] = useState('pending')
   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') },
+  ], [t])
+
+  const EMPTY_MESSAGES = useMemo(() => ({
+    pending: {
+      heading: t('booking.bookings.empty.pending.heading'),
+      body: t('booking.bookings.empty.pending.body'),
+    },
+    confirmed: {
+      heading: t('booking.bookings.empty.confirmed.heading'),
+      body: t('booking.bookings.empty.confirmed.body'),
+    },
+    all: {
+      heading: t('booking.bookings.empty.all.heading'),
+      body: t('booking.bookings.empty.all.body'),
+    },
+  }), [t])
+
   const loadBookings = useCallback(async () => {
     setLoading(true)
     setError(null)
@@ -40,7 +50,7 @@ export default function BookingsPage () {
       })
       if (!res.ok) {
         const data = await res.json().catch(() => ({}))
-        throw new Error(data?.message ?? `Fel ${res.status}`)
+        throw new Error(data?.message ?? t('booking.bookings.errorStatus', { status: res.status }))
       }
       const data = await res.json()
       setBookings(data)
@@ -49,7 +59,7 @@ export default function BookingsPage () {
     } finally {
       setLoading(false)
     }
-  }, [])
+  }, [t])
 
   useEffect(() => {
     loadBookings()
@@ -67,7 +77,7 @@ export default function BookingsPage () {
     })
     if (!res.ok) {
       const data = await res.json().catch(() => ({}))
-      throw new Error(data?.message ?? 'Bekräftning misslyckades')
+      throw new Error(data?.message ?? t('booking.bookings.errorConfirm'))
     }
     await loadBookings()
   }
@@ -80,7 +90,7 @@ export default function BookingsPage () {
     })
     if (!res.ok) {
       const data = await res.json().catch(() => ({}))
-      throw new Error(data?.message ?? 'Avböjning misslyckades')
+      throw new Error(data?.message ?? t('booking.bookings.errorDecline'))
     }
     await loadBookings()
   }
@@ -93,7 +103,7 @@ export default function BookingsPage () {
     })
     if (!res.ok) {
       const data = await res.json().catch(() => ({}))
-      throw new Error(data?.message ?? 'Avbokning misslyckades')
+      throw new Error(data?.message ?? t('booking.bookings.errorCancel'))
     }
     await loadBookings()
   }
@@ -111,9 +121,9 @@ export default function BookingsPage () {
       style={{ padding: 'var(--space-m) var(--space-l)', height: '100%', overflowY: 'auto' }}
     >
       <View inset="s" gap="s">
-        <Title>{Definition.title} — Bokningar</Title>
+        <Title>{Definition.title} — {t('booking.bookings.titleSuffix')}</Title>
         <Text style={{ maxWidth: '400px' }}>
-          Hantera bokningsförfrågningar och bekräftade möten.
+          {t('booking.bookings.description')}
         </Text>
       </View>
 
@@ -126,7 +136,7 @@ export default function BookingsPage () {
 
         {loading ? (
           <Text color="secondary" style={{ textAlign: 'center', padding: 'var(--space-l)' }}>
-            Laddar…
+            {t('booking.bookings.loading')}
           </Text>
         ) : error ? (
           <Alert variant="danger">{error}</Alert>

package/src/en.translations.json

@@ -0,0 +1,213 @@
+{
+  "booking.home.documentTitle": "Booking calendar – Ossy",
+  "booking.home.cover.title": "Let clients book time directly",
+  "booking.home.cover.text": "Share a link. Clients pick a slot. You focus on the work.",
+  "booking.home.cover.ctaPrimary": "Get started free",
+  "booking.home.cover.ctaSecondary": "See an example",
+  "booking.home.features.page.title": "Your booking page",
+  "booking.home.features.page.text": "A personal page at ossy.se/booking/your-name. Share the link with clients — that's all it takes.",
+  "booking.home.features.confirmations.title": "Automatic confirmations",
+  "booking.home.features.confirmations.text": "Clients get a confirmation with a calendar invite instantly. No manual steps on your side.",
+  "booking.home.features.availability.title": "Manage your time",
+  "booking.home.features.availability.text": "Set when you're available. We only show open slots — never double-booked.",
+  "booking.home.features.email.title": "Email ping-pong",
+  "booking.home.features.email.text": "Skip days of back-and-forth just to find a shared slot.",
+  "booking.home.features.doubleBook.title": "No double bookings",
+  "booking.home.features.doubleBook.text": "One calendar here, one link there — we keep track so the same slot isn't booked twice.",
+  "booking.sales.overview": "Overview",
+  "booking.sales.features": "Features",
+  "booking.bookings.documentTitle": "Bookings",
+  "booking.bookings.titleSuffix": "Bookings",
+  "booking.bookings.description": "Manage booking requests and confirmed meetings.",
+  "booking.bookings.tab.pending": "Requests",
+  "booking.bookings.tab.confirmed": "Confirmed",
+  "booking.bookings.tab.all": "All",
+  "booking.bookings.empty.pending.heading": "No requests",
+  "booking.bookings.empty.pending.body": "You have no pending booking requests right now.",
+  "booking.bookings.empty.confirmed.heading": "No confirmed bookings",
+  "booking.bookings.empty.confirmed.body": "Confirmed bookings appear here.",
+  "booking.bookings.empty.all.heading": "No bookings",
+  "booking.bookings.empty.all.body": "Bookings from your clients appear here.",
+  "booking.bookings.loading": "Loading…",
+  "booking.bookings.errorStatus": "Error {status}",
+  "booking.bookings.errorConfirm": "Confirmation failed",
+  "booking.bookings.errorDecline": "Decline failed",
+  "booking.bookings.errorCancel": "Cancellation failed",
+  "booking.bookingDetail.documentTitle": "Booking details",
+  "booking.bookingDetail.back": "← All bookings",
+  "booking.bookingDetail.loading": "Loading…",
+  "booking.bookingDetail.notFound": "Booking not found",
+  "booking.bookingDetail.errorStatus": "Error {status}",
+  "booking.bookingDetail.status.pending": "Awaiting confirmation",
+  "booking.bookingDetail.status.confirmed": "Confirmed",
+  "booking.bookingDetail.status.cancelled": "Cancelled",
+  "booking.bookingDetail.label.dateTime": "Date and time",
+  "booking.bookingDetail.label.duration": "Duration",
+  "booking.bookingDetail.label.message": "Message",
+  "booking.bookingDetail.durationMinutes": "{minutes} minutes",
+  "booking.bookingDetail.durationHours": "{hours} hour",
+  "booking.bookingDetail.durationHoursMinutes": "{hours} hour {minutes} min",
+  "booking.bookingDetail.manageRequest": "Manage request",
+  "booking.bookingDetail.manageBooking": "Manage booking",
+  "booking.bookingDetail.confirm": "Confirm booking",
+  "booking.bookingDetail.confirming": "Confirming…",
+  "booking.bookingDetail.errorConfirm": "Confirmation failed",
+  "booking.bookingDetail.decline": "Decline request",
+  "booking.bookingDetail.declineTitle": "Decline booking request",
+  "booking.bookingDetail.declinePlaceholder": "E.g. Unfortunately the requested time is no longer available…",
+  "booking.bookingDetail.declineReasonHint": "Reason (optional — sent to the client)",
+  "booking.bookingDetail.declineConfirm": "Confirm decline",
+  "booking.bookingDetail.declining": "Declining…",
+  "booking.bookingDetail.errorDecline": "Decline failed",
+  "booking.bookingDetail.cancelMeeting": "Cancel meeting",
+  "booking.bookingDetail.cancelTitle": "Cancel confirmed booking",
+  "booking.bookingDetail.cancelBody": "The client will be notified by email. This action cannot be undone.",
+  "booking.bookingDetail.cancelConfirm": "Confirm cancellation",
+  "booking.bookingDetail.cancelling": "Cancelling…",
+  "booking.bookingDetail.errorCancel": "Cancellation failed",
+  "booking.bookingDetail.cancelButton": "Cancel",
+  "booking.availability.documentTitle": "Availability",
+  "booking.availability.titleSuffix": "Availability",
+  "booking.availability.description": "Set your weekly availability. Clients can only book slots within these windows.",
+  "booking.availabilitySetup.documentTitle": "Availability",
+  "booking.availabilitySetup.title": "Availability",
+  "booking.availabilitySetup.description": "Set when you are available for bookings. Clients can only book times within these windows.",
+  "booking.availabilitySetup.loading": "Loading…",
+  "booking.availabilitySetup.weeklySchedule": "Weekly schedule",
+  "booking.availabilitySetup.day.monday": "Monday",
+  "booking.availabilitySetup.day.tuesday": "Tuesday",
+  "booking.availabilitySetup.day.wednesday": "Wednesday",
+  "booking.availabilitySetup.day.thursday": "Thursday",
+  "booking.availabilitySetup.day.friday": "Friday",
+  "booking.availabilitySetup.day.saturday": "Saturday",
+  "booking.availabilitySetup.day.sunday": "Sunday",
+  "booking.availabilitySetup.unavailable": "Unavailable",
+  "booking.availabilitySetup.sessionDuration": "Session length",
+  "booking.availabilitySetup.sessionDurationHint": "Choose session lengths clients can select.",
+  "booking.availabilitySetup.durationMin": "{minutes} min",
+  "booking.availabilitySetup.bufferLabel": "Buffer time between bookings",
+  "booking.availabilitySetup.bufferNone": "No buffer",
+  "booking.availabilitySetup.bufferMinutes": "{minutes} minutes",
+  "booking.availabilitySetup.bufferHint": "Automatic pause added after each booking.",
+  "booking.availabilitySetup.timezone": "Time zone",
+  "booking.availabilitySetup.save": "Save availability",
+  "booking.availabilitySetup.saving": "Saving…",
+  "booking.availabilitySetup.errorSave": "Could not save ({status})",
+  "booking.availabilitySetup.savedTitle": "Availability saved",
+  "booking.availabilitySetup.savedBody": "Your booking link is ready to share with clients.",
+  "booking.availabilitySetup.copyLink": "Copy link",
+  "booking.availabilitySetup.copied": "Copied!",
+  "booking.services.documentTitle": "Services",
+  "booking.services.titleSuffix": "Services",
+  "booking.services.description": "Define what you offer — name, duration, and price. Clients will see these when booking.",
+  "booking.services.addService": "Add service",
+  "booking.services.yourServices": "Your services",
+  "booking.services.example.introCall.name": "Intro call",
+  "booking.services.example.introCall.description": "A free 30-minute intro to see if we're a good fit.",
+  "booking.services.example.strategy.name": "Strategy session",
+  "booking.services.example.strategy.description": "Deep-dive strategy session.",
+  "booking.book.documentTitle": "Book a session",
+  "booking.book.title": "Book a session",
+  "booking.book.description": "Pick a time that works for you and confirm your appointment.",
+  "booking.book.form.chooseService": "Choose a service",
+  "booking.book.form.loadingServices": "Loading services for workspace {workspaceId}…",
+  "booking.book.form.continuePlaceholder": "Continue (placeholder)",
+  "booking.book.form.pickTime": "Pick a time",
+  "booking.book.form.slotsPlaceholder": "Available slots will appear here.",
+  "booking.book.form.back": "Back",
+  "booking.book.form.yourDetails": "Your details",
+  "booking.book.form.nameLabel": "Name",
+  "booking.book.form.namePlaceholder": "Jane Smith",
+  "booking.book.form.emailLabel": "Email",
+  "booking.book.form.emailPlaceholder": "jane@example.com",
+  "booking.book.form.confirmPay": "Confirm & Pay",
+  "booking.book.form.confirmed": "Booking confirmed!",
+  "booking.book.form.checkEmail": "Check your email for a confirmation.",
+  "booking.availabilityEditor.save": "Save availability",
+  "booking.availabilityEditor.unavailable": "Unavailable",
+  "booking.availabilityEditor.to": "to",
+  "booking.availabilityEditor.buffer": "Buffer",
+  "booking.availabilityEditor.min": "min",
+  "booking.availabilityEditor.day.sun": "Sun",
+  "booking.availabilityEditor.day.mon": "Mon",
+  "booking.availabilityEditor.day.tue": "Tue",
+  "booking.availabilityEditor.day.wed": "Wed",
+  "booking.availabilityEditor.day.thu": "Thu",
+  "booking.availabilityEditor.day.fri": "Fri",
+  "booking.availabilityEditor.day.sat": "Sat",
+  "publicBooking.documentTitle": "Book an appointment",
+  "publicBooking.title": "Book an appointment",
+  "publicBooking.description": "Choose a date and time that works for you.",
+  "publicBooking.loadingSlots": "Loading times…",
+  "publicBooking.slotsError": "Could not load available times.",
+  "publicBooking.noSlots": "No available times for the selected date.",
+  "publicBooking.back": "← Back",
+  "publicBooking.selectedTime": "Selected time: {datetime}",
+  "publicBooking.durationMin": "({minutes} min)",
+  "publicBooking.continue": "Continue →",
+  "publicBooking.pickDate": "Select a highlighted date in the calendar",
+  "publicBooking.form.name": "Your name",
+  "publicBooking.form.namePlaceholder": "Anna Svensson",
+  "publicBooking.form.email": "Email address",
+  "publicBooking.form.emailPlaceholder": "anna@example.com",
+  "publicBooking.form.message": "Message (optional)",
+  "publicBooking.form.messagePlaceholder": "Tell us what you'd like to discuss…",
+  "publicBooking.form.submit": "Send request",
+  "publicBooking.form.submitting": "Sending…",
+  "publicBooking.form.error": "Booking failed ({status})",
+  "publicBooking.pending.title": "Your request has been sent!",
+  "publicBooking.pending.body": "The consultant will confirm shortly. You will receive an email with a calendar invite once the booking is confirmed.",
+  "publicBooking.pending.requestedTime": "Requested time",
+  "publicBooking.pending.duration": "{minutes} minutes",
+  "publicBooking.month.january": "January",
+  "publicBooking.month.february": "February",
+  "publicBooking.month.march": "March",
+  "publicBooking.month.april": "April",
+  "publicBooking.month.may": "May",
+  "publicBooking.month.june": "June",
+  "publicBooking.month.july": "July",
+  "publicBooking.month.august": "August",
+  "publicBooking.month.september": "September",
+  "publicBooking.month.october": "October",
+  "publicBooking.month.november": "November",
+  "publicBooking.month.december": "December",
+  "publicBooking.weekday.sun": "Sun",
+  "publicBooking.weekday.mon": "Mon",
+  "publicBooking.weekday.tue": "Tue",
+  "publicBooking.weekday.wed": "Wed",
+  "publicBooking.weekday.thu": "Thu",
+  "publicBooking.weekday.fri": "Fri",
+  "publicBooking.weekday.sat": "Sat",
+  "publicBooking.weekdayLong.sun": "Sunday",
+  "publicBooking.weekdayLong.mon": "Monday",
+  "publicBooking.weekdayLong.tue": "Tuesday",
+  "publicBooking.weekdayLong.wed": "Wednesday",
+  "publicBooking.weekdayLong.thu": "Thursday",
+  "publicBooking.weekdayLong.fri": "Friday",
+  "publicBooking.weekdayLong.sat": "Saturday",
+  "booking.card.status.pending": "Pending",
+  "booking.card.status.confirmed": "Confirmed",
+  "booking.card.status.cancelled": "Cancelled",
+  "booking.card.view": "View →",
+  "booking.card.confirm": "Confirm",
+  "booking.card.decline": "Decline",
+  "booking.card.cancel": "Cancel",
+  "booking.card.waiting": "Waiting…",
+  "booking.card.errorGeneric": "Something went wrong",
+  "booking/create.label": "Create booking",
+  "booking/create.description": "Create a new booking request from a client",
+  "booking/get-available-slots.label": "Get available slots",
+  "booking/get-available-slots.description": "List bookable time slots for a consultant",
+  "booking/get-availability.label": "Get availability",
+  "booking/get-availability.description": "Load weekly availability settings for the workspace",
+  "booking/save-availability.label": "Save availability",
+  "booking/save-availability.description": "Save weekly availability and booking preferences",
+  "booking/list.label": "List bookings",
+  "booking/list.description": "List all bookings for the current workspace",
+  "booking/decline.label": "Decline booking",
+  "booking/decline.description": "Decline a pending booking request",
+  "booking/confirm.label": "Confirm booking",
+  "booking/confirm.description": "Confirm a pending booking request",
+  "booking/cancel.label": "Cancel booking",
+  "booking/cancel.description": "Cancel a confirmed booking"
+}

package/src/home.page.jsx

@@ -1,13 +1,56 @@
 import React from 'react'
-import { cover } from './cover.js'
-import { features } from './features.js'
+import { useLocale } from '@ossy/design-system'
 import SalesSection from './SalesSection.jsx'
 
 export const metadata = {
   id: 'booking/home',
-  title: 'Bokningskalender – Ossy',
-  description: 'Låt kunder boka tid direkt. Dela en länk, kunder väljer tid, du fokuserar på jobbet.',
   path: { sv: '/boka', en: '/booking' },
 }
 
-export default () => <SalesSection cover={cover} features={features} />
+function useBookingHomeContent () {
+  const { t } = useLocale()
+
+  const cover = {
+    title: t('booking.home.cover.title'),
+    text: t('booking.home.cover.text'),
+    actions: [
+      { label: t('booking.home.cover.ctaPrimary'), variant: 'cta', href: '/sign-up' },
+      { label: t('booking.home.cover.ctaSecondary'), variant: 'secondary', href: '/boka/demo' },
+    ],
+  }
+
+  const features = [
+    {
+      title: t('booking.home.features.page.title'),
+      icon: 'share',
+      text: t('booking.home.features.page.text'),
+    },
+    {
+      title: t('booking.home.features.confirmations.title'),
+      icon: 'check-circle',
+      text: t('booking.home.features.confirmations.text'),
+    },
+    {
+      title: t('booking.home.features.availability.title'),
+      icon: 'calendar',
+      text: t('booking.home.features.availability.text'),
+    },
+    {
+      title: t('booking.home.features.email.title'),
+      icon: 'mail',
+      text: t('booking.home.features.email.text'),
+    },
+    {
+      title: t('booking.home.features.doubleBook.title'),
+      icon: 'warning',
+      text: t('booking.home.features.doubleBook.text'),
+    },
+  ]
+
+  return { cover, features }
+}
+
+export default function BookingHomePage () {
+  const { cover, features } = useBookingHomeContent()
+  return <SalesSection cover={cover} features={features} />
+}