= ({\n className,\n name,\n label,\n labelProps,\n textareaProps,\n isRequired,\n}) => {\n const { field, fieldState } = useController<{ __name__: string }, '__name__'>(\n { name: name as '__name__' },\n );\n\n return (\n \n {typeof label !== 'undefined' && (\n
\n {label}\n {isRequired ? * : ''}\n \n )}\n \n {fieldState.error.message}\n
\n )}\n \n {children}\n \n );\n};\n\nexport const withQueryClient = (\n Component: React.ComponentType
,\n) => {\n return (props: P & JSX.IntrinsicAttributes) => (\n \n \n );\n};\n"
},
{
"path": "medusa/src/admin/hooks/fashion.ts",
"content": "import {\n useMutation,\n UseMutationOptions,\n useQueryClient,\n} from '@tanstack/react-query';\n\nexport const useCreateMaterialMutation = (\n options:\n | Omit<\n UseMutationOptions<\n any,\n Error,\n {\n name: string;\n },\n unknown\n >,\n 'mutationKey' | 'mutationFn'\n >\n | undefined = undefined,\n) => {\n const queryClient = useQueryClient();\n\n return useMutation({\n mutationKey: ['fashion', 'create'],\n mutationFn: async (values: { name: string }) => {\n return fetch('/admin/fashion', {\n method: 'POST',\n body: JSON.stringify(values),\n credentials: 'include',\n }).then((res) => res.json());\n },\n ...options,\n onSuccess: async (...args) => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n\n if (options?.onSuccess) {\n return options.onSuccess(...args);\n }\n },\n });\n};\n\nexport const useCreateColorMutation = (\n material_id: string,\n options:\n | Omit<\n UseMutationOptions<\n any,\n Error,\n { name: string; hex_code: string },\n unknown\n >,\n 'mutationKey' | 'mutationFn'\n >\n | undefined = undefined,\n) => {\n const queryClient = useQueryClient();\n\n return useMutation({\n mutationKey: ['fashion', material_id, 'colors', 'create'],\n mutationFn: async (values: { name: string; hex_code: string }) => {\n return fetch(`/admin/fashion/${material_id}/colors`, {\n method: 'POST',\n body: JSON.stringify(values),\n credentials: 'include',\n }).then((res) => res.json());\n },\n ...options,\n onSuccess: async (...args) => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n\n if (options?.onSuccess) {\n return options.onSuccess(...args);\n }\n },\n });\n};\n"
},
{
"path": "medusa/src/admin/hooks/images.ts",
"content": "import { HttpTypes } from '@medusajs/framework/types';\nimport { UseMutationOptions, useMutation } from '@tanstack/react-query';\n\nconst getFileBase64EncodedContent = (file: File) => {\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n reader.onload = () => {\n resolve(\n (reader.result as string).replace('data:', '').replace(/^.+,/, ''),\n );\n };\n reader.onerror = reject;\n reader.readAsDataURL(file);\n });\n};\n\nconst createPayload = async (payload: HttpTypes.AdminUploadFile) => {\n if (payload instanceof FileList) {\n const formData = new FormData();\n for (const file of payload) {\n formData.append('files', file);\n }\n return formData;\n }\n\n if (payload.files.every((f) => f instanceof File)) {\n const formData = new FormData();\n for (const file of payload.files) {\n formData.append('files', file);\n }\n return formData;\n }\n\n const obj: {\n files: {\n name: string;\n content: string;\n }[];\n } = {\n files: [],\n };\n\n for (const file of payload.files) {\n if (file instanceof File) {\n obj.files.push({\n name: file.name,\n content: await getFileBase64EncodedContent(file),\n });\n } else {\n obj.files.push(file);\n }\n }\n\n return JSON.stringify(obj);\n};\n\nexport const useAdminUploadImage = (\n options?: UseMutationOptions<\n HttpTypes.AdminFileListResponse,\n Error,\n HttpTypes.AdminUploadFile\n >,\n) => {\n return useMutation<\n HttpTypes.AdminFileListResponse,\n Error,\n HttpTypes.AdminUploadFile\n >({\n mutationKey: ['admin-upload-image'],\n mutationFn: async (payload) => {\n const res = await fetch(`/admin/uploads`, {\n method: 'POST',\n body: await createPayload(payload),\n credentials: 'include',\n });\n\n if (!res.ok) {\n throw new Error(res.statusText);\n }\n\n return res.json();\n },\n ...options,\n });\n};\n"
},
{
"path": "medusa/src/admin/routes/fashion/[id]/page.tsx",
"content": "import * as React from 'react';\nimport { z } from 'zod';\nimport { useParams } from 'react-router-dom';\nimport {\n Container,\n Heading,\n Text,\n IconButton,\n Table,\n Button,\n Drawer,\n DropdownMenu,\n Prompt,\n Switch,\n Label,\n Kbd,\n} from '@medusajs/ui';\nimport {\n PencilSquare,\n EllipsisHorizontal,\n Trash,\n ArrowPath,\n} from '@medusajs/icons';\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { useSearchParams } from 'react-router-dom';\n\nimport type { MaterialModelType } from '../../../../modules/fashion/models/material';\nimport { ColorModelType } from '../../../../modules/fashion/models/color';\nimport { useCreateColorMutation } from '../../../hooks/fashion';\nimport { Form } from '../../../components/Form/Form';\nimport { InputField } from '../../../components/Form/InputField';\nimport { EditMaterialDrawer } from '../../../components/EditMaterialDrawer';\nimport { withQueryClient } from '../../../components/QueryClientProvider';\n\nconst colorFormSchema = z.object({\n name: z.string().min(1),\n hex_code: z.string().min(7).max(7),\n});\n\nconst EditColorDrawer: React.FC<{\n materialId: string;\n id: string;\n initialValues: z.infer;\n children: React.ReactNode;\n}> = ({ materialId, id, initialValues, children }) => {\n const queryClient = useQueryClient();\n const [isDrawerOpen, setIsDrawerOpen] = React.useState(false);\n const updateColorMutation = useMutation({\n mutationKey: ['fashion', materialId, 'colors', id, 'update'],\n mutationFn: async (values: z.infer) => {\n return fetch(`/admin/fashion/${materialId}/colors/${id}`, {\n method: 'POST',\n body: JSON.stringify(values),\n credentials: 'include',\n }).then((res) => res.json());\n },\n onSuccess: async () => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n },\n });\n\n return (\n \n {children} \n \n \n Edit Color \n \n \n {\n await updateColorMutation.mutateAsync(values);\n setIsDrawerOpen(false);\n }}\n formProps={{\n id: `edit-color-${id}-form`,\n }}\n defaultValues={initialValues}\n >\n \n
\n \n \n \n \n Cancel \n \n \n Update\n \n \n \n \n );\n};\n\nconst DeleteColorPrompt: React.FC<{\n materialId: string;\n id: string;\n name: string;\n children: React.ReactNode;\n}> = ({ materialId, name, id, children }) => {\n const queryClient = useQueryClient();\n const [isPromptOpen, setIsPromptOpen] = React.useState(false);\n const deleteColorMutation = useMutation({\n mutationKey: ['fashion', materialId, 'colors', id, 'delete'],\n mutationFn: async () => {\n return fetch(`/admin/fashion/${materialId}/colors/${id}`, {\n method: 'DELETE',\n credentials: 'include',\n }).then((res) => res.json());\n },\n onSuccess: async () => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n\n setIsPromptOpen(false);\n },\n });\n\n return (\n \n {children} \n \n \n Delete {name} color? \n \n Are you sure you want to delete the color {name}?\n \n \n \n Cancel \n {\n deleteColorMutation.mutate();\n }}\n >\n Delete\n \n \n \n \n );\n};\n\nconst RestoreColorPrompt: React.FC<{\n materialId: string;\n id: string;\n name: string;\n children: React.ReactNode;\n}> = ({ materialId, name, id, children }) => {\n const queryClient = useQueryClient();\n const [isPromptOpen, setIsPromptOpen] = React.useState(false);\n const restoreColorMutation = useMutation({\n mutationKey: ['fashion', materialId, 'colors', id, 'restore'],\n mutationFn: async () => {\n return fetch(`/admin/fashion/${materialId}/colors/${id}/restore`, {\n method: 'POST',\n credentials: 'include',\n }).then((res) => res.json());\n },\n onSuccess: async () => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n\n setIsPromptOpen(false);\n },\n });\n\n return (\n \n {children} \n \n \n Restore {name} color? \n \n Are you sure you want to restore the color {name}?\n \n \n \n Cancel \n {\n restoreColorMutation.mutate();\n }}\n >\n Restore\n \n \n \n \n );\n};\n\nconst MaterialColors: React.FC<{ materialId: string }> = ({ materialId }) => {\n const [searchParams, setSearchParams] = useSearchParams();\n const page = Number(searchParams.get('page')) || 1;\n const setPage = React.useCallback(\n (page: number) => {\n setSearchParams((prev) => {\n const next = new URLSearchParams(prev);\n next.set('page', page.toString());\n return next;\n });\n },\n [setSearchParams]\n );\n const deleted = searchParams.has('deleted');\n const toggleDeleted = React.useCallback(() => {\n setSearchParams((prev) => {\n const next = new URLSearchParams(prev);\n\n if (prev.has('page')) {\n next.delete('page');\n }\n\n if (!prev.has('deleted')) {\n next.set('deleted', '');\n } else {\n next.delete('deleted');\n }\n\n return next;\n });\n }, [setSearchParams]);\n\n const [isCreateModalOpen, setIsCreateModalOpen] = React.useState(false);\n\n const { data, isLoading, isError, isSuccess } = useQuery({\n queryKey: ['fashion', materialId, 'colors', deleted, page],\n queryFn: async () => {\n return fetch(\n `/admin/fashion/${materialId}/colors?page=${page}${\n deleted ? '&deleted=true' : ''\n }`,\n {\n credentials: 'include',\n }\n ).then(\n (res) =>\n res.json() as Promise<{\n colors: ColorModelType[];\n count: number;\n page: number;\n last_page: number;\n }>\n );\n },\n });\n\n const createColorMutation = useCreateColorMutation(materialId);\n\n return (\n \n
\n
Colors \n
\n
\n {\n toggleDeleted();\n }}\n />\n Show Deleted \n
\n
\n \n \n Create\n \n \n \n \n Create Color \n \n \n {\n await createColorMutation.mutateAsync(values);\n setIsCreateModalOpen(false);\n }}\n formProps={{\n id: 'create-color-form',\n }}\n >\n \n
\n \n \n \n \n Cancel \n \n \n Create\n \n \n \n \n
\n
\n
\n \n \n Name \n Hex Code \n \n \n \n \n {isLoading && (\n \n {/* @ts-ignore */}\n \n Loading... \n \n \n )}\n {isError && (\n \n {/* @ts-ignore */}\n \n Error loading colors \n \n \n )}\n {isSuccess && data.colors.length === 0 && (\n \n {/* @ts-ignore */}\n \n No colors found \n \n \n )}\n {isSuccess &&\n data.colors.length > 0 &&\n data.colors.map((color) => (\n \n {color.name} \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ) : (\n \n \n \n \n )}\n \n \n \n \n ))}\n \n
\n
1}\n canNextPage={page < (data?.last_page ?? 1)}\n previousPage={() => setPage(Math.max(1, page - 1))}\n nextPage={() => setPage(Math.min(page + 1, data?.last_page ?? 1))}\n />\n ;\n },\n });\n\n if (!id) {\n return null;\n }\n\n return (\n \n {isLoading && Loading... }\n {isError && Error loading material }\n {isSuccess && (\n <>\n \n
\n
{data?.name} \n
\n \n \n \n
\n
\n );\n};\n\nexport default withQueryClient(MaterialPage);\n"
},
{
"path": "medusa/src/admin/routes/fashion/page.tsx",
"content": "import * as React from 'react';\nimport { defineRouteConfig } from '@medusajs/admin-sdk';\nimport {\n Swatch,\n PencilSquare,\n EllipsisHorizontal,\n Trash,\n ArrowPath,\n} from '@medusajs/icons';\nimport {\n Container,\n Heading,\n Table,\n Button,\n IconButton,\n Text,\n Drawer,\n DropdownMenu,\n Prompt,\n Switch,\n Label,\n} from '@medusajs/ui';\nimport { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';\nimport { useSearchParams, Link } from 'react-router-dom';\n\nimport { MaterialModelType } from '../../../modules/fashion/models/material';\nimport { useCreateMaterialMutation } from '../../hooks/fashion';\nimport { Form } from '../../components/Form/Form';\nimport { InputField } from '../../components/Form/InputField';\nimport {\n EditMaterialDrawer,\n materialFormSchema,\n} from '../../components/EditMaterialDrawer';\nimport { withQueryClient } from '../../components/QueryClientProvider';\n\nconst DeleteMaterialPrompt: React.FC<{\n id: string;\n name: string;\n children: React.ReactNode;\n}> = ({ id, name, children }) => {\n const queryClient = useQueryClient();\n const [isPromptOpen, setIsPromptOpen] = React.useState(false);\n const deleteMaterialMutation = useMutation({\n mutationKey: ['fashion', id, 'delete'],\n mutationFn: async () => {\n return fetch(`/admin/fashion/${id}`, {\n method: 'DELETE',\n credentials: 'include',\n }).then((res) => res.json());\n },\n onSuccess: async () => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n\n setIsPromptOpen(false);\n },\n });\n\n return (\n \n {children} \n \n \n Delete {name} material? \n \n Are you sure you want to delete the material {name}?\n \n \n \n Cancel \n {\n deleteMaterialMutation.mutate();\n }}\n >\n Delete\n \n \n \n \n );\n};\n\nconst RestoreMaterialPrompt: React.FC<{\n id: string;\n name: string;\n children: React.ReactNode;\n}> = ({ id, name, children }) => {\n const queryClient = useQueryClient();\n const [isPromptOpen, setIsPromptOpen] = React.useState(false);\n const restoreMaterialMutation = useMutation({\n mutationKey: ['fashion', id, 'restore'],\n mutationFn: async () => {\n return fetch(`/admin/fashion/${id}/restore`, {\n method: 'POST',\n credentials: 'include',\n }).then((res) => res.json());\n },\n onSuccess: async () => {\n await queryClient.invalidateQueries({\n predicate: (query) => query.queryKey[0] === 'fashion',\n });\n\n setIsPromptOpen(false);\n },\n });\n\n return (\n \n {children} \n \n \n Restore {name} material? \n \n Are you sure you want to restore the material {name}?\n \n \n \n Cancel \n {\n restoreMaterialMutation.mutate();\n }}\n >\n Restore\n \n \n \n \n );\n};\n\nconst FashionPage = () => {\n const [searchParams, setSearchParams] = useSearchParams();\n const page = Number(searchParams.get('page')) || 1;\n const setPage = React.useCallback(\n (page: number) => {\n setSearchParams((prev) => {\n const next = new URLSearchParams(prev);\n next.set('page', page.toString());\n return next;\n });\n },\n [setSearchParams]\n );\n const deleted = searchParams.has('deleted');\n const toggleDeleted = React.useCallback(() => {\n setSearchParams((prev) => {\n const next = new URLSearchParams(prev);\n\n if (prev.has('page')) {\n next.delete('page');\n }\n\n if (!prev.has('deleted')) {\n next.set('deleted', '');\n } else {\n next.delete('deleted');\n }\n return next;\n });\n }, [setSearchParams]);\n const [isCreateModalOpen, setIsCreateModalOpen] = React.useState(false);\n\n const { data, isLoading, isError, isSuccess } = useQuery({\n queryKey: ['fashion', deleted, page],\n queryFn: async () => {\n return fetch(\n `/admin/fashion?page=${page}${deleted ? '&deleted=true' : ''}`,\n {\n credentials: 'include',\n }\n ).then(\n (res) =>\n res.json() as Promise<{\n materials: MaterialModelType[];\n count: number;\n page: number;\n last_page: number;\n }>\n );\n },\n });\n\n const createMaterialMutation = useCreateMaterialMutation();\n\n return (\n \n \n
Materials \n
\n
\n {\n toggleDeleted();\n }}\n />\n Show Deleted \n
\n
\n \n \n Create\n \n \n \n \n Create Material \n \n \n {\n await createMaterialMutation.mutateAsync(values);\n setIsCreateModalOpen(false);\n }}\n formProps={{\n id: 'create-material-form',\n }}\n >\n \n \n \n Cancel \n \n \n Create\n \n \n \n \n
\n
\n \n \n Name \n \n \n \n \n {isLoading && (\n \n {/* @ts-ignore */}\n \n Loading... \n \n \n )}\n {isError && (\n \n {/* @ts-ignore */}\n \n Error loading materials \n \n \n )}\n {isSuccess && data.materials.length === 0 && (\n \n {/* @ts-ignore */}\n \n No materials found \n \n \n )}\n {isSuccess &&\n data.materials.length > 0 &&\n data.materials.map((material) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ) : (\n \n \n \n \n )}\n \n \n \n \n ))}\n \n
\n 1}\n canNextPage={page < (data?.last_page ?? 1)}\n previousPage={() => setPage(Math.max(1, page - 1))}\n nextPage={() => setPage(Math.min(page + 1, data?.last_page ?? 1))}\n />\n \n );\n};\n\nexport default withQueryClient(FashionPage);\n\nexport const config = defineRouteConfig({\n label: 'Materials & Colors',\n icon: Swatch,\n});\n"
},
{
"path": "medusa/src/admin/tsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"target\": \"ES2020\",\n \"useDefineForClassFields\": true,\n \"lib\": [\"ES2020\", \"DOM\", \"DOM.Iterable\"],\n \"module\": \"ESNext\",\n \"skipLibCheck\": true,\n\n /* Bundler mode */\n \"moduleResolution\": \"bundler\",\n \"allowImportingTsExtensions\": true,\n \"resolveJsonModule\": true,\n \"isolatedModules\": true,\n \"noEmit\": true,\n \"jsx\": \"react-jsx\",\n\n /* Linting */\n \"strict\": true,\n \"noUnusedLocals\": true,\n \"noUnusedParameters\": true,\n \"noFallthroughCasesInSwitch\": true\n },\n \"include\": [\".\"]\n}\n"
},
{
"path": "medusa/src/admin/widgets/collection-details.tsx",
"content": "import * as React from 'react';\nimport { defineWidgetConfig } from '@medusajs/admin-sdk';\nimport { DetailWidgetProps, AdminCollection } from '@medusajs/framework/types';\nimport { Container, Heading, Button, Drawer, Text } from '@medusajs/ui';\nimport { PencilSquare } from '@medusajs/icons';\nimport { z } from 'zod';\n\nimport { ImageField, imageFieldSchema } from '../components/Form/ImageField';\nimport { Form } from '../components/Form/Form';\nimport { TextareaField } from '../components/Form/TextareaField';\nimport { InputField } from '../components/Form/InputField';\n\nconst detailsFormSchema = z.object({\n image: imageFieldSchema().optional(),\n description: z.string().optional(),\n collection_page_image: imageFieldSchema().optional(),\n collection_page_heading: z.string().optional(),\n collection_page_content: z.string().optional(),\n product_page_heading: z.string().optional(),\n product_page_image: imageFieldSchema().optional(),\n product_page_wide_image: imageFieldSchema().optional(),\n product_page_cta_image: imageFieldSchema().optional(),\n product_page_cta_heading: z.string().optional(),\n product_page_cta_link: z.string().optional(),\n});\n\nconst UpdateDetailsDrawer: React.FC<{\n children: React.ReactNode;\n isOpen: boolean;\n onOpenChange: (open: boolean) => void;\n id: string;\n title: React.ReactNode;\n initialValue: z.infer;\n onSave: (values: z.infer) => void;\n}> = ({ children, isOpen, onOpenChange, id, title, initialValue, onSave }) => {\n return (\n \n {children} \n \n \n {title} \n \n \n {\n await fetch(`/admin/custom/collections/${id}/details`, {\n method: 'POST',\n body: JSON.stringify(values),\n credentials: 'include',\n });\n\n onSave(values);\n }}\n defaultValues={initialValue}\n formProps={{\n id: `edit-collection-${id}-fields`,\n }}\n >\n \n
\n \n \n \n \n Cancel \n \n \n Save\n \n \n \n \n );\n};\n\nconst CollectionDetailsWidget = ({\n data,\n}: DetailWidgetProps) => {\n const [isEditModalOpen, setIsModalOpen] = React.useState(false);\n const [details, setDetails] = React.useState | null>(null);\n\n React.useEffect(() => {\n fetch(`/admin/custom/collections/${data.id}/details`, {\n credentials: 'include',\n })\n .then((res) => res.json())\n .then((json) => {\n setDetails(json);\n })\n .catch((e) => {\n console.error(e);\n });\n }, [data.id]);\n\n return (\n \n \n
Details \n {details !== null && (\n
{\n setDetails(value);\n setIsModalOpen(false);\n }}\n >\n {\n event.preventDefault();\n setIsModalOpen(true);\n }}\n >\n \n {details === null ? (\n
Loading... \n ) : (\n
\n {typeof details.image?.url === 'string' && (\n
\n )}\n {(details.description?.length ?? 0) > 0 && (\n
{details.description} \n )}\n\n {typeof details.image?.url !== 'string' && !details.description && (\n
No details available \n )}\n\n
Collection Page \n\n {typeof details.collection_page_image?.url === 'string' && (\n
\n )}\n {(details.collection_page_heading?.length ?? 0) > 0 && (\n
{details.collection_page_heading} \n )}\n {(details.collection_page_content?.length ?? 0) > 0 && (\n
{details.collection_page_content} \n )}\n\n {typeof details.collection_page_image?.url !== 'string' &&\n !details.collection_page_heading &&\n !details.collection_page_content && (\n
Collection page details not entered \n )}\n\n
Product Page \n\n {typeof details.product_page_heading?.length === 'string' && (\n
{details.product_page_heading} \n )}\n\n {typeof details.product_page_image?.url === 'string' && (\n
\n )}\n\n {typeof details.product_page_wide_image?.url === 'string' && (\n
\n )}\n\n {typeof details.product_page_cta_image?.url === 'string' && (\n
\n )}\n\n {(details.product_page_cta_heading?.length ?? 0) > 0 && (\n
{details.product_page_cta_heading} \n )}\n\n {(details.product_page_cta_link?.length ?? 0) > 0 && (\n
{details.product_page_cta_link} \n )}\n\n {typeof details.product_page_heading?.length !== 'string' &&\n typeof details.product_page_image?.url !== 'string' &&\n typeof details.product_page_wide_image?.url !== 'string' &&\n typeof details.product_page_cta_image?.url !== 'string' &&\n !details.product_page_cta_heading &&\n !details.product_page_cta_link && (\n
Product page details not entered \n )}\n
\n )}\n
\n );\n};\n\nexport const config = defineWidgetConfig({\n zone: 'product_collection.details.after',\n});\n\nexport default CollectionDetailsWidget;\n"
},
{
"path": "medusa/src/admin/widgets/product-fashion.tsx",
"content": "import * as React from 'react';\nimport { defineWidgetConfig } from '@medusajs/admin-sdk';\nimport { DetailWidgetProps, AdminProduct } from '@medusajs/framework/types';\nimport {\n Container,\n Heading,\n Text,\n Button,\n Drawer,\n IconButton,\n} from '@medusajs/ui';\nimport { ArrowPath, PlusMini } from '@medusajs/icons';\nimport { z } from 'zod';\nimport { useQuery, useQueryClient } from '@tanstack/react-query';\n\nimport { MaterialModelType } from '../../modules/fashion/models/material';\n\nimport { Form } from '../components/Form/Form';\nimport { withQueryClient } from '../components/QueryClientProvider';\nimport {\n useCreateColorMutation,\n useCreateMaterialMutation,\n} from '../hooks/fashion';\nimport { InputField } from '../components/Form/InputField';\n\n// const SelectColorField: React.FC<{\n// name: string;\n// }> = ({ name }) => {\n// const materialsQuery = useInfiniteQuery({\n// queryKey: ['fashion'],\n// queryFn: async ({ pageParam = 1, signal }) => {\n// const res = await fetch(`/admin/fashion?page=${pageParam}`, {\n// credentials: 'include',\n// signal,\n// });\n\n// return res.json() as Promise<{\n// materials: MaterialModelType[];\n// count: number;\n// page: number;\n// last_page: number;\n// }>;\n// },\n// initialPageParam: 1,\n// getNextPageParam: (lastPage) => {\n// return lastPage.page < lastPage.last_page ? lastPage.page + 1 : undefined;\n// },\n// getPreviousPageParam: (firstPage) => {\n// return firstPage.page > 1 ? firstPage.page - 1 : undefined;\n// },\n// });\n\n// return (\n// \n// \n// \n// \n// {materialsQuery.isSuccess &&\n// materialsQuery.data.pages.map((materialsPageData) =>\n// materialsPageData.materials.map((material) => (\n// \n// {material.name} \n// {material.colors.map((color) => (\n// \n// {color.name}\n// \n// ))}\n// \n// )),\n// )}\n// {materialsQuery.isSuccess && materialsQuery.hasNextPage && (\n// {\n// event.preventDefault();\n\n// if (materialsQuery.isFetchingNextPage) {\n// return;\n// }\n\n// materialsQuery.fetchNextPage();\n// }}\n// >\n// {materialsQuery.isFetchingNextPage ? 'Loading...' : 'Load more'}\n// \n// )}\n// \n// \n// );\n// };\n\nconst addColorFormSchema = z.object({\n name: z.string().min(1),\n hex_code: z.string().min(7).max(7),\n});\n\nconst AddColorDrawer: React.FC<{\n materialId: string;\n name: string;\n children: React.ReactNode;\n}> = ({ materialId, name, children }) => {\n const queryClient = useQueryClient();\n const [isDrawerOpen, setIsDrawerOpen] = React.useState(false);\n const createColorMutation = useCreateColorMutation(materialId, {\n onSuccess: async () => {\n await queryClient.invalidateQueries({\n predicate: (query) =>\n query.queryKey.length >= 3 &&\n query.queryKey[0] === 'product' &&\n query.queryKey[2] === 'fashion',\n });\n setIsDrawerOpen(false);\n },\n });\n\n return (\n \n {children} \n \n \n Add new color \n \n \n {\n createColorMutation.mutate(values);\n }}\n defaultValues={{\n name,\n }}\n formProps={{\n id: `material-${materialId}-add-color-${name\n .toLowerCase()\n .replace(/[^\\w]/g, '-')}`,\n }}\n >\n \n
\n \n
\n \n \n \n \n Cancel \n \n \n Save\n \n \n \n \n );\n};\n\nconst ProductFashionWidget = withQueryClient(\n ({ data }: DetailWidgetProps) => {\n const productFashion = useQuery({\n queryKey: ['product', data.id, 'fashion'],\n queryFn: async ({ signal }) => {\n const res = await fetch(`/admin/products/${data.id}/fashion`, {\n credentials: 'include',\n signal,\n });\n return res.json() as Promise<{\n missing_materials: string[];\n materials: (MaterialModelType & { missing_colors: string[] })[];\n }>;\n },\n });\n const createMaterialMutation = useCreateMaterialMutation({\n onSuccess: () => {\n productFashion.refetch();\n },\n });\n\n const materialsData = [\n ...(productFashion.data?.missing_materials ?? []),\n ...(productFashion.data?.materials ?? []),\n ].sort((a, b) => {\n const aName = typeof a === 'string' ? a : a.name;\n const bName = typeof b === 'string' ? b : b.name;\n\n return aName.localeCompare(bName);\n });\n\n return (\n \n \n
Materials & Colors \n
{\n event.preventDefault();\n productFashion.refetch();\n }}\n disabled={productFashion.isFetching}\n isLoading={productFashion.isFetching}\n >\n \n {productFashion.isLoading ? (\n
Loading... \n ) : productFashion.isError ? (\n
Error loading product materials \n ) : productFashion.isSuccess &&\n productFashion.data &&\n !materialsData.length ? (\n
No product variants with Material option \n ) : productFashion.isSuccess && productFashion.data ? (\n
\n {materialsData.map((material) => (\n
\n \n \n {typeof material === 'string' ? material : material.name}\n \n \n {typeof material === 'string' ? (\n {\n event.preventDefault();\n createMaterialMutation.mutate({\n name: material,\n });\n }}\n >\n Create material\n \n ) : (\n \n {material.colors.map((color) => (\n
\n {color.name} \n \n \n \n \n {/*
*/}\n {color} \n \n ))}\n
No fashion details set \n )}\n \n \n );\n }\n);\n\nexport const config = defineWidgetConfig({\n zone: 'product.details.side.before',\n});\n\nexport default ProductFashionWidget;\n"
},
{
"path": "medusa/src/admin/widgets/product-type-details.tsx",
"content": "import * as React from 'react';\nimport { defineWidgetConfig } from '@medusajs/admin-sdk';\nimport { DetailWidgetProps, AdminCollection } from '@medusajs/framework/types';\nimport { Container, Heading, Button, Drawer, Text } from '@medusajs/ui';\nimport { PencilSquare } from '@medusajs/icons';\nimport { z } from 'zod';\nimport { ImageField, imageFieldSchema } from '../components/Form/ImageField';\nimport { Form } from '../components/Form/Form';\n\nconst detailsFormSchema = z.object({\n image: imageFieldSchema().optional(),\n});\n\nconst UpdateDetailsDrawer: React.FC<{\n children: React.ReactNode;\n isOpen: boolean;\n onOpenChange: (open: boolean) => void;\n id: string;\n title: React.ReactNode;\n initialValue: z.infer;\n onSave: (values: z.infer) => void;\n}> = ({ children, isOpen, onOpenChange, id, title, initialValue, onSave }) => {\n return (\n \n {children} \n \n \n {title} \n \n \n {\n await fetch(`/admin/custom/product-types/${id}/details`, {\n method: 'POST',\n body: JSON.stringify(values),\n credentials: 'include',\n });\n\n onSave(values);\n }}\n defaultValues={initialValue}\n formProps={{\n id: `edit-product-type-${id}-fields`,\n }}\n >\n \n
\n \n \n \n \n Cancel \n \n \n Save\n \n \n \n \n );\n};\n\nconst ProductTypeDetailsWidget = ({\n data,\n}: DetailWidgetProps) => {\n const [isEditModalOpen, setIsModalOpen] = React.useState(false);\n const [details, setDetails] = React.useState | null>(null);\n\n React.useEffect(() => {\n fetch(`/admin/custom/product-types/${data.id}/details`, {\n credentials: 'include',\n })\n .then((res) => res.json())\n .then((json) => {\n setDetails(json);\n })\n .catch((e) => {\n console.error(e);\n });\n }, [data.id]);\n\n return (\n \n \n
Details \n {details !== null && (\n
{\n setDetails(value);\n setIsModalOpen(false);\n }}\n >\n {\n event.preventDefault();\n setIsModalOpen(true);\n }}\n >\n \n {details === null ? (\n
Loading... \n ) : (\n
\n {typeof details.image?.url === 'string' ? (\n
\n ) : (\n
No image \n )}\n
\n )}\n
\n );\n};\n\nexport const config = defineWidgetConfig({\n zone: 'product_type.details.after',\n});\n\nexport default ProductTypeDetailsWidget;\n"
},
{
"path": "medusa/src/api/README.md",
"content": "# Custom API Routes\n\nAn API Route is a REST API endpoint.\n\nAn API Route is created in a TypeScript or JavaScript file under the `/src/api` directory of your Medusa application. The file’s name must be `route.ts` or `route.js`.\n\nFor example, to create a `GET` API Route at `/store/hello-world`, create the file `src/api/store/hello-world/route.ts` with the following content:\n\n```ts\nimport type { MedusaRequest, MedusaResponse } from \"@medusajs/medusa\";\n\nexport async function GET(req: MedusaRequest, res: MedusaResponse) {\n res.json({\n message: \"Hello world!\",\n });\n}\n```\n\n## Supported HTTP methods\n\nThe file based routing supports the following HTTP methods:\n\n- GET\n- POST\n- PUT\n- PATCH\n- DELETE\n- OPTIONS\n- HEAD\n\nYou can define a handler for each of these methods by exporting a function with the name of the method in the paths `route.ts` file.\n\nFor example:\n\n```ts\nimport type { MedusaRequest, MedusaResponse } from \"@medusajs/medusa\";\n\nexport async function GET(req: MedusaRequest, res: MedusaResponse) {\n // Handle GET requests\n}\n\nexport async function POST(req: MedusaRequest, res: MedusaResponse) {\n // Handle POST requests\n}\n\nexport async function PUT(req: MedusaRequest, res: MedusaResponse) {\n // Handle PUT requests\n}\n```\n\n## Parameters\n\nTo create an API route that accepts a path parameter, create a directory within the route's path whose name is of the format `[param]`.\n\nFor example, if you want to define a route that takes a `productId` parameter, you can do so by creating a file called `/api/products/[productId]/route.ts`:\n\n```ts\nimport type {\n MedusaRequest,\n MedusaResponse,\n} from \"@medusajs/medusa\"\n\nexport async function GET(req: MedusaRequest, res: MedusaResponse) {\n const { productId } = req.params;\n\n res.json({\n message: `You're looking for product ${productId}`\n })\n}\n```\n\nTo create an API route that accepts multiple path parameters, create within the file's path multiple directories whose names are of the format `[param]`.\n\nFor example, if you want to define a route that takes both a `productId` and a `variantId` parameter, you can do so by creating a file called `/api/products/[productId]/variants/[variantId]/route.ts`.\n\n## Using the container\n\nThe Medusa container is available on `req.scope`. Use it to access modules' main services and other registered resources:\n\n```ts\nimport type {\n MedusaRequest,\n MedusaResponse,\n} from \"@medusajs/medusa\"\nimport { IProductModuleService } from \"@medusajs/framework/types\"\nimport { Modules } from \"@medusajs/framework/utils\"\n\nexport const GET = async (\n req: MedusaRequest,\n res: MedusaResponse\n) => {\n const productModuleService: IProductModuleService =\n req.scope.resolve(Modules.PRODUCT)\n\n const [, count] = await productModuleService.listAndCount()\n\n res.json({\n count,\n })\n}\n```\n\n## Middleware\n\nYou can apply middleware to your routes by creating a file called `/api/middlewares.ts`. This file must export a configuration object with what middleware you want to apply to which routes.\n\nFor example, if you want to apply a custom middleware function to the `/store/custom` route, you can do so by adding the following to your `/api/middlewares.ts` file:\n\n```ts\nimport { defineMiddlewares } from \"@medusajs/medusa\"\nimport type {\n MedusaRequest,\n MedusaResponse,\n MedusaNextFunction,\n} from \"@medusajs/medusa\";\n\nasync function logger(\n req: MedusaRequest,\n res: MedusaResponse,\n next: MedusaNextFunction\n) {\n console.log(\"Request received\");\n next();\n}\n\nexport default defineMiddlewares({\n routes: [\n {\n matcher: \"/store/custom\",\n middlewares: [logger],\n },\n ],\n})\n```\n\nThe `matcher` property can be either a string or a regular expression. The `middlewares` property accepts an array of middleware functions.\n"
},
{
"path": "medusa/src/api/admin/custom/collections/[collectionId]/details/route.ts",
"content": "import { Modules } from '@medusajs/framework/utils';\nimport { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport { z } from '@medusajs/framework/zod';\n\nconst collectionFieldsMetadataSchema = z.object({\n image: z\n .object({\n id: z.string(),\n url: z.string().url(),\n })\n .optional(),\n description: z.string().optional(),\n collection_page_image: z\n .object({\n id: z.string(),\n url: z.string().url(),\n })\n .optional(),\n collection_page_heading: z.string().optional(),\n collection_page_content: z.string().optional(),\n product_page_heading: z.string().optional(),\n product_page_image: z\n .object({\n id: z.string(),\n url: z.string().url(),\n })\n .optional(),\n product_page_wide_image: z\n .object({\n id: z.string(),\n url: z.string().url(),\n })\n .optional(),\n product_page_cta_image: z\n .object({\n id: z.string(),\n url: z.string().url(),\n })\n .optional(),\n product_page_cta_heading: z.string().optional(),\n product_page_cta_link: z.string().optional(),\n});\n\nexport async function GET(\n req: MedusaRequest,\n res: MedusaResponse,\n): Promise {\n const { collectionId } = req.params;\n const productService = req.scope.resolve(Modules.PRODUCT);\n const collection =\n await productService.retrieveProductCollection(collectionId);\n\n const parsed = collectionFieldsMetadataSchema.safeParse(\n collection.metadata ?? {},\n );\n\n res.json({\n image: parsed.success && parsed.data.image ? parsed.data.image : null,\n description:\n parsed.success && parsed.data.description ? parsed.data.description : '',\n collection_page_image:\n parsed.success && parsed.data.collection_page_image\n ? parsed.data.collection_page_image\n : null,\n collection_page_heading:\n parsed.success && parsed.data.collection_page_heading\n ? parsed.data.collection_page_heading\n : '',\n collection_page_content:\n parsed.success && parsed.data.collection_page_content\n ? parsed.data.collection_page_content\n : '',\n product_page_heading:\n parsed.success && parsed.data.product_page_heading\n ? parsed.data.product_page_heading\n : '',\n product_page_image:\n parsed.success && parsed.data.product_page_image\n ? parsed.data.product_page_image\n : null,\n product_page_wide_image:\n parsed.success && parsed.data.product_page_wide_image\n ? parsed.data.product_page_wide_image\n : null,\n product_page_cta_image:\n parsed.success && parsed.data.product_page_cta_image\n ? parsed.data.product_page_cta_image\n : null,\n product_page_cta_heading:\n parsed.success && parsed.data.product_page_cta_heading\n ? parsed.data.product_page_cta_heading\n : '',\n product_page_cta_link:\n parsed.success && parsed.data.product_page_cta_link\n ? parsed.data.product_page_cta_link\n : '',\n });\n}\n\nexport async function POST(\n req: MedusaRequest,\n res: MedusaResponse,\n): Promise {\n const { collectionId } = req.params;\n const body = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;\n const customFields = collectionFieldsMetadataSchema.parse(body);\n\n const productService = req.scope.resolve(Modules.PRODUCT);\n const collection =\n await productService.retrieveProductCollection(collectionId);\n\n const updatedCollection = await productService.updateProductCollections(\n collectionId,\n {\n metadata: {\n ...collection.metadata,\n ...customFields,\n },\n },\n );\n\n res.json(updatedCollection);\n}\n"
},
{
"path": "medusa/src/api/admin/custom/index-products/route.ts",
"content": "import {\n AuthenticatedMedusaRequest,\n MedusaResponse,\n} from '@medusajs/framework';\nimport { indexProductsWorkflow } from '../../../../workflows/index-products';\n\nexport async function POST(\n req: AuthenticatedMedusaRequest,\n res: MedusaResponse,\n): Promise {\n const result = await indexProductsWorkflow(req.scope).run();\n\n res.json(result);\n}\n"
},
{
"path": "medusa/src/api/admin/custom/product-types/[productTypeId]/details/route.ts",
"content": "import { Modules } from '@medusajs/framework/utils';\nimport { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport { z } from '@medusajs/framework/zod';\n\nconst productTypeFieldsMetadataSchema = z.object({\n image: z\n .object({\n id: z.string(),\n url: z.string().url(),\n })\n .optional(),\n});\n\nexport async function GET(\n req: MedusaRequest,\n res: MedusaResponse,\n): Promise {\n const { productTypeId } = req.params;\n const productService = req.scope.resolve(Modules.PRODUCT);\n const productType = await productService.retrieveProductType(productTypeId);\n\n const parsed = productTypeFieldsMetadataSchema.safeParse(\n productType.metadata ?? {},\n );\n\n res.json({\n image: parsed.success && parsed.data.image ? parsed.data.image : null,\n });\n}\n\nexport async function POST(\n req: MedusaRequest,\n res: MedusaResponse,\n): Promise {\n const { productTypeId } = req.params;\n const body = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;\n const customFields = productTypeFieldsMetadataSchema.parse(body);\n\n const productService = req.scope.resolve(Modules.PRODUCT);\n const productType = await productService.retrieveProductType(productTypeId);\n\n const updatedProductType = await productService.updateProductTypes(\n productTypeId,\n {\n metadata: {\n ...productType.metadata,\n ...customFields,\n },\n },\n );\n\n res.json(updatedProductType);\n}\n"
},
{
"path": "medusa/src/api/admin/fashion/[id]/colors/[colorId]/restore/route.ts",
"content": "import { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport FashionModuleService from '../../../../../../../modules/fashion/service';\nimport { FASHION_MODULE } from '../../../../../../../modules/fashion';\n\nexport const POST = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n await fashionModuleService.retrieveMaterial(req.params.id, {\n withDeleted: true,\n });\n\n await fashionModuleService.restoreColors(req.params.colorId);\n\n const color = await fashionModuleService.retrieveColor(req.params.colorId, {\n withDeleted: true,\n });\n\n res.status(200).json(color);\n};\n"
},
{
"path": "medusa/src/api/admin/fashion/[id]/colors/[colorId]/route.ts",
"content": "import { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport { z } from '@medusajs/framework/zod';\nimport FashionModuleService from '../../../../../../modules/fashion/service';\nimport { FASHION_MODULE } from '../../../../../../modules/fashion';\n\nexport const GET = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n await fashionModuleService.retrieveMaterial(req.params.id, {\n withDeleted: true,\n });\n\n const color = await fashionModuleService.retrieveColor(req.params.colorId, {\n withDeleted: true,\n });\n\n res.status(200).json(color);\n};\n\nconst colorsUpdateBodySchema = z.object({\n name: z.string().min(1),\n hex_code: z\n .string()\n .min(1)\n .transform((val) => val.toUpperCase())\n .refine((val) => /^#([A-F0-9]{6}|[A-F0-9]{3})$/.test(val), {\n message: 'Invalid hex code',\n }),\n});\n\nexport const POST = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n await fashionModuleService.retrieveMaterial(req.params.id, {\n withDeleted: true,\n });\n\n const body = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;\n const validatedData = colorsUpdateBodySchema.parse(body);\n\n const color = await fashionModuleService.updateColors({\n ...validatedData,\n id: req.params.colorId,\n });\n\n res.status(200).json(color);\n};\n\nexport const DELETE = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n await fashionModuleService.retrieveMaterial(req.params.id, {\n withDeleted: true,\n });\n\n await fashionModuleService.softDeleteColors(req.params.colorId);\n\n const color = await fashionModuleService.retrieveColor(req.params.colorId, {\n withDeleted: true,\n });\n\n res.status(200).json(color);\n};\n"
},
{
"path": "medusa/src/api/admin/fashion/[id]/colors/route.ts",
"content": "import { z } from '@medusajs/framework/zod';\nimport { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport FashionModuleService from '../../../../../modules/fashion/service';\nimport { FASHION_MODULE } from '../../../../../modules/fashion';\n\nconst colorsListQuerySchema = z.object({\n page: z.coerce.number().min(1).optional().default(1),\n deleted: z.coerce.boolean().optional().default(false),\n});\n\nexport const GET = async (req: MedusaRequest, res: MedusaResponse) => {\n const { page, deleted } = colorsListQuerySchema.parse(req.query);\n\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const [colors, count] = await fashionModuleService.listAndCountColors(\n deleted\n ? {\n deleted_at: { $lte: new Date() },\n material_id: req.params.id,\n }\n : {\n material_id: req.params.id,\n },\n {\n skip: 20 * (page - 1),\n take: 20,\n withDeleted: deleted,\n },\n );\n\n const last_page = Math.ceil(count / 20);\n\n res.status(200).json({ colors, count, page, last_page });\n};\n\nconst colorsCreateBodySchema = z.object({\n name: z.string().min(1),\n hex_code: z.string().min(7).max(7),\n});\n\nexport const POST = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const body = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;\n const validatedData = colorsCreateBodySchema.parse(body);\n\n const color = await fashionModuleService.createColors({\n ...validatedData,\n material_id: req.params.id,\n });\n\n res.status(200).json(color);\n};\n"
},
{
"path": "medusa/src/api/admin/fashion/[id]/restore/route.ts",
"content": "import { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport FashionModuleService from '../../../../../modules/fashion/service';\nimport { FASHION_MODULE } from '../../../../../modules/fashion';\n\nexport const POST = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n await fashionModuleService.restoreMaterials(req.params.id);\n\n const material = await fashionModuleService.retrieveMaterial(req.params.id, {\n relations: ['colors'],\n withDeleted: true,\n });\n\n res.status(200).json(material);\n};\n"
},
{
"path": "medusa/src/api/admin/fashion/[id]/route.ts",
"content": "import { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport { z } from '@medusajs/framework/zod';\nimport FashionModuleService from '../../../../modules/fashion/service';\nimport { FASHION_MODULE } from '../../../../modules/fashion';\n\nexport const GET = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const material = await fashionModuleService.retrieveMaterial(req.params.id, {\n relations: ['colors'],\n withDeleted: true,\n });\n\n res.status(200).json(material);\n};\n\nconst updateMaterialBodySchema = z.object({\n name: z.string().min(1),\n});\n\nexport const POST = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const body = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;\n const validatedData = updateMaterialBodySchema.parse(body);\n\n const material = await fashionModuleService.updateMaterials({\n ...validatedData,\n id: req.params.id,\n });\n\n res.status(200).json(material);\n};\n\nexport const DELETE = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n await fashionModuleService.softDeleteMaterials(req.params.id);\n\n const material = await fashionModuleService.retrieveMaterial(req.params.id, {\n relations: ['colors'],\n withDeleted: true,\n });\n\n res.status(200).json(material);\n};\n"
},
{
"path": "medusa/src/api/admin/fashion/route.ts",
"content": "import { z } from '@medusajs/framework/zod';\nimport { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport FashionModuleService from '../../../modules/fashion/service';\nimport { FASHION_MODULE } from '../../../modules/fashion';\n\nconst materialsListQuerySchema = z.object({\n page: z.coerce.number().min(1).optional().default(1),\n deleted: z.coerce.boolean().optional().default(false),\n});\n\nexport const GET = async (req: MedusaRequest, res: MedusaResponse) => {\n const { page, deleted } = materialsListQuerySchema.parse(req.query);\n\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const [materials, count] = await fashionModuleService.listAndCountMaterials(\n deleted\n ? {\n deleted_at: { $lte: new Date() },\n }\n : undefined,\n {\n skip: 20 * (page - 1),\n take: 20,\n withDeleted: deleted,\n relations: ['colors'],\n },\n );\n\n const last_page = Math.ceil(count / 20);\n\n res.status(200).json({ materials, count, page, last_page });\n};\n\nconst createMaterialBodySchema = z.object({\n name: z.string().min(1),\n});\n\nexport const POST = async (req: MedusaRequest, res: MedusaResponse) => {\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const body = typeof req.body === 'string' ? JSON.parse(req.body) : req.body;\n const validatedData = createMaterialBodySchema.parse(body);\n\n const material = await fashionModuleService.createMaterials(validatedData);\n\n res.status(201).json(material);\n};\n"
},
{
"path": "medusa/src/api/admin/products/[id]/fashion/route.ts",
"content": "import { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport { Modules } from '@medusajs/framework/utils';\nimport { IProductModuleService } from '@medusajs/framework/types';\nimport { FASHION_MODULE } from '../../../../../modules/fashion';\nimport FashionModuleService from '../../../../../modules/fashion/service';\n\nexport const GET = async (req: MedusaRequest, res: MedusaResponse) => {\n const productModuleService: IProductModuleService = req.scope.resolve(\n Modules.PRODUCT,\n );\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const product = await productModuleService.retrieveProduct(req.params.id, {\n relations: ['options', 'variants', 'variants.options'],\n });\n\n const materialOption = product.options.find(\n (option) => option.title === 'Material',\n );\n const colorOption = product.options.find(\n (option) => option.title === 'Color',\n );\n\n const materialsAndColorsNamesTree = new Map();\n\n for (const productVariant of product.variants) {\n const materialName = productVariant.options.find(\n (option) => option.option_id === materialOption.id,\n )?.value;\n\n if (!materialName) {\n continue;\n }\n\n const colorNames = productVariant.options\n .filter((option) => option.option_id === colorOption.id)\n .map((option) => option.value);\n\n if (!materialsAndColorsNamesTree.has(materialName)) {\n materialsAndColorsNamesTree.set(materialName, colorNames);\n } else {\n const existingColorNames = materialsAndColorsNamesTree.get(materialName);\n\n materialsAndColorsNamesTree.set(\n materialName,\n Array.from(new Set([...existingColorNames, ...colorNames])),\n );\n }\n }\n\n const materials = await fashionModuleService.listMaterials(\n {\n name: Array.from(materialsAndColorsNamesTree.keys()),\n },\n {\n relations: ['colors'],\n },\n );\n\n res.status(200).json({\n missing_materials: Array.from(materialsAndColorsNamesTree.keys()).filter(\n (materialName) =>\n materials.every((material) => material.name !== materialName),\n ),\n materials: materials.map((material) => ({\n ...material,\n colors: material.colors.filter((color) =>\n materialsAndColorsNamesTree.get(material.name).includes(color.name),\n ),\n missing_colors: materialsAndColorsNamesTree\n .get(material.name)\n .filter((colorName) =>\n material.colors.every((color) => color.name !== colorName),\n ),\n })),\n });\n};\n"
},
{
"path": "medusa/src/api/middlewares.ts",
"content": "import { defineMiddlewares } from '@medusajs/medusa';\nimport { adminProductTypeRoutesMiddlewares } from './store/custom/product-types/middlewares';\nimport { authenticate } from '@medusajs/framework';\n\nexport default defineMiddlewares([\n ...adminProductTypeRoutesMiddlewares,\n {\n method: 'ALL',\n matcher: '/store/custom/customer/*',\n middlewares: [authenticate('customer', ['session', 'bearer'])],\n },\n]);\n"
},
{
"path": "medusa/src/api/store/custom/customer/send-welcome-email/route.ts",
"content": "import {\n AuthenticatedMedusaRequest,\n MedusaResponse,\n} from '@medusajs/framework';\nimport emitCustomerWelcomeEvent from '../../../../../workflows/emit-customer-welcome-event';\n\nexport const POST = async (\n req: AuthenticatedMedusaRequest,\n res: MedusaResponse,\n) => {\n const customerId = req.auth_context.actor_id;\n\n await emitCustomerWelcomeEvent(req.scope).run({\n input: {\n id: customerId,\n },\n });\n\n res.status(200).json({ success: true });\n};\n"
},
{
"path": "medusa/src/api/store/custom/fashion/[productHandle]/route.ts",
"content": "import { MedusaRequest, MedusaResponse } from '@medusajs/framework';\nimport { Modules } from '@medusajs/framework/utils';\nimport { IProductModuleService } from '@medusajs/framework/types';\nimport { FASHION_MODULE } from '../../../../../modules/fashion';\nimport FashionModuleService from '../../../../../modules/fashion/service';\n\nexport const GET = async (req: MedusaRequest, res: MedusaResponse) => {\n const productModuleService: IProductModuleService = req.scope.resolve(\n Modules.PRODUCT,\n );\n const fashionModuleService: FashionModuleService =\n req.scope.resolve(FASHION_MODULE);\n\n const [product] = await productModuleService.listProducts(\n {\n handle: req.params.productHandle,\n },\n {\n relations: ['options', 'variants', 'variants.options'],\n take: 1,\n },\n );\n\n const materialOption = product.options.find(\n (option) => option.title === 'Material',\n );\n const colorOption = product.options.find(\n (option) => option.title === 'Color',\n );\n\n if (!materialOption || !colorOption) {\n res.status(200).json({\n materials: [],\n });\n return;\n }\n\n const materialsAndColorsNamesTree = new Map();\n\n for (const productVariant of product.variants) {\n const materialName = productVariant.options.find(\n (option) => option.option_id === materialOption.id,\n )?.value;\n\n if (!materialName) {\n continue;\n }\n\n const colorNames = productVariant.options\n .filter((option) => option.option_id === colorOption.id)\n .map((option) => option.value);\n\n if (!materialsAndColorsNamesTree.has(materialName)) {\n materialsAndColorsNamesTree.set(materialName, colorNames);\n } else {\n const existingColorNames = materialsAndColorsNamesTree.get(materialName);\n\n materialsAndColorsNamesTree.set(\n materialName,\n Array.from(new Set([...existingColorNames, ...colorNames])),\n );\n }\n }\n\n const materials = await fashionModuleService.listMaterials(\n {\n name: Array.from(materialsAndColorsNamesTree.keys()),\n },\n {\n relations: ['colors'],\n },\n );\n\n res.status(200).json({\n materials: materials.map((material) => ({\n id: material.id,\n name: material.name,\n colors: material.colors\n .filter((color) =>\n materialsAndColorsNamesTree.get(material.name).includes(color.name),\n )\n .map((color) => ({\n id: color.id,\n name: color.name,\n hex_code: color.hex_code,\n })),\n })),\n });\n};\n"
},
{
"path": "medusa/src/api/store/custom/product-types/[id]/route.ts",
"content": "import { refetchProductType } from '../helpers';\nimport { AdminGetProductTypeParamsType } from '../validators';\nimport { ProductTypeDTO } from '@medusajs/framework/types';\nimport {\n AuthenticatedMedusaRequest,\n MedusaResponse,\n} from '@medusajs/framework';\n\nexport const GET = async (\n req: AuthenticatedMedusaRequest,\n res: MedusaResponse\n) => {\n const productType = await refetchProductType(\n req.params.id,\n req.scope,\n req.remoteQueryConfig.fields as (keyof ProductTypeDTO)[],\n );\n\n res.status(200).json({ product_type: productType });\n};\n"
},
{
"path": "medusa/src/api/store/custom/product-types/helpers.ts",
"content": "import { MedusaContainer, ProductTypeDTO } from \"@medusajs/framework/types\"\n\nexport const refetchProductType = async (\n productTypeId: string,\n scope: MedusaContainer,\n fields: (keyof ProductTypeDTO)[]\n) => {\n const query = scope.resolve(\"query\")\n const { data: [ productType ] } = await query.graph({\n entity: \"product_type\",\n filters: { id: productTypeId },\n fields,\n })\n\n return productType \n}\n"
},
{
"path": "medusa/src/api/store/custom/product-types/middlewares.ts",
"content": "import * as QueryConfig from './query-config';\nimport {\n MiddlewareRoute,\n validateAndTransformQuery,\n} from '@medusajs/framework/http';\nimport {\n AdminGetProductTypeParams,\n AdminGetProductTypesParams,\n} from './validators';\n\nexport const adminProductTypeRoutesMiddlewares: MiddlewareRoute[] = [\n {\n method: ['GET'],\n matcher: '/store/custom/product-types',\n middlewares: [\n validateAndTransformQuery(\n AdminGetProductTypesParams,\n QueryConfig.listProductTypesTransformQueryConfig,\n ),\n ],\n },\n {\n method: ['GET'],\n matcher: '/store/custom/product-types/:id',\n middlewares: [\n validateAndTransformQuery(\n AdminGetProductTypeParams,\n QueryConfig.retrieveProductTypeTransformQueryConfig,\n ),\n ],\n },\n];\n"
},
{
"path": "medusa/src/api/store/custom/product-types/query-config.ts",
"content": "export const defaultAdminProductTypeFields = [\n \"id\",\n \"value\",\n \"created_at\",\n \"updated_at\",\n]\n\nexport const retrieveProductTypeTransformQueryConfig = {\n defaults: defaultAdminProductTypeFields,\n isList: false,\n}\n\nexport const listProductTypesTransformQueryConfig = {\n ...retrieveProductTypeTransformQueryConfig,\n defaultLimit: 20,\n isList: true,\n}\n"
},
{
"path": "medusa/src/api/store/custom/product-types/route.ts",
"content": "import { HttpTypes, ProductTypeDTO } from '@medusajs/framework/types';\nimport {\n AuthenticatedMedusaRequest,\n MedusaResponse,\n} from '@medusajs/framework';\n\nexport const GET = async (\n req: AuthenticatedMedusaRequest,\n res: MedusaResponse,\n) => {\n const query = req.scope.resolve(\"query\")\n const { data: productTypes, metadata } = await query.graph({\n entity: \"product_types\",\n filters: req.filterableFields,\n fields: req.remoteQueryConfig.fields as (keyof ProductTypeDTO)[],\n pagination: req.remoteQueryConfig.pagination\n })\n\n res.json({\n product_types: productTypes,\n count: metadata.count,\n offset: metadata.skip,\n limit: metadata.take,\n });\n};\n"
},
{
"path": "medusa/src/api/store/custom/product-types/validators.ts",
"content": "import {\n createSelectParams,\n createFindParams,\n createOperatorMap,\n} from '@medusajs/medusa/api/utils/validators';\nimport { z } from '@medusajs/framework/zod';\n\nexport type AdminGetProductTypeParamsType = z.infer<\n typeof AdminGetProductTypeParams\n>;\nexport const AdminGetProductTypeParams = createSelectParams();\n\nexport type AdminGetProductTypesParamsType = z.infer<\n typeof AdminGetProductTypesParams\n>;\nexport const AdminGetProductTypesParams = createFindParams({\n limit: 10,\n offset: 0,\n}).merge(\n z.object({\n q: z.string().optional(),\n id: z.union([z.string(), z.array(z.string())]).optional(),\n value: z.union([z.string(), z.array(z.string())]).optional(),\n // TODO: To be added in next iteration\n // discount_condition_id: z.string().nullish(),\n created_at: createOperatorMap().optional(),\n updated_at: createOperatorMap().optional(),\n deleted_at: createOperatorMap().optional(),\n $and: z.lazy(() => AdminGetProductTypesParams.array()).optional(),\n $or: z.lazy(() => AdminGetProductTypesParams.array()).optional(),\n }),\n);\n"
},
{
"path": "medusa/src/api/store/custom/stripe/get-payment-method/[id]/route.ts",
"content": "import { MedusaResponse, MedusaStoreRequest } from \"@medusajs/framework\";\nimport Stripe from \"stripe\";\n\nconst stripe = new Stripe(process.env.STRIPE_API_KEY);\n\nexport const GET = async (req: MedusaStoreRequest, res: MedusaResponse) => {\n const { id } = req.params;\n\n const paymentMethod = await stripe.paymentMethods.retrieve(id);\n res.status(200).json(paymentMethod);\n};\n"
},
{
"path": "medusa/src/api/store/custom/stripe/set-payment-method/route.ts",
"content": "import { MedusaResponse, MedusaStoreRequest } from \"@medusajs/framework\";\nimport { IPaymentModuleService } from \"@medusajs/framework/types\";\nimport { Modules } from \"@medusajs/framework/utils\";\nimport Stripe from \"stripe\";\n\nconst stripe = new Stripe(process.env.STRIPE_API_KEY);\n\nexport const POST = async (\n req: MedusaStoreRequest<{\n session_id: string;\n token: string;\n }>,\n res: MedusaResponse\n) => {\n const paymentModuleService: IPaymentModuleService = req.scope.resolve(\n Modules.PAYMENT\n );\n\n const session = await paymentModuleService.retrievePaymentSession(\n req.body.session_id\n );\n\n if (!req.body.token) {\n await paymentModuleService.updatePaymentSession({\n ...session,\n data: {\n ...session.data,\n payment_method_id: null,\n },\n });\n res.status(200).json({ success: true });\n }\n\n const paymentMethod = await stripe.paymentMethods.create({\n type: \"card\",\n card: { token: req.body.token },\n });\n\n await stripe.paymentIntents.update(session.data.id as string, {\n payment_method: paymentMethod.id,\n });\n await paymentModuleService.updatePaymentSession({\n ...session,\n data: {\n ...session.data,\n payment_method_id: paymentMethod.id,\n },\n });\n res.status(200).json({ success: true });\n};\n"
},
{
"path": "medusa/src/jobs/README.md",
"content": "# Custom scheduled jobs\n\nA scheduled job is a function executed at a specified interval of time in the background of your Medusa application.\n\nA scheduled job is created in a TypeScript or JavaScript file under the `src/jobs` directory.\n\nFor example, create the file `src/jobs/hello-world.ts` with the following content:\n\n```ts\nimport {\n IProductModuleService,\n MedusaContainer\n} from \"@medusajs/framework/types\";\nimport { Modules } from \"@medusajs/framework/utils\";\n\nexport default async function myCustomJob(container: MedusaContainer) {\n const productService: IProductModuleService = container.resolve(Modules.PRODUCT)\n\n const products = await productService.listAndCountProducts();\n\n // Do something with the products\n}\n\nexport const config = {\n name: \"daily-product-report\",\n schedule: \"0 0 * * *\", // Every day at midnight\n};\n```\n\nA scheduled job file must export:\n\n- The function to be executed whenever it’s time to run the scheduled job.\n- A configuration object defining the job. It has three properties:\n - `name`: a unique name for the job.\n - `schedule`: a [cron expression](https://crontab.guru/).\n - `numberOfExecutions`: an optional integer, specifying how many times the job will execute before being removed\n\nThe `handler` is a function that accepts one parameter, `container`, which is a `MedusaContainer` instance used to resolve services.\n"
},
{
"path": "medusa/src/links/README.md",
"content": "# Module Links\n\nA module link forms an association between two data models of different modules, while maintaining module isolation.\n\nFor example:\n\n```ts\nimport HelloModule from \"../modules/hello\"\nimport ProductModule from \"@medusajs/medusa/product\"\nimport { defineLink } from \"@medusajs/framework/utils\"\n\nexport default defineLink(\n ProductModule.linkable.product,\n HelloModule.linkable.myCustom\n)\n```\n\nThis defines a link between the Product Module's `product` data model and the Hello Module (custom module)'s `myCustom` data model.\n\nLearn more about links in [this documentation](https://docs.medusajs.com/v2/advanced-development/modules/module-links)"
},
{
"path": "medusa/src/modules/README.md",
"content": "# Custom Module\n\nA module is a package of reusable functionalities. It can be integrated into your Medusa application without affecting the overall system.\n\nTo create a module:\n\n## 1. Create a Service\n\nA module must define a service. A service is a TypeScript or JavaScript class holding methods related to a business logic or commerce functionality.\n\nFor example, create the file `src/modules/hello/service.ts` with the following content:\n\n```ts title=\"src/modules/hello/service.ts\"\nexport default class HelloModuleService {\n getMessage() {\n return \"Hello, world!\"\n }\n}\n```\n\n## 2. Export Module Definition\n\nA module must have an `index.ts` file in its root directory that exports its definition. The definition specifies the main service of the module.\n\nFor example, create the file `src/modules/hello.index.ts` with the following content:\n\n```ts title=\"src/modules/hello.index.ts\" highlights={[[\"4\", \"\", \"The main service of the module.\"]]}\nimport HelloModuleService from \"./service\"\nimport { Module } from \"@medusajs/framework/utils\"\n\nexport const HELLO_MODULE = \"helloModuleService\"\n\nexport default Module(HELLO_MODULE, {\n service: HelloModuleService,\n})\n```\n\n## 3. Add Module to Configurations\n\nThe last step is to add the module in Medusa’s configurations.\n\nIn `medusa-config.js`, add the module to the `modules` object:\n\n```js title=\"medusa-config.js\"\nimport { HELLO_MODULE } from \"./src/modules/hello\"\n\nmodule.exports = defineConfig({\n // ...\n modules: {\n [HELLO_MODULE]: {\n resolve: \"./modules/hello\",\n },\n },\n})\n```\n\nIts key (`helloModuleService` or `HELLO_MODULE`) is the name of the module’s main service. It will be registered in the Medusa container with that name.\n\n## Use Module\n\nYou can resolve the main service of the module in other resources, such as an API route:\n\n```ts\nimport { MedusaRequest, MedusaResponse } from \"@medusajs/medusa\"\nimport HelloModuleService from \"../../../modules/hello/service\"\nimport { HELLO_MODULE } from \"../../../modules/hello\"\n\nexport async function GET(\n req: MedusaRequest,\n res: MedusaResponse\n): Promise {\n const helloModuleService: HelloModuleService = req.scope.resolve(\n HELLO_MODULE\n )\n\n res.json({\n message: helloModuleService.getMessage(),\n })\n}\n```\n"
},
{
"path": "medusa/src/modules/fashion/index.ts",
"content": "import { Module } from '@medusajs/framework/utils';\nimport FashionModuleService from './service';\n\nexport const FASHION_MODULE = 'fashionModuleService';\n\nexport default Module(FASHION_MODULE, {\n service: FashionModuleService,\n});\n"
},
{
"path": "medusa/src/modules/fashion/migrations/.snapshot-medusa.json",
"content": "{\n \"namespaces\": [\n \"public\"\n ],\n \"name\": \"public\",\n \"tables\": [\n {\n \"columns\": {\n \"id\": {\n \"name\": \"id\",\n \"type\": \"text\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"mappedType\": \"text\"\n },\n \"name\": {\n \"name\": \"name\",\n \"type\": \"text\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"mappedType\": \"text\"\n },\n \"created_at\": {\n \"name\": \"created_at\",\n \"type\": \"timestamptz\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"length\": 6,\n \"default\": \"now()\",\n \"mappedType\": \"datetime\"\n },\n \"updated_at\": {\n \"name\": \"updated_at\",\n \"type\": \"timestamptz\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"length\": 6,\n \"default\": \"now()\",\n \"mappedType\": \"datetime\"\n },\n \"deleted_at\": {\n \"name\": \"deleted_at\",\n \"type\": \"timestamptz\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": true,\n \"length\": 6,\n \"mappedType\": \"datetime\"\n }\n },\n \"name\": \"material\",\n \"schema\": \"public\",\n \"indexes\": [\n {\n \"keyName\": \"material_pkey\",\n \"columnNames\": [\n \"id\"\n ],\n \"composite\": false,\n \"primary\": true,\n \"unique\": true\n }\n ],\n \"checks\": [],\n \"foreignKeys\": {}\n },\n {\n \"columns\": {\n \"id\": {\n \"name\": \"id\",\n \"type\": \"text\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"mappedType\": \"text\"\n },\n \"name\": {\n \"name\": \"name\",\n \"type\": \"text\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"mappedType\": \"text\"\n },\n \"hex_code\": {\n \"name\": \"hex_code\",\n \"type\": \"text\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"mappedType\": \"text\"\n },\n \"material_id\": {\n \"name\": \"material_id\",\n \"type\": \"text\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"mappedType\": \"text\"\n },\n \"created_at\": {\n \"name\": \"created_at\",\n \"type\": \"timestamptz\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"length\": 6,\n \"default\": \"now()\",\n \"mappedType\": \"datetime\"\n },\n \"updated_at\": {\n \"name\": \"updated_at\",\n \"type\": \"timestamptz\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": false,\n \"length\": 6,\n \"default\": \"now()\",\n \"mappedType\": \"datetime\"\n },\n \"deleted_at\": {\n \"name\": \"deleted_at\",\n \"type\": \"timestamptz\",\n \"unsigned\": false,\n \"autoincrement\": false,\n \"primary\": false,\n \"nullable\": true,\n \"length\": 6,\n \"mappedType\": \"datetime\"\n }\n },\n \"name\": \"color\",\n \"schema\": \"public\",\n \"indexes\": [\n {\n \"keyName\": \"IDX_color_material_id\",\n \"columnNames\": [],\n \"composite\": false,\n \"primary\": false,\n \"unique\": false,\n \"expression\": \"CREATE INDEX IF NOT EXISTS \\\"IDX_color_material_id\\\" ON \\\"color\\\" (material_id) WHERE deleted_at IS NULL\"\n },\n {\n \"keyName\": \"color_pkey\",\n \"columnNames\": [\n \"id\"\n ],\n \"composite\": false,\n \"primary\": true,\n \"unique\": true\n }\n ],\n \"checks\": [],\n \"foreignKeys\": {\n \"color_material_id_foreign\": {\n \"constraintName\": \"color_material_id_foreign\",\n \"columnNames\": [\n \"material_id\"\n ],\n \"localTableName\": \"public.color\",\n \"referencedColumnNames\": [\n \"id\"\n ],\n \"referencedTableName\": \"public.material\",\n \"updateRule\": \"cascade\"\n }\n }\n }\n ]\n}\n"
},
{
"path": "medusa/src/modules/fashion/migrations/Migration20241002190028.ts",
"content": "import { Migration } from '@mikro-orm/migrations';\n\nexport class Migration20241002190028 extends Migration {\n\n async up(): Promise {\n this.addSql('create table if not exists \"material\" (\"id\" text not null, \"name\" text not null, \"created_at\" timestamptz not null default now(), \"updated_at\" timestamptz not null default now(), \"deleted_at\" timestamptz null, constraint \"material_pkey\" primary key (\"id\"));');\n\n this.addSql('create table if not exists \"color\" (\"id\" text not null, \"name\" text not null, \"hex_code\" text not null, \"material_id\" text not null, \"created_at\" timestamptz not null default now(), \"updated_at\" timestamptz not null default now(), \"deleted_at\" timestamptz null, constraint \"color_pkey\" primary key (\"id\"));');\n this.addSql('CREATE INDEX IF NOT EXISTS \"IDX_color_material_id\" ON \"color\" (material_id) WHERE deleted_at IS NULL;');\n\n this.addSql('alter table if exists \"color\" add constraint \"color_material_id_foreign\" foreign key (\"material_id\") references \"material\" (\"id\") on update cascade;');\n }\n\n async down(): Promise {\n this.addSql('alter table if exists \"color\" drop constraint if exists \"color_material_id_foreign\";');\n\n this.addSql('drop table if exists \"material\" cascade;');\n\n this.addSql('drop table if exists \"color\" cascade;');\n }\n\n}\n"
},
{
"path": "medusa/src/modules/fashion/models/color.ts",
"content": "import { model } from '@medusajs/framework/utils';\nimport { InferTypeOf } from '@medusajs/framework/types';\nimport Material from './material';\n\nconst Color = model.define('color', {\n id: model.id().primaryKey(),\n name: model.text(),\n hex_code: model.text(),\n material: model.belongsTo(() => Material, {\n mappedBy: 'colors',\n }),\n});\n\nexport type ColorModelType = InferTypeOf;\n\nexport default Color;\n"
},
{
"path": "medusa/src/modules/fashion/models/material.ts",
"content": "import { model } from '@medusajs/framework/utils';\nimport { InferTypeOf } from '@medusajs/framework/types';\nimport Color from './color';\n\nconst Material = model.define('material', {\n id: model.id().primaryKey(),\n name: model.text(),\n colors: model.hasMany(() => Color),\n});\n\nexport type MaterialModelType = InferTypeOf;\n\nexport default Material;\n"
},
{
"path": "medusa/src/modules/fashion/service.ts",
"content": "import { MedusaService } from '@medusajs/framework/utils';\nimport Material from './models/material';\nimport Color from './models/color';\n\nexport default class FashionModuleService extends MedusaService({\n Material,\n Color,\n}) {}\n"
},
{
"path": "medusa/src/modules/meilisearch/index.ts",
"content": "import { Module } from '@medusajs/utils';\nimport Loader from './loader';\nimport { MeiliSearchService } from './service';\n\nexport default Module('meilisearchService', {\n service: MeiliSearchService,\n loaders: [Loader],\n});\n"
},
{
"path": "medusa/src/modules/meilisearch/loader.ts",
"content": "import { LoaderOptions } from '@medusajs/types';\nimport { MeiliSearchService } from './service';\nimport { MeiliSearchPluginOptions } from './types';\nimport { asValue } from 'awilix';\n\nexport default async ({\n container,\n options,\n}: LoaderOptions): Promise => {\n if (!options) {\n throw new Error('Missing meilisearch configuration');\n }\n\n const meilisearchService: MeiliSearchService = new MeiliSearchService(\n container,\n options,\n );\n\n container.register({\n meilisearchService: asValue(meilisearchService),\n });\n\n if (options.settings) {\n await Promise.all(\n Object.entries(options.settings).map(([indexName, indexSettings]) =>\n meilisearchService.updateSettings(indexName, indexSettings),\n ),\n );\n }\n};\n"
},
{
"path": "medusa/src/modules/meilisearch/service.ts",
"content": "import { SearchTypes } from '@medusajs/types';\nimport { SearchUtils } from '@medusajs/utils';\n// @ts-ignore\nimport { MeiliSearch, MeiliSearchApiError, Settings } from 'meilisearch';\nimport { MeiliSearchPluginOptions } from './types';\nimport { logger } from '@medusajs/framework';\n\nexport class MeiliSearchService extends SearchUtils.AbstractSearchService {\n static identifier = 'meilisearch';\n\n isDefault = false;\n\n protected readonly client: MeiliSearch;\n\n constructor(container: any, options: MeiliSearchPluginOptions) {\n super(container, options);\n\n if (process.env.NODE_ENV !== 'development') {\n if (!options.config?.apiKey) {\n throw Error(\n 'MeiliSearch API key is required for production environments.',\n );\n }\n }\n\n if (!options.config?.host) {\n throw Error(\n 'MeiliSearch host is required. Please provide a host in the configuration.',\n );\n }\n\n this.client = new MeiliSearch(options.config);\n }\n\n async createIndex(\n indexName: string,\n options: Record = { primaryKey: 'id' },\n ) {\n return this.client.createIndex(indexName, options);\n }\n\n getIndex(indexName: string) {\n return this.client.index(indexName);\n }\n\n async addDocuments(\n indexName: string,\n documents: Record[],\n type: string,\n ) {\n const indexSetting = this.options.settings?.[indexName];\n const transformer = indexSetting?.transformer ?? ((doc: any) => doc);\n const primaryKey = indexSetting?.primaryKey ?? 'id';\n\n return this.client\n .index(indexName)\n .addDocuments(documents.map(transformer), { primaryKey });\n }\n\n async replaceDocuments(\n indexName: string,\n documents: Record[],\n type: string,\n ) {\n return this.addDocuments(indexName, documents, type);\n }\n\n async deleteDocument(indexName: string, documentId: string) {\n return this.client.index(indexName).deleteDocument(documentId);\n }\n\n async deleteAllDocuments(indexName: string) {\n return this.client.index(indexName).deleteAllDocuments();\n }\n\n async search(indexName: string, query: string, options: Record) {\n const { paginationOptions, filter, additionalOptions } = options;\n\n return this.client\n .index(indexName)\n .search(query, { filter, ...paginationOptions, ...additionalOptions });\n }\n\n async updateSettings(\n indexName: string,\n settings: SearchTypes.IndexSettings & { indexSettings: Settings },\n ) {\n const indexSettings = settings.indexSettings ?? {};\n\n try {\n await this.client.getIndex(indexName);\n } catch (error) {\n if (\n error instanceof MeiliSearchApiError &&\n error.cause?.code === 'index_not_found'\n ) {\n await this.createIndex(indexName, {\n primaryKey: settings.primaryKey ?? 'id',\n });\n } else {\n logger.error(error);\n throw error;\n }\n }\n\n return this.client.index(indexName).updateSettings(indexSettings);\n }\n}\n"
},
{
"path": "medusa/src/modules/meilisearch/types.ts",
"content": "import { SearchTypes } from '@medusajs/types';\n// @ts-ignore\nimport type { Config, Settings } from 'meilisearch';\n\nexport interface MeiliSearchPluginOptions {\n /**\n * MeiliSearch client configuration\n */\n config: Config;\n\n /**\n * MeiliSearch index settings\n */\n settings?: Record<\n string,\n SearchTypes.IndexSettings & { indexSettings: Settings }\n >;\n}\n"
},
{
"path": "medusa/src/modules/resend/emails/auth-email-confirm.tsx",
"content": "// External packages\nimport { Text, Heading, Button } from '@react-email/components';\n\n// Components\nimport EmailLayout, { EmailLayoutProps } from './components/EmailLayout';\n\nexport default function AuthEmailConfirm({\n ...emailLayoutProps\n}: EmailLayoutProps) {\n return (\n \n \n Verify your email\n \n \n Hey Jovana, thanks for registering for an account on Sofa Society!\n \n \n Before we get started, we just need to confirm that this is you.\n \n \n Verify email\n \n \n );\n}\n"
},
{
"path": "medusa/src/modules/resend/emails/auth-forgot-password.tsx",
"content": "// External components\nimport { Text, Heading, Button } from '@react-email/components';\n\n// Types\nimport { CustomerDTO } from '@medusajs/framework/types';\n\n// Components\nimport EmailLayout, { EmailLayoutProps } from './components/EmailLayout';\n\ntype Props = {\n customer: Pick;\n token: string;\n};\n\nexport default function AuthPasswordForgotResetEmail({\n customer,\n token,\n ...emailLayoutProps\n}: Props & EmailLayoutProps) {\n return (\n \n \n Reset your password\n \n \n We received a request to reset your Sofa Society account password. Click\n below to set a new password:\n \n \n Reset password\n \n \n If you didn't request this change, please ignore this email, and\n your current password will remain unchanged.\n \n \n );\n}\n\nAuthPasswordForgotResetEmail.PreviewProps = {\n customer: {\n id: '1',\n email: 'example@medusa.local',\n first_name: 'John',\n last_name: 'Doe',\n },\n token: '1234567789012345677890',\n} satisfies Props;\n"
},
{
"path": "medusa/src/modules/resend/emails/auth-password-reset.tsx",
"content": "// External components\nimport { Text, Heading, Button } from '@react-email/components';\n\n// Types\nimport { CustomerDTO } from '@medusajs/framework/types';\n\n// Components\nimport EmailLayout, { EmailLayoutProps } from './components/EmailLayout';\n\ntype Props = {\n customer: Pick;\n token: string;\n};\n\nexport default function AuthPasswordResetEmail({\n customer,\n token,\n ...emailLayoutProps\n}: Props & EmailLayoutProps) {\n return (\n \n \n Reset your password\n \n \n We received a request to reset your Sofa Society account password. Click\n below to set a new password:\n \n \n Reset password\n \n \n If you didn't request this change, please ignore this email, and\n your current password will remain unchanged.\n \n \n );\n}\n\nAuthPasswordResetEmail.PreviewProps = {\n customer: {\n id: '1',\n email: 'example@medusa.local',\n first_name: 'John',\n last_name: 'Doe',\n },\n token: '1234567789012345677890',\n} satisfies Props;\n"
},
{
"path": "medusa/src/modules/resend/emails/components/EmailLayout.tsx",
"content": "// External packages\nimport {\n Body,\n Column,\n Container,\n Font,\n Head,\n Hr,\n Html,\n Link,\n Row,\n Section,\n Text,\n Tailwind,\n} from '@react-email/components';\n\n// Google Font API is used to load the Mona Sans font\n// You can find other variants here: https://webfonts.googleapis.com/v1/webfonts?capability=WOFF2&family=Mona%20Sans&subset=latin-ext&key=[YOUR_API_KEY]\n\nexport type EmailLayoutProps = {\n siteTitle?: string;\n companyName?: string;\n footerLinks?: {\n url: string;\n label: string;\n }[];\n};\n\nexport default function EmailLayout(\n props: {\n children: React.ReactNode;\n } & EmailLayoutProps\n) {\n return (\n \n \n \n \n \n \n {props.siteTitle || 'SofaSocietyCo.'}\n \n {props.children}\n \n \n \n \n {props.siteTitle || 'SofaSocietyCo.'}\n \n \n © {new Date().getFullYear()},{' '}\n {props.companyName || 'Sofa Society'}\n \n \n {props.footerLinks && props.footerLinks.length > 0 && (\n \n \n {props.footerLinks.map((link, index) => (\n \n \n ))}\n
\n \n )}\n
\n \n \n \n \n \n );\n}\n"
},
{
"path": "medusa/src/modules/resend/emails/index.ts",
"content": "import AuthPasswordForgotResetEmail from \"./auth-forgot-password\";\nimport AuthPasswordResetEmail from \"./auth-password-reset\";\nimport OrderPlacedEmail from \"./order-placed\";\nimport WelcomeEmail from \"./welcome\";\n\n// TODO: we should be able to use notification data in subjects too\nexport const subjects = {\n \"auth-password-reset\": \"Reset your password\",\n \"order-placed\": \"Your order has been placed\",\n \"customer-welcome\": \"Welcome to Sofa Society!\",\n \"auth-forgot-password\": \"Reset your password\",\n};\n\nexport default {\n \"auth-password-reset\": AuthPasswordResetEmail,\n \"order-placed\": OrderPlacedEmail,\n \"customer-welcome\": WelcomeEmail,\n \"auth-forgot-password\": AuthPasswordForgotResetEmail,\n};\n"
},
{
"path": "medusa/src/modules/resend/emails/order-placed.tsx",
"content": "// External packages\nimport { Fragment } from 'react';\nimport {\n Text,\n Column,\n Heading,\n Img,\n Row,\n Section,\n Link,\n Hr,\n} from '@react-email/components';\nimport { HttpTypes } from '@medusajs/framework/types';\nimport EmailLayout, { EmailLayoutProps } from './components/EmailLayout';\n\nexport type OrderPlacedEmailProps = {\n order: Pick<\n HttpTypes.AdminOrder,\n | 'currency_code'\n | 'email'\n | 'shipping_total'\n | 'subtotal'\n | 'total'\n | 'tax_total'\n > & {\n shipping_address:\n | (Pick<\n HttpTypes.AdminOrderAddress,\n | 'first_name'\n | 'last_name'\n | 'address_1'\n | 'address_2'\n | 'city'\n | 'postal_code'\n | 'province'\n | 'phone'\n > & {\n country?: Pick<\n HttpTypes.AdminRegionCountry,\n 'iso_2' | 'name' | 'display_name'\n >;\n })\n | null;\n billing_address:\n | (Pick<\n HttpTypes.AdminOrderAddress,\n | 'first_name'\n | 'last_name'\n | 'address_1'\n | 'address_2'\n | 'city'\n | 'postal_code'\n | 'province'\n | 'phone'\n > & {\n country?: Pick<\n HttpTypes.AdminRegionCountry,\n 'iso_2' | 'name' | 'display_name'\n >;\n })\n | null;\n items: Pick<\n HttpTypes.AdminOrder['items'][number],\n | 'id'\n | 'thumbnail'\n | 'product_title'\n | 'variant_title'\n | 'total'\n | 'quantity'\n | 'variant_option_values'\n >[];\n };\n} & EmailLayoutProps;\n\nexport default function OrderPlacedEmail({\n order,\n ...emailLayoutProps\n}: OrderPlacedEmailProps) {\n const formatter = new Intl.NumberFormat([], {\n style: 'currency',\n currencyDisplay: 'narrowSymbol',\n currency: order.currency_code,\n });\n\n return (\n \n \n Order confirmation\n \n \n We are pleased to confirm that your order has been successfully placed\n and will be processed shortly. Your order number is #100002.\n \n \n You'll receive another update once your order is shipped. For any\n questions, feel free to contact us at info@sofasociety.com.\n \n Thank you for shopping with us! \n \n \n \n \n Delivery Address\n \n \n {[\n order.shipping_address.first_name,\n order.shipping_address.last_name,\n ]\n .filter(Boolean)\n .join(' ')}\n \n \n {[\n order.shipping_address.address_1,\n order.shipping_address.address_2,\n [\n order.shipping_address.postal_code,\n order.shipping_address.city,\n ]\n .filter(Boolean)\n .join(' '),\n order.shipping_address.province,\n order.shipping_address.country.display_name,\n ]\n .filter(Boolean)\n .join(', ')}\n \n {order.shipping_address.phone && (\n \n {order.shipping_address.phone}\n \n )}\n \n \n \n Billing Address\n \n \n {[\n order.billing_address.first_name,\n order.billing_address.last_name,\n ]\n .filter(Boolean)\n .join(' ')}\n \n \n {[\n order.billing_address.address_1,\n order.billing_address.address_2,\n [order.billing_address.postal_code, order.billing_address.city]\n .filter(Boolean)\n .join(' '),\n order.billing_address.province,\n order.billing_address.country.display_name,\n ]\n .filter(Boolean)\n .join(', ')}\n \n {order.billing_address.phone && (\n \n {order.billing_address.phone}\n \n )}\n \n
\n \n \n {order.items.map((item, index) => {\n return (\n \n {index > 0 && (\n \n \n {!!item.thumbnail && (\n \n \n \n {item.product_title}\n \n \n {Object.entries(item.variant_option_values).flatMap(\n ([key, value]) =>\n typeof value === 'string' ? (\n \n \n \n {key}:\n \n {value} \n \n
\n ) : (\n []\n ),\n )}\n \n \n \n Quantity:\n \n \n {item.quantity}\n \n \n
\n \n \n \n \n {formatter.format(item.total)}\n \n \n
\n \n );\n })}\n \n \n \n \n Payment \n \n \n \n \n \n \n Subtotal\n \n \n {formatter.format(order.subtotal)}\n \n \n
\n \n \n \n Shipping\n \n \n {formatter.format(order.shipping_total)}\n \n \n
\n \n \n Total \n \n {formatter.format(order.total)}\n \n \n
\n \n \n \n Including\n \n \n {formatter.format(order.tax_total)} tax\n \n \n
\n \n \n
\n \n \n );\n}\n\nOrderPlacedEmail.PreviewProps = {\n order: {\n currency_code: 'EUR',\n email: 'example@medusa.local',\n shipping_address: {\n first_name: 'John',\n last_name: 'Doe',\n address_1: '1234 Main St',\n address_2: 'Apt 1',\n city: 'Los Angeles',\n postal_code: '90001',\n country: {\n iso_2: 'US',\n name: 'United States',\n display_name: 'United States',\n },\n phone: '+1 123 456 7890',\n province: 'California',\n },\n billing_address: {\n first_name: 'John',\n last_name: 'Doe',\n address_1: '1234 Main St',\n address_2: 'Apt 1',\n city: 'Los Angeles',\n postal_code: '90001',\n country: {\n iso_2: 'US',\n name: 'United States',\n display_name: 'United States',\n },\n phone: '+1 123 456 7890',\n province: 'California',\n },\n items: [\n {\n id: '1',\n thumbnail:\n 'https://fashion-starter-demo.s3.eu-central-1.amazonaws.com/belime-estate-01JAR3JYD68D1YYR0BN7HHMAZE.png',\n product_title: 'Belime Estate',\n variant_title: 'Linen / Red',\n total: 1500,\n quantity: 1,\n variant_option_values: {\n Material: 'Linen',\n Color: 'Red',\n },\n },\n ],\n shipping_total: 100,\n subtotal: 1400,\n total: 1500,\n tax_total: 100,\n },\n} satisfies OrderPlacedEmailProps;\n"
},
{
"path": "medusa/src/modules/resend/emails/order-update.tsx",
"content": "// External packages\nimport { Text, Heading, Button } from '@react-email/components';\n\n// Types\nimport { CustomerDTO, OrderDTO } from '@medusajs/framework/types';\n\n// Components\nimport EmailLayout, { EmailLayoutProps } from './components/EmailLayout';\n\ntype Props = {\n customer: Pick;\n order: Pick;\n};\n\nexport default function OrderUpdateEmail({\n customer,\n order,\n ...emailLayoutProps\n}: Props & EmailLayoutProps) {\n return (\n \n \n Shipping update\n \n \n Great news! Your order #{order.display_id} is now on its way to you.\n \n \n You can track your package by clicking below:\n \n \n Order details\n \n \n Thank you for choosing Sofa Society. We're excited for your new\n sofa to find its home with you!\n \n \n );\n}\n\nOrderUpdateEmail.PreviewProps = {\n customer: {\n id: '1',\n email: 'example@medusa.local',\n first_name: 'John',\n last_name: 'Doe',\n },\n order: {\n id: 'order_01JCNYH6VADAK90W7CBSPV5BT6',\n display_id: 1,\n },\n} satisfies Props;\n"
},
{
"path": "medusa/src/modules/resend/emails/welcome.tsx",
"content": "// External packages\nimport { Text, Heading, Row, Column } from '@react-email/components';\nimport { CustomerDTO } from '@medusajs/framework/types';\n\n// Components\nimport EmailLayout, { EmailLayoutProps } from './components/EmailLayout';\n\nconst UnorderedList: React.FC<{\n children?: React.ReactNode;\n className?: string;\n}> = ({ children, className }) => {\n return (\n \n {children} \n
\n );\n};\n\nconst UnorderedListItem: React.FC<{\n children?: React.ReactNode;\n className?: string;\n textClassName?: string;\n}> = ({ children, className, textClassName }) => {\n return (\n \n \n {children} \n \n \n );\n};\n\ntype Props = {\n customer: Pick;\n};\n\nexport default function WelcomeEmail({\n customer,\n ...emailLayoutProps\n}: Props & EmailLayoutProps) {\n return (\n \n \n Welcome to Sofa Society!\n \n \n Welcome to Sofa Society! We're excited to have you join our community of\n comfort enthusiasts. With our carefully crafted sofas, you're just\n steps away from adding elegance and coziness to your living space.\n \n \n As a new member, here's what you can expect:\n \n \n \n Premium, high-quality sofas in a range of styles and materials\n \n \n Dedicated customer support ready to assist you\n \n \n Exclusive offers and early access to new collections\n \n \n Explore our collections and find the sofa that suits your style!\n \n \n \n Best wishes,\n \n \n );\n}\n\nWelcomeEmail.PreviewProps = {\n customer: {\n id: '1',\n email: 'example@medusa.local',\n first_name: 'John',\n last_name: 'Doe',\n },\n} satisfies Props;\n"
},
{
"path": "medusa/src/modules/resend/index.ts",
"content": "import { ModuleProvider, Modules } from '@medusajs/framework/utils';\nimport ResendNotificationProviderService from './service';\n\nexport default ModuleProvider(Modules.NOTIFICATION, {\n services: [ResendNotificationProviderService],\n});\n"
},
{
"path": "medusa/src/modules/resend/service.tsx",
"content": "import { AbstractNotificationProviderService } from '@medusajs/framework/utils';\nimport { Logger } from '@medusajs/medusa';\nimport {\n ProviderSendNotificationDTO,\n ProviderSendNotificationResultsDTO,\n} from '@medusajs/types';\nimport { Resend } from 'resend';\nimport emails, { subjects } from './emails';\nimport type { EmailLayoutProps } from './emails/components/EmailLayout';\n\ntype InjectedDependencies = {\n logger: Logger;\n};\n\nexport default class ResendNotificationProviderService extends AbstractNotificationProviderService {\n public static identifier = 'resend';\n private resendClient: Resend;\n private from: string;\n private layoutOptions?: EmailLayoutProps;\n private logger: Logger;\n\n constructor({ logger }: InjectedDependencies, options: unknown) {\n super();\n\n if (\n typeof options !== 'object' ||\n options === null ||\n !('api_key' in options) ||\n typeof options.api_key !== 'string' ||\n !('from' in options) ||\n typeof options.from !== 'string'\n ) {\n throw new Error(\n `Invalid options provided to Resend module. Expected { api_key: string, from: string }`,\n );\n }\n\n const layoutOptions: EmailLayoutProps = {};\n\n if ('siteTitle' in options && typeof options.siteTitle === 'string') {\n layoutOptions.siteTitle = options.siteTitle;\n }\n\n if ('companyName' in options && typeof options.companyName === 'string') {\n layoutOptions.companyName = options.companyName;\n }\n\n if ('footerLinks' in options) {\n if (\n !Array.isArray(options.footerLinks) ||\n !options.footerLinks.every(\n (l) => typeof l.url === 'string' && typeof l.label === 'string',\n )\n ) {\n this.logger.warn(\n `Invalid footer links provided to Resend module. Expected an array of { url: string, label: string } objects.`,\n );\n } else {\n layoutOptions.footerLinks = options.footerLinks;\n }\n }\n\n this.resendClient = new Resend(options.api_key);\n this.from = options.from;\n this.logger = logger;\n this.layoutOptions = layoutOptions;\n }\n\n async send(\n notification: ProviderSendNotificationDTO,\n ): Promise {\n const Template = emails[notification.template];\n const subject = subjects[notification.template] || '';\n\n if (!Template) {\n this.logger.error(\n `Couldn't find an email template for ${\n notification.template\n }. The valid options are ${Object.keys(emails).join(', ')}`,\n );\n return {};\n }\n\n if (!subject) {\n this.logger.warn(\n `No subject found for template ${notification.template}. Please add a subject to the emails file.`,\n );\n }\n\n const { data, error } = await this.resendClient.emails.send({\n from: this.from,\n to: [notification.to],\n subject,\n react: ;\n\n await notificationModuleService.createNotifications({\n to: customer.email,\n channel: \"email\",\n template:\n data.actor_type === \"logged-in-customer\"\n ? \"auth-password-reset\"\n : \"auth-forgot-password\",\n data: { customer, token: data.token },\n });\n}\n\nexport const config: SubscriberConfig = {\n event: \"auth.password_reset\",\n};\n"
},
{
"path": "medusa/src/subscribers/customer-welcome-notification.ts",
"content": "import type { SubscriberArgs, SubscriberConfig } from '@medusajs/medusa';\nimport { ContainerRegistrationKeys, Modules } from '@medusajs/framework/utils';\nimport type { CustomerDTO } from '@medusajs/framework/types';\n\nexport default async function sendCustomerWelcomeNotification({\n event: { data },\n container,\n}: SubscriberArgs<{ id: string }>) {\n const query = container.resolve(ContainerRegistrationKeys.QUERY);\n const notificationModuleService = container.resolve(Modules.NOTIFICATION);\n\n const fields = [\n 'id',\n 'email',\n 'first_name',\n 'last_name',\n ] as const satisfies (keyof CustomerDTO)[];\n\n const { data: customers } = await query.graph({\n entity: 'customer',\n fields,\n filters: { id: data.id },\n });\n\n const customer = customers[0] as Pick;\n\n await notificationModuleService.createNotifications({\n to: customer.email,\n channel: 'email',\n template: 'customer-welcome',\n data: { customer },\n });\n}\n\nexport const config: SubscriberConfig = {\n event: 'customer.welcome',\n};\n"
},
{
"path": "medusa/src/subscribers/index-products.ts",
"content": "import type { SubscriberArgs, SubscriberConfig } from '@medusajs/medusa';\nimport { Modules } from '@medusajs/framework/utils';\nimport { ISearchService } from '@medusajs/framework/types';\n\nexport default async function indexProductHandler({\n event: { data, name },\n container,\n}: SubscriberArgs<{ id: string }>) {\n const productId = data.id;\n\n const logger = container.resolve('logger');\n const productModuleService = container.resolve(Modules.PRODUCT);\n const meilisearchService = container.resolve(\n 'meilisearchService',\n ) as ISearchService;\n\n if (name === 'product.deleted') {\n await meilisearchService.deleteDocument('products', productId);\n logger.info(`The product ${productId} was deleted from MeiliSearch`);\n return;\n }\n\n const product = await productModuleService.retrieveProduct(productId, {\n relations: ['variants', 'options', 'tags', 'collection', 'type', 'images', 'categories'],\n });\n\n if (name === 'product.updated') {\n await meilisearchService.replaceDocuments(\n 'products',\n [product],\n 'products',\n );\n logger.info(\n `The product ${productId} ${product.title} was updated in MeiliSearch`,\n );\n return;\n }\n\n await meilisearchService.addDocuments('products', [product], 'products');\n logger.info(\n `The product ${productId} ${product.title} was added to MeiliSearch`,\n );\n}\n\nexport const config: SubscriberConfig = {\n event: ['product.created', 'product.updated', 'product.deleted'],\n};\n"
},
{
"path": "medusa/src/subscribers/order-placed-notification.ts",
"content": "import type { SubscriberArgs, SubscriberConfig } from '@medusajs/medusa';\nimport {\n ContainerRegistrationKeys,\n MathBN,\n Modules,\n} from '@medusajs/framework/utils';\nimport type { OrderPlacedEmailProps } from '../modules/resend/emails/order-placed';\n\ntype Country = {\n iso_2: string;\n name: string;\n display_name: string;\n};\n\ntype MathBNInput = Parameters[0];\n\nconst toNumber = (value: MathBNInput | null | undefined): number =>\n MathBN.convert(value ?? 0).toNumber();\n\nconst buildVariantOptionValues = (item: {\n variant_option_values?: Record;\n variant?: { options?: unknown[] };\n}): Record => {\n if (\n item.variant_option_values &&\n Object.keys(item.variant_option_values).length\n ) {\n return Object.entries(item.variant_option_values).reduce<\n Record\n >((acc, [key, value]) => {\n if (typeof value === 'string') {\n acc[key] = value;\n }\n return acc;\n }, {});\n }\n\n return (\n item.variant?.options?.reduce>((acc, option) => {\n if (!option || typeof option !== 'object') {\n return acc;\n }\n\n const optionRecord = option as Record;\n const optionObject = optionRecord.option;\n const optionTitle =\n optionObject && typeof optionObject === 'object'\n ? (optionObject as Record).title\n : undefined;\n const optionValue = optionRecord.value;\n\n if (typeof optionTitle === 'string' && typeof optionValue === 'string') {\n acc[optionTitle] = optionValue;\n }\n\n return acc;\n }, {}) ?? {}\n );\n};\n\nexport default async function sendOrderConfirmationHandler({\n event: { data },\n container,\n}: SubscriberArgs<{ id: string }>) {\n const query = container.resolve(ContainerRegistrationKeys.QUERY);\n const notificationModuleService = container.resolve(Modules.NOTIFICATION);\n\n const {\n data: [order],\n } = await query.graph({\n entity: 'order',\n fields: [\n 'id',\n 'currency_code',\n 'total',\n 'subtotal',\n 'tax_total',\n 'discount_total',\n 'discount_tax_total',\n 'original_total',\n 'original_tax_total',\n 'item_total',\n 'item_subtotal',\n 'item_tax_total',\n 'original_item_total',\n 'original_item_subtotal',\n 'original_item_tax_total',\n 'shipping_total',\n 'shipping_subtotal',\n 'shipping_tax_total',\n 'original_shipping_tax_total',\n 'original_shipping_subtotal',\n 'original_shipping_total',\n 'email',\n 'shipping_address.*',\n 'billing_address.*',\n 'customer_id',\n 'items.*',\n 'items.variant.options.value',\n 'items.variant.options.option.title',\n 'summary.*',\n ],\n filters: { id: data.id },\n });\n\n if (!order || !order.email) {\n return;\n }\n\n const countryCodes = [\n order.shipping_address?.country_code,\n order.billing_address?.country_code,\n ].filter(Boolean);\n\n const countryMap: Map = new Map();\n\n if (countryCodes.length > 0) {\n const { data: countries } = await query.graph({\n entity: 'country',\n fields: ['iso_2', 'name', 'display_name'],\n filters: {\n iso_2: countryCodes,\n },\n });\n\n countries.forEach((country) => {\n countryMap.set(country.iso_2, {\n iso_2: country.iso_2,\n name: country.name,\n display_name: country.display_name,\n });\n });\n }\n\n const getFallbackCountry = (countryCode: string): Country => ({\n iso_2: countryCode,\n name: countryCode.toUpperCase(),\n display_name: countryCode.toUpperCase(),\n });\n\n const shippingAddressForEmail = order.shipping_address\n ? {\n ...order.shipping_address,\n country: order.shipping_address.country_code\n ? (countryMap.get(order.shipping_address.country_code) ??\n getFallbackCountry(order.shipping_address.country_code))\n : undefined,\n }\n : order.shipping_address;\n\n const billingAddressForEmail = order.billing_address\n ? {\n ...order.billing_address,\n country: order.billing_address.country_code\n ? (countryMap.get(order.billing_address.country_code) ??\n getFallbackCountry(order.billing_address.country_code))\n : undefined,\n }\n : order.billing_address;\n\n const transformedItems = order.items.map((item) => ({\n id: item.id,\n quantity: Math.trunc(toNumber(item.quantity)),\n total: toNumber(item.total),\n thumbnail:\n item.thumbnail ??\n item.product.thumbnail ??\n item.product.images?.[0]?.url ??\n null,\n product_title: item.product_title ?? '',\n variant_title: item.variant_title ?? '',\n variant_option_values: buildVariantOptionValues(item),\n }));\n\n const orderForEmail = {\n ...order,\n subtotal: toNumber(order.subtotal),\n shipping_total: toNumber(order.shipping_total),\n total: toNumber(order.total),\n tax_total: toNumber(order.tax_total),\n shipping_address: shippingAddressForEmail,\n billing_address: billingAddressForEmail,\n items: transformedItems,\n };\n\n await notificationModuleService.createNotifications({\n to: order.email,\n channel: 'email',\n template: 'order-placed',\n data: { order: orderForEmail } satisfies OrderPlacedEmailProps,\n });\n}\n\nexport const config: SubscriberConfig = {\n event: 'order.placed',\n};\n"
},
{
"path": "medusa/src/workflows/README.md",
"content": "# Custom Workflows\n\nA workflow is a series of queries and actions that complete a task.\n\nThe workflow is created in a TypeScript or JavaScript file under the `src/workflows` directory.\n\nFor example:\n\n```ts\nimport { \n createStep,\n createWorkflow,\n StepResponse,\n} from \"@medusajs/framework/workflows-sdk\"\n\nconst step1 = createStep(\"step-1\", async () => {\n return new StepResponse(`Hello from step one!`)\n})\n\ntype WorkflowInput = {\n name: string\n}\n\nconst step2 = createStep(\n \"step-2\",\n async ({ name }: WorkflowInput) => {\n return new StepResponse(`Hello ${name} from step two!`)\n }\n)\n\ntype WorkflowOutput = {\n message: string\n}\n\nconst myWorkflow = createWorkflow<\n WorkflowInput,\n WorkflowOutput\n>(\"hello-world\", function (input) {\n const str1 = step1()\n // to pass input\n step2(input)\n\n return {\n message: str1,\n }\n})\n\nexport default myWorkflow\n```\n\n## Execute Workflow\n\nYou can execute the workflow from other resources, such as API routes, scheduled jobs, or subscribers.\n\nFor example, to execute the workflow in an API route:\n\n```ts\nimport type {\n MedusaRequest,\n MedusaResponse,\n} from \"@medusajs/medusa\"\nimport myWorkflow from \"../../../workflows/hello-world\"\n\nexport async function GET(\n req: MedusaRequest,\n res: MedusaResponse\n) {\n const { result } = await myWorkflow(req.scope)\n .run({\n input: {\n name: req.query.name as string,\n },\n })\n\n res.send(result)\n}\n```\n"
},
{
"path": "medusa/src/workflows/emit-customer-welcome-event.ts",
"content": "import {\n createWorkflow,\n WorkflowResponse,\n} from '@medusajs/framework/workflows-sdk';\nimport { emitEventStep } from '@medusajs/medusa/core-flows';\n\nconst emitCustomerWelcomeEvent = createWorkflow(\n 'emit-customer-welcome-event',\n function (input: { id: string }) {\n emitEventStep({\n eventName: 'customer.welcome',\n data: {\n id: input.id,\n },\n });\n\n return new WorkflowResponse({ id: input.id });\n },\n);\n\nexport default emitCustomerWelcomeEvent;\n"
},
{
"path": "medusa/src/workflows/index-products.ts",
"content": "import {\n createStep,\n createWorkflow,\n StepResponse,\n WorkflowResponse,\n} from '@medusajs/framework/workflows-sdk';\nimport { Modules } from '@medusajs/framework/utils';\nimport { ISearchService, ProductDTO } from '@medusajs/framework/types';\n\nconst retrieveProductsStep = createStep(\n {\n name: 'retrieveProductsStep',\n },\n async (input: undefined, context) => {\n const productModuleService = context.container.resolve(Modules.PRODUCT);\n\n const products = await productModuleService.listProducts(undefined, {\n relations: [\n 'variants',\n 'options',\n 'tags',\n 'collection',\n 'type',\n 'images',\n ],\n });\n\n return new StepResponse(products);\n },\n);\n\nconst indexProductsStep = createStep(\n {\n name: 'indexProductsStep',\n },\n async (input: ProductDTO[], context) => {\n const meilisearchService = context.container.resolve(\n 'meilisearchService',\n ) as ISearchService;\n const result = await meilisearchService.addDocuments(\n 'products',\n input,\n 'products',\n );\n return new StepResponse(result);\n },\n);\n\nexport const indexProductsWorkflow = createWorkflow(\n {\n name: 'indexProducts',\n idempotent: true,\n retentionTime: 60 * 60 * 24 * 3, // 3 days\n store: true,\n },\n () => {\n const products = retrieveProductsStep();\n const result = indexProductsStep(products);\n\n return new WorkflowResponse(result);\n },\n);\n"
},
{
"path": "medusa/tsconfig.json",
"content": "{\n \"compilerOptions\": {\n \"lib\": [\"es2021\"],\n \"target\": \"es2021\",\n \"allowJs\": true,\n \"esModuleInterop\": true,\n \"module\": \"Node16\",\n \"moduleResolution\": \"Node16\",\n \"emitDecoratorMetadata\": true,\n \"experimentalDecorators\": true,\n \"skipLibCheck\": true,\n \"skipDefaultLibCheck\": true,\n \"declaration\": false,\n \"sourceMap\": false,\n \"outDir\": \"./.medusa/server\",\n \"rootDir\": \"./\",\n \"baseUrl\": \".\",\n \"jsx\": \"react-jsx\",\n \"forceConsistentCasingInFileNames\": true,\n \"resolveJsonModule\": true,\n \"checkJs\": false\n },\n \"ts-node\": {\n \"swc\": true\n },\n \"include\": [\"**/*\", \".medusa/types/*\"],\n \"exclude\": [\n \"**/__tests__\",\n \"**/__fixtures__\",\n \"node_modules\",\n \".medusa/server\",\n \".medusa/admin\",\n \".cache\"\n ]\n}\n"
},
{
"path": "storefront/.github/scripts/medusa-config.js",
"content": "const { defineConfig, loadEnv } = require(\"@medusajs/utils\")\n\nloadEnv(process.env.NODE_ENV || \"development\", process.cwd())\n\n// CORS when consuming Medusa from admin\n// Medusa's docs are added for a better learning experience. Feel free to remove.\nconst ADMIN_CORS = `${\n process.env.ADMIN_CORS?.length\n ? `${process.env.ADMIN_CORS},`\n : \"http://localhost:7000,http://localhost:7001,\"\n}https://docs.medusajs.com,https://medusa-docs-v2-git-docs-v2-medusajs.vercel.app,https://medusa-resources-git-docs-v2-medusajs.vercel.app`\n\n// CORS to avoid issues when consuming Medusa from a client\n// Medusa's docs are added for a better learning experience. Feel free to remove.\nconst STORE_CORS = `${\n process.env.STORE_CORS?.length\n ? `${process.env.STORE_CORS},`\n : \"http://localhost:8000,\"\n}https://docs.medusajs.com,https://medusa-docs-v2-git-docs-v2-medusajs.vercel.app,https://medusa-resources-git-docs-v2-medusajs.vercel.app`\n\nconst DATABASE_URL =\n process.env.DATABASE_URL || \"postgres://medusa:password@localhost/medusa\"\n\nconst REDIS_URL = process.env.REDIS_URL || \"redis://localhost:6379\"\n\nexport default defineConfig({\n plugins: [\n `medusa-fulfillment-manual`,\n `medusa-payment-manual`,\n {\n resolve: `@medusajs/file-local`,\n options: {\n upload_dir: \"uploads\",\n },\n },\n {\n resolve: `medusa-plugin-meilisearch`,\n options: {\n config: {\n host: process.env.MEILISEARCH_HOST,\n apiKey: process.env.MEILISEARCH_API_KEY,\n },\n settings: {\n products: {\n indexSettings: {\n searchableAttributes: [\"title\", \"description\", \"variant_sku\"],\n displayedAttributes: [\n \"id\",\n \"title\",\n \"description\",\n \"variant_sku\",\n \"thumbnail\",\n \"handle\",\n ],\n },\n primaryKey: \"id\",\n },\n },\n },\n },\n ],\n admin: {\n backendUrl: \"http://localhost:9000\",\n },\n projectConfig: {\n databaseUrl: DATABASE_URL,\n http: {\n storeCors: STORE_CORS,\n adminCors: ADMIN_CORS,\n authCors: process.env.AUTH_CORS || ADMIN_CORS,\n jwtSecret: process.env.JWT_SECRET || \"supersecret\",\n cookieSecret: process.env.COOKIE_SECRET || \"supersecret\",\n },\n redisUrl: REDIS_URL,\n },\n})\n"
},
{
"path": "storefront/.github/workflows/test-e2e.yaml",
"content": "name: Medusa NextJS Template Tests\n\non:\n push:\n branches:\n - main\n pull_request:\n workflow_dispatch:\n\nenv:\n PGHOST: localhost\n PGPORT: 5432\n PGUSER: postgres\n PGPASSWORD: password\n PGDATABASE: postgres\n\n TEST_POSTGRES_USER: test_medusa_user\n TEST_POSTGRES_PASSWORD: password\n TEST_POSTGRES_DATABASE: test_medusa_db\n TEST_POSTGRES_DATABASE_TEMPLATE: test_medusa_db_template\n TEST_POSTGRES_HOST: localhost\n TEST_POSTGREST_PORT: 5432\n PRODUCTION_POSTGRES_DATABASE: medusa_db\n CLIENT_SERVER: http://localhost:9000\n\n JWT_SECRET: something\n COOKIE_SECRET: something\n\n DATABASE_TYPE: \"postgres\"\n REDIS_URL: redis://localhost:6379\n DATABASE_URL: postgres://test_medusa_user:password@localhost/test_medusa_db\n MEILISEARCH_HOST: http://localhost:7700\n MEILISEARCH_API_KEY: meili_api_key\n\n NEXT_PUBLIC_BASE_URL: http://localhost:8000\n NEXT_PUBLIC_DEFAULT_REGION: us\n NEXT_PUBLIC_MEDUSA_BACKEND_URL: http://localhost:9000\n NEXT_PUBLIC_INDEX_NAME: products\n NEXT_PUBLIC_SEARCH_ENDPOINT: http://127.0.0.1:7700\n NEXT_PUBLIC_SEARCH_API_KEY: meili_api_key\n REVALIDATE_SECRET: supersecret\n\njobs:\n e2e-test-runner:\n timeout-minutes: 20\n runs-on:\n - ubuntu-latest\n services:\n postgres:\n image: postgres:latest\n env:\n POSTGRES_USER: postgres\n POSTGRES_PASSWORD: password\n POSTGRES_DB: test\n ports:\n - 5432:5432\n options: >-\n --health-cmd pg_isready\n --health-interval 10s\n --health-timeout 5s\n --health-retries 5\n\n meilisearch:\n image: getmeili/meilisearch:v1.7\n env:\n MEILI_MASTER_KEY: meili_api_key\n MEILI_ENV: development\n ports:\n - 7700:7700\n options: >-\n --health-cmd \"curl --fail http://localhost:7700/health\"\n --health-interval 10s\n --health-timeout 5s\n --health-retries 5\n\n redis:\n image: redis:latest\n ports:\n - 6379:6379\n options: >-\n --health-cmd \"redis-cli ping\"\n --health-interval 10s\n --health-timeout 5s\n --health-retries 5\n steps:\n - uses: actions/checkout@v2\n\n - name: Use Node.js\n uses: actions/setup-node@v3\n with:\n node-version: \"20\"\n\n - name: Initialize PostgreSQL\n run: |\n echo \"Initializing Databases\"\n psql -h localhost -U postgres -d test -c \"CREATE USER ${{ env.TEST_POSTGRES_USER }} WITH PASSWORD '${{ env.TEST_POSTGRES_PASSWORD }}';\"\n psql -h localhost -U postgres -d test -c \"CREATE DATABASE ${{ env.TEST_POSTGRES_DATABASE }} OWNER ${{ env.TEST_POSTGRES_USER }};\"\n\n - name: Install Medusa CLI\n run: npm install @medusajs/medusa-cli@preview -g\n - name: Setup medusa backend server\n working-directory: ../\n # https://docs.medusajs.com/cli/reference#options\n run: |\n medusa new backend \\\n -y \\\n --v2 \\\n --branch feat/v2 \\\n --skip-db \\\n --skip-migrations \\\n --skip-env \\\n --db-user ${{ env.TEST_POSTGRES_USER }} \\\n --db-pass ${{ env.TEST_POSTGRES_PASSWORD }} \\\n --db-database ${{ env.TEST_POSTGRES_DATABASE }} \\\n --db-host ${{ env.TEST_POSTGRES_HOST }} \\\n --db-port ${{ env.TEST_POSTGREST_PORT }}\n\n - name: Setup search in the backend\n working-directory: ../backend\n run: yarn add medusa-plugin-meilisearch\n\n - name: Move custom medusa config to the backend\n run: cp .github/scripts/medusa-config.js ../backend/medusa-config.js\n\n - name: Seed data from default seed file\n working-directory: ../backend\n run: medusa seed --seed-file=data/seed.json\n\n - name: Run backend server\n working-directory: ../backend\n run: medusa develop\n\n - name: Install packages\n run: yarn install -y\n\n - name: Install playwright\n run: yarn playwright install --with-deps\n\n - name: Setup frontend\n run: yarn build\n\n - name: Run Tests\n run: yarn test-e2e\n\n - uses: actions/upload-artifact@v3\n if: always()\n with:\n name: playwright-report\n path: test-results\n retention-days: 30\n"
},
{
"path": "storefront/.gitignore",
"content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# IDEs\n.idea\n.vscode\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# next.js\n/.next/\n/out/\n\n# production\n/build\n\n# misc\n.DS_Store\n*.pem\n\n# debug\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n.pnpm-debug.log*\n\n# local env files\n.env\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\n# vercel\n.vercel\n\n# typescript\n*.tsbuildinfo\nnode_modules\n\n.swc\ndump.rdb\n/test-results/\n/playwright-report/\n/blob-report/\n/playwright/.cache/\n/test-results/\n/playwright-report/\n/blob-report/\n/playwright/.cache/\n/playwright/.auth\n"
},
{
"path": "storefront/.prettierrc",
"content": "{\n \"arrowParens\": \"always\",\n \"semi\": false,\n \"endOfLine\": \"auto\",\n \"singleQuote\": false,\n \"tabWidth\": 2,\n \"trailingComma\": \"es5\"\n}\n"
},
{
"path": "storefront/.yarnrc.yml",
"content": "nodeLinker: node-modules\n"
},
{
"path": "storefront/LICENSE",
"content": "MIT License\n\nCopyright (c) 2022 Medusa\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
},
{
"path": "storefront/README.md",
"content": "\n \n \n \n \n \n \n
\n\n\n Medusa Next.js Starter Template\n \n\n\nCombine Medusa's modules for your commerce backend with the newest Next.js 14 features for a performant storefront.
\n\n\n \n \n \n \n \n \n
\n\n### Prerequisites\n\nTo use the [Next.js Starter Template](https://medusajs.com/nextjs-commerce/), you should have a Medusa server running locally on port 9000.\nFor a quick setup, run:\n\n```shell\nnpx create-medusa-app@latest\n```\n\nCheck out [create-medusa-app docs](https://docs.medusajs.com/create-medusa-app) for more details and troubleshooting.\n\n# Overview\n\nThe Medusa Next.js Starter is built with:\n\n- [Next.js](https://nextjs.org/)\n- [Tailwind CSS](https://tailwindcss.com/)\n- [Typescript](https://www.typescriptlang.org/)\n- [Medusa](https://medusajs.com/)\n\nFeatures include:\n\n- Full ecommerce support:\n - Product Detail Page\n - Product Overview Page\n - Search with Algolia / MeiliSearch\n - Product Collections\n - Cart\n - Checkout with PayPal and Stripe\n - User Accounts\n - Order Details\n- Full Next.js 14 support:\n - App Router\n - Next fetching/caching\n - Server Components\n - Server Actions\n - Streaming\n - Static Pre-Rendering\n\n\n# Quickstart\n\n### Setting up the environment variables\n\nNavigate into your projects directory and get your environment variables ready:\n\n```shell\ncd nextjs-starter-medusa/\nmv .env.template .env.local\n```\n\n### Install dependencies\n\nUse Yarn to install all dependencies.\n\n```shell\nyarn\n```\n\n### Start developing\n\nYou are now ready to start up your project.\n\n```shell\nyarn dev\n```\n\n### Open the code and start customizing\n\nYour site is now running at http://localhost:8000!\n\n# Payment integrations\n\nBy default this starter supports the following payment integrations\n\n- [Stripe](https://stripe.com/)\n- [Paypal](https://www.paypal.com/)\n\nTo enable the integrations you need to add the following to your `.env.local` file:\n\n```shell\nNEXT_PUBLIC_STRIPE_KEY=\nNEXT_PUBLIC_PAYPAL_CLIENT_ID=\n```\n\nYou will also need to setup the integrations in your Medusa server. See the [Medusa documentation](https://docs.medusajs.com) for more information on how to configure [Stripe](https://docs.medusajs.com/add-plugins/stripe) and [PayPal](https://docs.medusajs.com/add-plugins/paypal) in your Medusa project.\n\n# Search integration\n\nThis starter is configured to support using the `medusa-search-meilisearch` plugin out of the box. To enable search you will need to enable the feature flag in `./store.config.json`, which you do by changing the config to this:\n\n```javascript\n{\n \"features\": {\n // other features...\n \"search\": true\n }\n}\n```\n\nBefore you can search you will need to install the plugin in your Medusa server, for a written guide on how to do this – [see our documentation](https://docs.medusajs.com/add-plugins/meilisearch).\n\nThe search components in this starter are developed with Algolia's `react-instant-search-hooks-web` library which should make it possible for you to seemlesly change your search provider to Algolia instead of MeiliSearch.\n\nTo do this you will need to add `algoliasearch` to the project, by running\n\n```shell\nyarn add algoliasearch\n```\n\nAfter this you will need to switch the current MeiliSearch `SearchClient` out with a Alogolia client. To do this update `@lib/search-client`.\n\n```ts\nimport algoliasearch from \"algoliasearch/lite\"\n\nconst appId = process.env.NEXT_PUBLIC_SEARCH_APP_ID || \"test_app_id\" // You should add this to your environment variables\n\nconst apiKey = process.env.NEXT_PUBLIC_SEARCH_API_KEY || \"test_key\"\n\nexport const searchClient = algoliasearch(appId, apiKey)\n\nexport const SEARCH_INDEX_NAME =\n process.env.NEXT_PUBLIC_INDEX_NAME || \"products\"\n```\n\nThen, in `src/app/(main)/search/actions.ts`, remove the MeiliSearch code (line 10-16) and uncomment the Algolia code.\n\n```ts\n\"use server\"\n\nimport { searchClient, SEARCH_INDEX_NAME } from \"@lib/search-client\"\n\n/**\n * Uses MeiliSearch or Algolia to search for a query\n * @param {string} query - search query\n */\nexport async function search(query: string) {\n const index = searchClient.initIndex(SEARCH_INDEX_NAME)\n const { hits } = await index.search(query)\n\n return hits\n}\n```\n\nAfter this you will need to set up Algolia with your Medusa server, and then you should be good to go. For a more thorough walkthrough of using Algolia with Medusa – [see our documentation](https://docs.medusajs.com/add-plugins/algolia), and the [documentation for using `react-instantsearch-hooks-web`](https://www.algolia.com/doc/guides/building-search-ui/getting-started/react-hooks/).\n\n## App structure\n\nFor the new version, the main folder structure remains unchanged. The contents have changed quite a bit though.\n\n```\n.\n└── src\n ├── app\n ├── lib\n ├── modules\n ├── styles\n ├── types\n └── middleware.ts\n\n```\n\n### `/app` directory\n\nThe app folder contains all Next.js App Router pages and layouts, and takes care of the routing.\n\n```\n.\n└── [countryCode]\n ├── (checkout)\n └── checkout\n └── (main)\n ├── account\n │ ├── addresses\n │ └── orders\n │ └── details\n │ └── [id]\n ├── cart\n ├── categories\n │ └── [...category]\n ├── collections\n │ └── [handle]\n ├── order\n │ └── confirmed\n │ └── [id]\n ├── products\n │ └── [handle]\n ├── results\n │ └── [query]\n ├── search\n └── store\n```\n\nThe app router folder structure represents the routes of the Starter. In this case, the structure is as follows:\n\n- The root directory is represented by the `[countryCode]` folder. This indicates a dynamic route based on the country code. The this will be populated by the countries you set up in your Medusa server. The param is then used to fetch region specific prices, languages, etc.\n- Within the root directory, there two Route Groups: `(checkout)` and `(main)`. This is done because the checkout flow uses a different layout. All other parts of the app share the same layout and are in subdirectories of the `(main)` group. Route Groups do not affect the url.\n- Each of these subdirectories may have further subdirectories. For instance, the `account` directory has `addresses` and `orders` subdirectories. The `orders` directory further has a `details` subdirectory, which itself has a dynamic `[id]` subdirectory.\n- This nested structure allows for specific routing to various pages within the application. For example, a URL like `/account/orders/details/123` would correspond to the `account > orders > details > [id]` path in the router structure, with `123` being the dynamic `[id]`.\n\nThis structure enables efficient routing and organization of different parts of the Starter.\n\n### `/lib` **directory**\n\nThe lib directory contains all utilities like the Medusa JS client functions, util functions, config and constants. \n\nThe most important file here is `/lib/data/index.ts`. This file defines various functions for interacting with the Medusa API, using the JS client. The functions cover a range of actions related to shopping carts, orders, shipping, authentication, customer management, regions, products, collections, and categories. It also includes utility functions for handling headers and errors, as well as some functions for sorting and transforming product data.\n\nThese functions are used in different Server Actions.\n\n### `/modules` directory\n\nThis is where all the components, templates and Server Actions are, grouped by section. Some subdirectories have an `actions.ts` file. These files contain all Server Actions relevant to that section of the app.\n\n### `/styles` directory\n\n`global.css` imports Tailwind classes and defines a couple of global CSS classes. Tailwind and Medusa UI classes are used for styling throughout the app.\n\n### `/types` directory\n\nContains global TypeScript type defintions.\n\n### `middleware.ts`\n\nNext.js Middleware, which is basically an Edge function that runs before (almost) every request. In our case it enforces a `countryCode` in the url. So when a user visits any url on your storefront without a `countryCode` param, it will redirect the user to the url for the most relevant region.\n\nThe region will be decided as follows:\n\n- When deployed on Vercel and you’re active in the user’s current country, it will use the country code from the `x-vercel-ip-country` header.\n- Else, if you have defined a `NEXT_PUBLIC_DEFAULT_REGION` environment variable, it will redirect to that.\n- Else, it will redirect the user to the first region it finds on your Medusa server.\n\nIf you want to use the `countryCode` param in your code, there’s two ways to do that:\n\n1. On the server in any `page.tsx` - the `countryCode` is in the `params` object:\n \n ```tsx\n export default async function Page({\n params: { countryCode },\n }: {\n params: { countryCode: string }\n }) {\n const region = await getRegion(countryCode)\n \n // rest of code\n ```\n \n2. From client components, with the `useParam` hook:\n \n ```tsx\n import { useParams } from \"next/navigation\"\n \n const Component = () => {\n \tconst { countryCode } = useParams()\n \t\n \t// rest of code\n ```\n \n\nThe middleware also sets a cookie based on the onboarding status of a user. This is related to the Medusa Admin onboarding flow, and may be safely removed in your production storefront.\n\n# Resources\n\n## Learn more about Medusa\n\n- [Website](https://www.medusajs.com/)\n- [GitHub](https://github.com/medusajs)\n- [Documentation](https://docs.medusajs.com/)\n\n## Learn more about Next.js\n\n- [Website](https://nextjs.org/)\n- [GitHub](https://github.com/vercel/next.js)\n- [Documentation](https://nextjs.org/docs)\n"
},
{
"path": "storefront/check-env-variables.js",
"content": "const c = require(\"ansi-colors\")\n\nconst requiredEnvs = [\n {\n key: \"NEXT_PUBLIC_MEDUSA_BACKEND_URL\",\n description:\n \"Your Medusa backend, should be updated to where you are hosting your server. Remember to update CORS settings for your server. See - https://docs.medusajs.com/usage/configurations#admin_cors-and-store_cors.\",\n },\n {\n key: \"NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY\",\n description:\n \"Your publishable key that can be attached to sales channels. See - https://docs.medusajs.com/development/publishable-api-keys.\",\n },\n {\n key: \"NEXT_PUBLIC_BASE_URL\",\n description:\n \"Your store URL, should be updated to where you are hosting your storefront.\",\n },\n {\n key: \"NEXT_PUBLIC_DEFAULT_REGION\",\n description:\n 'Your preferred default region. When middleware cannot determine the user region from the \"x-vercel-country\" header, the default region will be used. ISO-2 lowercase format.',\n },\n {\n key: \"NEXT_PUBLIC_STRIPE_KEY\",\n description:\n \"Your Stripe public key. See - https://docs.medusajs.com/add-plugins/stripe.\",\n },\n]\n\nfunction checkEnvVariables() {\n const missingEnvs = requiredEnvs.filter((env) => {\n return !process.env[env.key]\n })\n\n if (missingEnvs.length > 0) {\n console.error(\n c.red.bold(\"\\n🚫 Error: Missing required environment variables\\n\")\n )\n\n missingEnvs.forEach((env) => {\n console.error(c.yellow(` ${c.bold(env.key)}`))\n if (env.description) {\n console.error(c.dim(` ${env.description}\\n`))\n }\n })\n\n console.error(\n c.yellow(\n \"\\nPlease set these variables in your .env file or environment before starting the application.\\n\"\n )\n )\n\n process.exit(1)\n }\n}\n\nmodule.exports = checkEnvVariables\n"
},
{
"path": "storefront/e2e/README.md",
"content": "# About\n\nThis folder contains an end to end testing suite written with playwright checking all of the main functionality provided by this template. Note it assumes you are using a postgres database on the backend and have configured a test database. This is required because the tests will **drop and recreate the test database** in order to ensure replicability between test runs.\n\nThis test suite was built off of using the [medusa-starter-default](https://github.com/medusajs/medusa-starter-default) repository with the seed data from `data/seed.json`.\n\n# Setup\n\n## .env\n\nThese tests have a number of dependent environment variables, with an example found in `.env.example`. You can setup your local environment by copying the example environment file\n\n```sh\ncat e2e/.env.example >> .env\n```\n\nand configuring the `.env` file from there. There are more details below about what the test values correspond to and how to set them. But we mention that\n\n* `CLIENT_SERVER` - is the server the next server is listening on\n\n## Playwright\n\nIn order to run these tests, make sure playwright and a playwright-enabled browser is installed. You can do this by running\n\n```sh\nnpx playwright install\n```\n\n## Database\n\nNote that **these tests drop and reset the database** after each test run. This means you will need to configure a separate test database based on your development or production database. We give some instructions for doing so, and enforce a rule which requires the test database to have the prefix `test_` in its name.\n\n### Environment variables\n\n- `TEST_POSTGRES_USER` - user for connecting to the test database, for example, `medusa`\n- `TEST_POSTGRES_PASSWORD` - password for connecting to the test database, for example `my_secret_password`\n- `TEST_POSTGRES_DATABASE` - name of the test database, must start with the prefix `test*`, for example `test_medusa_db`\n- `TEST_POSTGRES_HOST` - optional - host for the postgres database, defaults to `localhost`\n- `TEST_POSTGREST_PORT` - optional - host for the postgres\n- `PRODUCTION_POSTGRES_DATABASE` - name of the production database, for example `medusa_db`\n\nin addition, there are environment variables for connecting to the database as a superuser, so we can efficiently reset the database.\n\n* `PGHOST` - host for the postgres instance\n* `PGPORT` - port for the postgres instance\n* `PGUSER` - superuser for the postgres instance\n* `PGPASSWORD` - superuser password for the postgres instance\n* `PGDATABASE` - database we connect to while updating the other databases\n\n### Test Database Failsafes\n\nThere are a few failsafes to ensure the test and production databases don't get mixed up. This includes:\n\n- Ensuring the production database doesn't have the same name as the test database\n- Ensuring the test database starts with the prefix `test_`\n\nNote running the test suite will trigger database drops and recreations of the test database.\n\n### Using a separate database\n\nIf you need to run your project with a separate database, such as sqlite, MySQL, or something else, please refer to `seed/reset.ts` and implement your own `resetDatabase` function which can be run between test runs.\n\n# Running the test suite\n\n## Test environment\n\nBefore running the test suite, make sure to start the backend server the medusa client is using. In addition, make sure to run in the nextjs template directory\n\n```sh\nyarn build\n```\n\nso the project is built.\n\n## Calling the tests\n\nYou can run the test suite in the base directory of the project with either\n\n```sh\nyarn test-e2e\n```\n\nor\n\n```sh\nnpm run test-e2e\n```\n\nWhile the test suite is running, it is configured to automatically run the nextjs template during test execution.\n"
},
{
"path": "storefront/e2e/data/reset.ts",
"content": "import { Client } from \"pg\"\n\nasync function getDatabaseClient() {\n testEnvChecks()\n const env = getEnv()\n const client = new Client(env.superuser)\n await client.connect()\n return client\n}\n\nfunction getEnv() {\n return {\n host: process.env.TEST_POSTGRES_HOST || \"localhost\",\n port: process.env.TEST_POSTGRES_HOST\n ? Number(process.env.TEST_POSTGRES_HOST)\n : 5432,\n user: process.env.TEST_POSTGRES_USER || \"test_medusa_user\",\n testDatabase: process.env.TEST_POSTGRES_DATABASE || \"test_medusa_db\",\n testDatabaseTemplate:\n process.env.TEST_POSTGRES_DATABASE_TEMPLATE || \"test_medusa_db_template\",\n productionDatabase: process.env.PRODUCTION_POSTGRES_DATABASE || \"medusa_db\",\n superuser: {\n host: process.env.PGHOST || \"localhost\",\n port: process.env.PGPORT ? Number(process.env.PGPORT) : 5432,\n user: process.env.PGUSER || \"postgres\",\n password: process.env.PGPASSWORD || \"password\",\n database: process.env.PGDATABASE || \"postgres\",\n },\n }\n}\n\nasync function testEnvChecks() {\n const env = getEnv()\n if (!env.testDatabase.startsWith(\"test_\")) {\n const msg =\n \"Please make sure your test environment database name starts with test_\"\n console.error(msg)\n throw new Error(msg)\n }\n if (env.testDatabase === env.productionDatabase) {\n const msg =\n \"Please make sure your test environment database and production environment database names are not equal\"\n console.error(msg)\n throw new Error(msg)\n }\n}\n\nasync function createTemplateDatabase(client: Client) {\n const { user, testDatabase, testDatabaseTemplate } = getEnv()\n try {\n // close current connections\n await client.query(`\n ALTER DATABASE ${testDatabase} WITH ALLOW_CONNECTIONS false;\n SELECT pg_terminate_backend(pid) FROM pg_stat_activity\n WHERE datname='${testDatabase}';\n `)\n await client.query(`\n CREATE DATABASE ${testDatabaseTemplate} WITH\n OWNER=${user}\n TEMPLATE=${testDatabase}\n IS_TEMPLATE=true;\n `)\n } catch (e: any) {\n // duplicate database code\n if (e.code === \"42P04\") {\n return\n }\n throw e\n }\n}\n\nasync function createTestDatabase(client: Client) {\n const { user, testDatabase, testDatabaseTemplate } = getEnv()\n const deleteDatabase = `${testDatabase}_del`\n // drop connections and alter database name\n await client.query(`\n SELECT pg_terminate_backend(pid)\n FROM pg_stat_activity\n WHERE datname='${testDatabase}';\n ALTER DATABASE ${testDatabase}\n RENAME TO ${deleteDatabase};\n `)\n await client.query(`\n CREATE DATABASE ${testDatabase}\n WITH OWNER ${user}\n TEMPLATE=${testDatabaseTemplate};\n `)\n await client.query(`DROP DATABASE ${deleteDatabase}`)\n}\n\nexport async function resetDatabase() {\n const client = await getDatabaseClient()\n await createTemplateDatabase(client)\n await createTestDatabase(client)\n await client.end()\n}\n\nexport async function dropTemplate() {\n const client = await getDatabaseClient()\n const env = getEnv()\n await client.query(\n `ALTER DATABASE ${env.testDatabaseTemplate} is_template false`\n )\n await client.query(`DROP DATABASE ${env.testDatabaseTemplate}`)\n await client.end()\n}\n"
},
{
"path": "storefront/e2e/data/seed.ts",
"content": "import axios, { AxiosError, AxiosInstance } from \"axios\"\n\naxios.defaults.baseURL = process.env.CLIENT_SERVER || \"http://localhost:9000\"\nlet region = undefined as any\n\nexport async function seedData() {\n const axios = getOrInitAxios()\n return {\n user: await seedUser(),\n }\n}\n\nexport async function seedUser(email?: string, password?: string) {\n const user = {\n first_name: \"Test\",\n last_name: \"User\",\n email: email || \"test@example.com\",\n password: password || \"password\",\n }\n try {\n await axios.post(\"/store/customers\", user)\n return user\n } catch (e: unknown) {\n if (e instanceof AxiosError) {\n if (e.response && e.response.status) {\n const status = e.response.status\n // https://docs.medusajs.com/api/store#customers_postcustomers\n if (status === 422) {\n return user\n }\n }\n throw e\n }\n }\n}\n\nasync function loadRegion(axios: AxiosInstance) {\n const resp = await axios.get(\"/admin/regions\")\n region = resp.data.regions.filter((r: any) => r.currency_code === \"usd\")[0]\n}\n\nasync function getOrInitAxios(axios?: AxiosInstance) {\n if (!axios) {\n axios = await loginAdmin()\n }\n if (!region) {\n await loadRegion(axios)\n }\n return axios\n}\n\nexport async function seedGiftcard(axios?: AxiosInstance) {\n axios = await getOrInitAxios(axios)\n const resp = await axios.post(\"/admin/gift-cards\", {\n region_id: region.id,\n value: 10000,\n })\n resp.data.gift_card.amount = resp.data.gift_card.value.toString()\n return resp.data.gift_card as {\n id: string\n code: string\n value: number\n amount: string\n balance: string\n }\n}\n\nexport async function seedDiscount(axios?: AxiosInstance) {\n axios = await getOrInitAxios(axios)\n const amount = 2000\n const resp = await axios.post(\"/admin/discounts\", {\n code: \"TEST_DISCOUNT_FIXED\",\n regions: [region.id],\n rule: {\n type: \"fixed\",\n value: amount,\n allocation: \"total\",\n },\n })\n const discount = resp.data.discount\n return {\n id: discount.id,\n code: discount.code,\n rule_id: discount.rule_id,\n amount,\n }\n}\n\nasync function loginAdmin() {\n const resp = await axios.post(\"/admin/auth/token\", {\n email: process.env.MEDUSA_ADMIN_EMAIL || \"admin@medusa-test.com\",\n password: process.env.MEDUSA_ADMIN_PASSWORD || \"supersecret\",\n })\n if (resp.status !== 200) {\n throw { error: \"must be able to log in user\" }\n }\n return axios.create({\n headers: {\n Authorization: `Bearer ${resp.data.access_token}`,\n },\n })\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/account-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"../base/base-page\"\n\nexport class AccountPage extends BasePage {\n container: Locator\n accountNav: Locator\n\n overviewLink: Locator\n profileLink: Locator\n addressesLink: Locator\n ordersLink: Locator\n logoutLink: Locator\n\n mobileAccountNav: Locator\n mobileAccountMainLink : Locator\n mobileOverviewLink : Locator\n mobileProfileLink : Locator\n mobileAddressesLink : Locator\n mobileOrdersLink : Locator\n mobileLogoutLink : Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"account-page\")\n this.accountNav = this.container.getByTestId(\"account-nav\")\n this.overviewLink = this.accountNav.getByTestId(\"overview-link\")\n this.profileLink = this.accountNav.getByTestId(\"profile-link\")\n this.addressesLink = this.accountNav.getByTestId(\"addresses-link\")\n this.ordersLink = this.accountNav.getByTestId(\"orders-link\")\n this.logoutLink = this.accountNav.getByTestId(\"logout-button\")\n\n this.mobileAccountNav = this.container.getByTestId(\"mobile-account-nav\")\n this.mobileAccountMainLink = this.mobileAccountNav.getByTestId(\"account-main-link\")\n this.mobileOverviewLink = this.mobileAccountNav.getByTestId(\"overview-link\")\n this.mobileProfileLink = this.mobileAccountNav.getByTestId(\"profile-link\")\n this.mobileAddressesLink = this.mobileAccountNav.getByTestId(\"addresses-link\")\n this.mobileOrdersLink = this.mobileAccountNav.getByTestId(\"orders-link\")\n this.mobileLogoutLink = this.mobileAccountNav.getByTestId(\"logout-button\")\n }\n\n async goto() {\n await this.navMenu.navAccountLink.click()\n await this.container.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/addresses-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { AccountPage } from \"./account-page\"\nimport { AddressModal } from \"./modals/address-modal\"\n\nexport class AddressesPage extends AccountPage {\n addAddressModal: AddressModal\n editAddressModal: AddressModal\n addressContainer: Locator\n addressesWrapper: Locator\n newAddressButton: Locator\n\n constructor(page: Page) {\n super(page)\n this.addAddressModal = new AddressModal(page, \"add\")\n this.editAddressModal = new AddressModal(page, \"edit\")\n this.addressContainer = this.container.getByTestId(\"address-container\")\n this.addressesWrapper = page.getByTestId(\"addresses-page-wrapper\")\n this.newAddressButton = this.container.getByTestId(\"add-address-button\")\n }\n\n getAddressContainer(text: string) {\n const container = this.page\n .getByTestId(\"address-container\")\n .filter({ hasText: text })\n return {\n container,\n editButton: container.getByTestId('address-edit-button'),\n deleteButton: container.getByTestId(\"address-delete-button\"),\n name: container.getByTestId(\"address-name\"),\n company: container.getByTestId(\"address-company\"),\n address: container.getByTestId(\"address-address\"),\n postalCity: container.getByTestId(\"address-postal-city\"),\n provinceCountry: container.getByTestId(\"address-province-country\"),\n }\n }\n\n async goto() {\n await super.goto()\n await this.addressesLink.click()\n await this.addressesWrapper.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/index.ts",
"content": "import { test as base } from \"@playwright/test\"\nimport { AddressesPage } from \"./addresses-page\"\nimport { LoginPage } from \"./login-page\"\nimport { OrderPage } from \"./order-page\"\nimport { OrdersPage } from \"./orders-page\"\nimport { OverviewPage } from \"./overview-page\"\nimport { ProfilePage } from \"./profile-page\"\nimport { RegisterPage } from \"./register-page\"\n\nexport const accountFixtures = base.extend<{\n accountAddressesPage: AddressesPage\n accountOrderPage: OrderPage\n accountOrdersPage: OrdersPage\n accountOverviewPage: OverviewPage\n accountProfilePage: ProfilePage\n loginPage: LoginPage\n registerPage: RegisterPage\n}>({\n accountAddressesPage: async ({ page }, use) => {\n const addressesPage = new AddressesPage(page)\n await use(addressesPage)\n },\n accountOrderPage: async ({ page }, use) => {\n const orderPage = new OrderPage(page)\n await use(orderPage)\n },\n accountOrdersPage: async ({ page }, use) => {\n const ordersPage = new OrdersPage(page)\n await use(ordersPage)\n },\n accountOverviewPage: async ({ page }, use) => {\n const overviewPage = new OverviewPage(page)\n await use(overviewPage)\n },\n accountProfilePage: async ({ page }, use) => {\n const profilePage = new ProfilePage(page)\n await use(profilePage)\n },\n loginPage: async ({ page }, use) => {\n const loginPage = new LoginPage(page)\n await use(loginPage)\n },\n registerPage: async ({ page }, use) => {\n const registerPage = new RegisterPage(page)\n await use(registerPage)\n },\n})\n"
},
{
"path": "storefront/e2e/fixtures/account/login-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"../base/base-page\"\n\nexport class LoginPage extends BasePage {\n container: Locator\n emailInput: Locator\n passwordInput: Locator\n signInButton: Locator\n registerButton: Locator\n errorMessage: Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"login-page\")\n this.emailInput = this.container.getByTestId(\"email-input\")\n this.passwordInput = this.container.getByTestId(\"password-input\")\n this.signInButton = this.container.getByTestId(\"sign-in-button\")\n this.registerButton = this.container.getByTestId(\"register-button\")\n this.errorMessage = this.container.getByTestId(\"login-error-message\")\n }\n\n async goto() {\n await this.page.goto(\"/account\")\n await this.container.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/modals/address-modal.ts",
"content": "import { Page, Locator } from \"@playwright/test\"\nimport { BaseModal } from \"../../base/base-modal\"\n\nexport class AddressModal extends BaseModal {\n saveButton: Locator\n cancelButton: Locator\n\n firstNameInput: Locator\n lastNameInput: Locator\n companyInput: Locator\n address1Input: Locator\n address2Input: Locator\n postalCodeInput: Locator\n cityInput: Locator\n stateInput: Locator\n countrySelect: Locator\n phoneInput: Locator\n\n constructor(page: Page, modalType: \"add\" | \"edit\") {\n if (modalType === \"add\") {\n super(page, page.getByTestId(\"add-address-modal\"))\n } else {\n super(page, page.getByTestId(\"edit-address-modal\"))\n }\n\n this.saveButton = this.container.getByTestId(\"save-button\")\n this.cancelButton = this.container.getByTestId(\"cancel-button\")\n\n this.firstNameInput = this.container.getByTestId(\"first-name-input\")\n this.lastNameInput = this.container.getByTestId(\"last-name-input\")\n this.companyInput = this.container.getByTestId(\"company-input\")\n this.address1Input = this.container.getByTestId(\"address-1-input\")\n this.address2Input = this.container.getByTestId(\"address-2-input\")\n this.postalCodeInput = this.container.getByTestId(\"postal-code-input\")\n this.cityInput = this.container.getByTestId(\"city-input\")\n this.stateInput = this.container.getByTestId(\"state-input\")\n this.countrySelect = this.container.getByTestId(\"country-select\")\n this.phoneInput = this.container.getByTestId(\"phone-input\")\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/order-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { AccountPage } from \"./account-page\"\n\nexport class OrderPage extends AccountPage {\n container: Locator\n backToOverviewButton: Locator\n orderEmail: Locator\n orderDate: Locator\n orderId: Locator\n orderStatus: Locator\n orderPaymentStatus: Locator\n shippingAddressSummary: Locator\n shippingContactSummary: Locator\n shippingMethodSummary: Locator\n paymentMethod: Locator\n paymentAmount: Locator\n productsTable: Locator\n productRow: Locator\n productTitle: Locator\n productVariant: Locator\n productQuantity: Locator\n productOriginalPrice: Locator\n productPrice: Locator\n productUnitOriginalPrice: Locator\n productUnitPrice: Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"order-details-container\")\n this.backToOverviewButton = page.getByTestId(\"back-to-overview-button\")\n this.orderEmail = this.container.getByTestId(\"order-email\")\n this.orderDate = this.container.getByTestId(\"order-date\")\n this.orderId = this.container.getByTestId(\"order-id\")\n this.orderStatus = this.container.getByTestId(\"order-status\")\n this.orderPaymentStatus = this.container.getByTestId(\"order-payment-status\")\n this.shippingAddressSummary = this.container.getByTestId(\n \"shipping-address-summary\"\n )\n this.shippingContactSummary = this.container.getByTestId(\n \"shipping-contact-summary\"\n )\n this.shippingMethodSummary = this.container.getByTestId(\n \"shipping-method-summary\"\n )\n this.paymentMethod = this.container.getByTestId(\"payment-method\")\n this.paymentAmount = this.container.getByTestId(\"payment-amount\")\n\n this.productsTable = this.container.getByTestId(\"products-table\")\n this.productRow = this.container.getByTestId(\"product-row\")\n this.productTitle = this.container.getByTestId(\"product-title\")\n this.productVariant = this.container.getByTestId(\"product-variant\")\n this.productQuantity = this.container.getByTestId(\"product-quantity\")\n this.productOriginalPrice = this.container.getByTestId(\n \"product-original-price\"\n )\n this.productPrice = this.container.getByTestId(\"product-price\")\n this.productUnitOriginalPrice = this.container.getByTestId(\n \"product-unit-original-price\"\n )\n this.productUnitPrice = this.container.getByTestId(\"product-unit-price\")\n }\n\n async getProduct(title: string, variant: string) {\n const productRow = this.productRow\n .filter({\n hasText: title,\n })\n .filter({\n hasText: `Variant: ${variant}`,\n })\n return {\n productRow,\n name: productRow.getByTestId(\"product-name\"),\n variant: productRow.getByTestId(\"product-variant\"),\n quantity: productRow.getByTestId(\"product-quantity\"),\n price: productRow.getByTestId(\"product-unit-price\"),\n total: productRow.getByTestId(\"product-price\"),\n }\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/orders-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { AccountPage } from \"./account-page\"\n\nexport class OrdersPage extends AccountPage {\n ordersWrapper: Locator\n noOrdersContainer: Locator\n continueShoppingButton: Locator\n orderCard: Locator\n orderDisplayId: Locator\n\n constructor(page: Page) {\n super(page)\n this.ordersWrapper = page.getByTestId(\"orders-page-wrapper\")\n this.noOrdersContainer = page.getByTestId(\"no-orders-container\")\n this.continueShoppingButton = page.getByTestId(\"continue-shopping-button\")\n this.orderCard = page.getByTestId(\"order-card\")\n this.orderDisplayId = page.getByTestId(\"order-display-id\")\n\n this.orderCard = page.getByTestId(\"order-card\")\n this.orderDisplayId = page.getByTestId(\"order-display-id\")\n }\n\n async getOrderById(orderId: string) {\n const orderIdLocator = this.page\n .getByTestId(\"order-display-id\")\n .filter({\n hasText: orderId,\n })\n .first()\n const card = this.orderCard.filter({ has: orderIdLocator }).first()\n const items = (await card.getByTestId(\"order-item\").all()).map(\n (orderItem) => {\n return {\n item: orderItem,\n title: orderItem.getByTestId(\"item-title\"),\n quantity: orderItem.getByTestId(\"item-quantity\"),\n }\n }\n )\n return {\n card,\n displayId: card.getByTestId(\"order-display-id\"),\n createdAt: card.getByTestId(\"order-created-at\"),\n orderId: card.getByTestId(\"order-display-id\"),\n amount: card.getByTestId(\"order-amount\"),\n detailsLink: card.getByTestId(\"order-details-link\"),\n itemsLocator: card.getByTestId(\"order-item\"),\n items,\n }\n }\n\n async goto() {\n await super.goto()\n await this.ordersLink.click()\n await this.ordersWrapper.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/overview-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { AccountPage } from \"./account-page\"\n\nexport class OverviewPage extends AccountPage {\n welcomeMessage: Locator\n customerEmail: Locator\n profileCompletion: Locator\n addressesCount: Locator\n noOrdersMessage: Locator\n ordersWrapper: Locator\n orderWrapper: Locator\n overviewWrapper: Locator\n\n constructor(page: Page) {\n super(page)\n this.overviewWrapper = this.container.getByTestId(\"overview-page-wrapper\")\n this.welcomeMessage = this.container.getByTestId(\"welcome-message\")\n this.customerEmail = this.container.getByTestId(\"customer-email\")\n this.profileCompletion = this.container.getByTestId(\n \"customer-profile-completion\"\n )\n this.addressesCount = this.container.getByTestId(\"addresses-count\")\n this.noOrdersMessage = this.container.getByTestId(\"no-orders-message\")\n this.ordersWrapper = this.container.getByTestId(\"orders-wrapper\")\n this.orderWrapper = this.container.getByTestId(\"order-wrapper\")\n }\n\n async getOrder(orderId: string) {\n const order = this.ordersWrapper.locator(\n `[data-testid=\"order-wrapper\"][data-value=\"${orderId}\"]`\n )\n return {\n locator: order,\n id: await order.getAttribute(\"value\"),\n createdDate: await order.getByTestId(\"order-created-date\"),\n displayId: await order.getByTestId(\"order-id\").getAttribute(\"value\"),\n amount: await order.getByTestId(\"order-amount\").textContent(),\n openButton: order.getByTestId(\"open-order-button\"),\n }\n }\n\n async goto() {\n await this.navMenu.navAccountLink.click()\n await this.container.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/profile-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { AccountPage } from \"./account-page\"\nimport { camelCase } from \"lodash\"\n\nexport class ProfilePage extends AccountPage {\n profileWrapper: Locator\n accountNameEditor: Locator\n accountEmailEditor: Locator\n accountPhoneEditor: Locator\n accountPasswordEditor: Locator\n accountBillingAddressEditor: Locator\n\n nameEditButton: Locator\n emailEditButton: Locator\n phoneEditButton: Locator\n passwordEditButton: Locator\n billingAddressEditButton: Locator\n\n nameSaveButton: Locator\n emailSaveButton: Locator\n phoneSaveButton: Locator\n passwordSaveButton: Locator\n billingAddressSaveButton: Locator\n\n savedName: Locator\n savedEmail: Locator\n savedPhone: Locator\n savedPassword: Locator\n savedBillingAddress: Locator\n\n nameSuccessMessage: Locator\n emailSuccessMessage: Locator\n phoneSuccessMessage: Locator\n passwordSuccessMessage: Locator\n billingAddressSuccessMessage: Locator\n\n nameErrorMessage: Locator\n emailErrorMessage: Locator\n phoneErrorMessage: Locator\n passwordErrorMessage: Locator\n billingAddressErrorMessage: Locator\n\n emailInput: Locator\n firstNameInput: Locator\n lastNameInput: Locator\n\n phoneInput: Locator\n\n oldPasswordInput: Locator\n newPasswordInput: Locator\n confirmPasswordInput: Locator\n\n billingAddress1Input: Locator\n billingAddress2Input: Locator\n billingCityInput: Locator\n billingCompanyInput: Locator\n billingFirstNameInput: Locator\n billingLastNameInput: Locator\n billingPostcalCodeInput: Locator\n billingProvinceInput: Locator\n billingCountryCodeSelect: Locator\n\n constructor(page: Page) {\n super(page)\n this.profileWrapper = page.getByTestId(\"profile-page-wrapper\")\n this.accountNameEditor = this.container.getByTestId(\"account-name-editor\")\n this.accountEmailEditor = this.container.getByTestId(\"account-email-editor\")\n this.accountPhoneEditor = this.container.getByTestId(\"account-phone-editor\")\n this.accountPasswordEditor = this.container.getByTestId(\n \"account-password-editor\"\n )\n this.accountBillingAddressEditor = this.container.getByTestId(\n \"account-billing-address-editor\"\n )\n\n this.nameEditButton = this.accountNameEditor.getByTestId(\"edit-button\")\n this.emailEditButton = this.accountEmailEditor.getByTestId(\"edit-button\")\n this.phoneEditButton = this.accountPhoneEditor.getByTestId(\"edit-button\")\n this.passwordEditButton =\n this.accountPasswordEditor.getByTestId(\"edit-button\")\n this.billingAddressEditButton =\n this.accountBillingAddressEditor.getByTestId(\"edit-button\")\n\n this.nameSaveButton = this.accountNameEditor.getByTestId(\"save-button\")\n this.emailSaveButton = this.accountEmailEditor.getByTestId(\"save-button\")\n this.phoneSaveButton = this.accountPhoneEditor.getByTestId(\"save-button\")\n this.passwordSaveButton =\n this.accountPasswordEditor.getByTestId(\"save-button\")\n this.billingAddressSaveButton =\n this.accountBillingAddressEditor.getByTestId(\"save-button\")\n\n this.savedName = this.accountNameEditor.getByTestId(\"current-info\")\n this.savedEmail = this.accountEmailEditor.getByTestId(\"current-info\")\n this.savedPhone = this.accountPhoneEditor.getByTestId(\"current-info\")\n this.savedPassword = this.accountPasswordEditor.getByTestId(\"current-info\")\n this.savedBillingAddress =\n this.accountBillingAddressEditor.getByTestId(\"current-info\")\n this.nameSuccessMessage =\n this.accountNameEditor.getByTestId(\"success-message\")\n this.emailSuccessMessage =\n this.accountEmailEditor.getByTestId(\"success-message\")\n this.phoneSuccessMessage =\n this.accountPhoneEditor.getByTestId(\"success-message\")\n this.passwordSuccessMessage =\n this.accountPasswordEditor.getByTestId(\"success-message\")\n this.billingAddressSuccessMessage =\n this.accountBillingAddressEditor.getByTestId(\"success-message\")\n this.nameErrorMessage = this.accountNameEditor.getByTestId(\"error-message\")\n this.emailErrorMessage =\n this.accountEmailEditor.getByTestId(\"error-message\")\n this.phoneErrorMessage =\n this.accountPhoneEditor.getByTestId(\"error-message\")\n this.passwordErrorMessage =\n this.accountPasswordEditor.getByTestId(\"error-message\")\n this.billingAddressErrorMessage =\n this.accountBillingAddressEditor.getByTestId(\"error-message\")\n\n this.firstNameInput = page.getByTestId(\"first-name-input\")\n this.lastNameInput = page.getByTestId(\"last-name-input\")\n this.emailInput = page.getByTestId(\"email-input\")\n this.phoneInput = page.getByTestId(\"phone-input\")\n this.oldPasswordInput = page.getByTestId(\"old-password-input\")\n this.newPasswordInput = page.getByTestId(\"new-password-input\")\n this.confirmPasswordInput = page.getByTestId(\"confirm-password-input\")\n\n this.billingAddress1Input = page.getByTestId(\"billing-address-1-input\")\n this.billingAddress2Input = page.getByTestId(\"billing-address-2-input\")\n this.billingCityInput = page.getByTestId(\"billing-city-input\")\n this.billingCompanyInput = page.getByTestId(\"billing-company-input\")\n this.billingFirstNameInput = page.getByTestId(\"billing-first-name-input\")\n this.billingLastNameInput = page.getByTestId(\"billing-last-name-input\")\n this.billingPostcalCodeInput = page.getByTestId(\n \"billing-postcal-code-input\"\n )\n this.billingProvinceInput = page.getByTestId(\"billing-province-input\")\n this.billingCountryCodeSelect = page.getByTestId(\n \"billing-country-code-select\"\n )\n }\n\n async getEditorInputs(editor: Locator) {\n const editButton = editor.getByTestId(\"edit-button\")\n if ((await editButton.getAttribute(\"active\")) !== \"true\") {\n await editButton.click()\n }\n // get all the inputs\n const inputs = editor.locator(\n '[data-testid]:not([data-testid=\"edit-button\"])'\n )\n const o = {\n editButton,\n } as { [k: string]: Locator }\n for (const input of await inputs.all()) {\n const testId = (await input.getAttribute(\"data-testid\")) as string\n const key = camelCase(testId)\n o[key] = input\n }\n return o\n }\n\n async goto() {\n super.goto()\n await this.profileLink.click()\n await this.profileWrapper.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/account/register-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"../base/base-page\"\n\nexport class RegisterPage extends BasePage {\n container: Locator\n firstNameInput: Locator\n lastNameInput: Locator\n emailInput: Locator\n phoneInput: Locator\n passwordInput: Locator\n registerButton: Locator\n registerError: Locator\n loginLink: Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"register-page\")\n this.firstNameInput = this.container.getByTestId(\"first-name-input\")\n this.lastNameInput = this.container.getByTestId(\"last-name-input\")\n this.emailInput = this.container.getByTestId(\"email-input\")\n this.phoneInput = this.container.getByTestId(\"phone-input\")\n this.passwordInput = this.container.getByTestId(\"password-input\")\n this.registerButton = this.container.getByTestId(\"register-button\")\n this.registerError = this.container.getByTestId(\"register-error\")\n this.loginLink = this.container.getByTestId(\"login-link\")\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/base/base-modal.ts",
"content": "import { Page, Locator } from \"@playwright/test\"\n\nexport class BaseModal {\n page: Page\n container: Locator\n closeButton: Locator\n\n constructor(page: Page, container: Locator) {\n this.page = page\n this.container = container\n this.closeButton = this.container.getByTestId(\"close-modal-button\")\n }\n\n async close() {\n const button = this.container.getByTestId(\"close-modal-button\")\n await button.click()\n }\n\n async isOpen() {\n return await this.container.isVisible()\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/base/base-page.ts",
"content": "import { CartDropdown } from \"./cart-dropdown\"\nimport { NavMenu } from \"./nav-menu\"\nimport { Page, Locator } from \"@playwright/test\"\nimport { SearchModal } from \"./search-modal\"\n\nexport class BasePage {\n page: Page\n navMenu: NavMenu\n cartDropdown: CartDropdown\n searchModal: SearchModal\n accountLink: Locator\n cartLink: Locator\n searchLink: Locator\n storeLink: Locator\n categoriesList: Locator\n\n constructor(page: Page) {\n this.page = page\n this.navMenu = new NavMenu(page)\n this.cartDropdown = new CartDropdown(page)\n this.searchModal = new SearchModal(page)\n this.accountLink = page.getByTestId(\"nav-account-link\")\n this.cartLink = page.getByTestId(\"nav-cart-link\")\n this.storeLink = page.getByTestId(\"nav-store-link\")\n this.searchLink = page.getByTestId(\"nav-search-link\")\n this.categoriesList = page.getByTestId(\"footer-categories\")\n }\n\n async clickCategoryLink(category: string) {\n const link = this.categoriesList.getByTestId(\"category-link\")\n await link.click()\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/base/cart-dropdown.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\n\nexport class CartDropdown {\n page: Page\n navCartLink: Locator\n cartDropdown: Locator\n cartSubtotal: Locator\n goToCartButton: Locator\n\n constructor(page: Page) {\n this.page = page\n this.navCartLink = page.getByTestId(\"nav-cart-link\")\n this.cartDropdown = page.getByTestId(\"nav-cart-dropdown\")\n this.cartSubtotal = this.cartDropdown.getByTestId(\"cart-subtotal\")\n this.goToCartButton = this.cartDropdown.getByTestId(\"go-to-cart-button\")\n }\n\n async displayCart() {\n await this.navCartLink.hover()\n }\n\n async close() {\n if (await this.cartDropdown.isVisible()) {\n const box = await this.cartDropdown.boundingBox()\n if (!box) {\n return\n }\n await this.page.mouse.move(box.x + box.width / 4, box.y + box.height / 4)\n await this.page.mouse.move(5, 10)\n }\n }\n\n async getCartItem(name: string, variant: string) {\n const cartItem = this.cartDropdown\n .getByTestId(\"cart-item\")\n .filter({\n hasText: name,\n })\n .filter({\n hasText: `Variant: ${variant}`,\n })\n return {\n locator: cartItem,\n productLink: cartItem.getByTestId(\"product-link\"),\n removeButton: cartItem.getByTestId(\"cart-item-remove-button\"),\n name,\n quantity: cartItem.getByTestId(\"cart-item-quantity\"),\n variant: cartItem.getByTestId(\"cart-item-variant\"),\n }\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/base/nav-menu.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\n\nexport class NavMenu {\n page: Page\n navMenuButton: Locator\n navMenu: Locator\n navAccountLink: Locator\n homeLink: Locator\n storeLink: Locator\n searchLink: Locator\n accountLink: Locator\n cartLink: Locator\n closeButton: Locator\n shippingToLink: Locator\n shippingToMenu: Locator\n\n constructor(page: Page) {\n this.page = page\n this.navMenuButton = page.getByTestId(\"nav-menu-button\")\n this.navMenu = page.getByTestId(\"nav-menu-popup\")\n this.navAccountLink = page.getByTestId(\"nav-account-link\")\n this.homeLink = this.navMenu.getByTestId(\"home-link\")\n this.storeLink = this.navMenu.getByTestId(\"store-link\")\n this.searchLink = this.navMenu.getByTestId(\"search-link\")\n this.accountLink = this.navMenu.getByTestId(\"account-link\")\n this.cartLink = this.navMenu.getByTestId(\"nav-cart-link\")\n this.closeButton = this.navMenu.getByTestId(\"close-menu-button\")\n this.shippingToLink = this.navMenu.getByTestId(\"shipping-to-button\")\n this.shippingToMenu = this.navMenu.getByTestId(\"shipping-to-choices\")\n }\n\n async selectShippingCountry(country: string) {\n if (!(await this.navMenu.isVisible())) {\n throw {\n error:\n `You cannot call ` +\n `NavMenu.selectShippingCountry(\"${country}\") without having the ` +\n `navMenu visible first!`,\n }\n }\n const countryLink = this.navMenu.getByTestId(\n `select-${country.toLowerCase()}-choice`\n )\n await this.shippingToLink.hover()\n await this.shippingToMenu.waitFor({\n state: \"visible\",\n })\n await countryLink.click()\n }\n\n async open() {\n await this.navMenuButton.click()\n await this.navMenu.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/base/search-modal.ts",
"content": "import { Page, Locator } from \"@playwright/test\"\nimport { BaseModal } from \"./base-modal\"\nimport { NavMenu } from \"./nav-menu\"\n\nexport class SearchModal extends BaseModal {\n searchInput: Locator\n searchResults: Locator\n noSearchResultsContainer: Locator\n searchResult: Locator\n searchResultTitle: Locator\n\n constructor(page: Page) {\n super(page, page.getByTestId(\"search-modal-container\"))\n this.searchInput = this.container.getByTestId(\"search-input\")\n this.searchResults = this.container.getByTestId(\"search-results\")\n this.noSearchResultsContainer = this.container.getByTestId(\n \"no-search-results-container\"\n )\n this.searchResult = this.container.getByTestId(\"search-result\")\n this.searchResultTitle = this.container.getByTestId(\"search-result-title\")\n }\n\n async open() {\n const menu = new NavMenu(this.page)\n await menu.open()\n await menu.searchLink.click()\n await this.container.waitFor({ state: \"visible\" })\n }\n\n async close() {\n const viewport = this.page.viewportSize()\n const y = viewport ? viewport.height / 2 : 100\n await this.page.mouse.click(1, y, { clickCount: 2, delay: 100 })\n await this.container.waitFor({ state: \"hidden\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/cart-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"./base/base-page\"\n\nexport class CartPage extends BasePage {\n container: Locator\n emptyCartMessage: Locator\n signInButton: Locator\n productRow: Locator\n productTitle: Locator\n productVariant: Locator\n productDeleteButton: Locator\n productQuantitySelect: Locator\n discountButton: Locator\n discountInput: Locator\n discountApplyButton: Locator\n discountErrorMessage: Locator\n discountRow: Locator\n giftCardRow: Locator\n giftCardCode: Locator\n giftCardAmount: Locator\n giftCardRemoveButton: Locator\n cartSubtotal: Locator\n cartDiscount: Locator\n cartGiftCardAmount: Locator\n cartShipping: Locator\n cartTaxes: Locator\n cartTotal: Locator\n checkoutButton: Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"cart-container\")\n this.emptyCartMessage = this.container.getByTestId(\"empty-cart-message\")\n this.signInButton = this.container.getByTestId(\"sign-in-button\")\n this.productRow = this.container.getByTestId(\"product-row\")\n this.productTitle = this.container.getByTestId(\"product-title\")\n this.productVariant = this.container.getByTestId(\"product-variant\")\n this.productDeleteButton = this.container.getByTestId(\n \"product-delete-button\"\n )\n this.productQuantitySelect = this.container.getByTestId(\n \"product-quantity-select\"\n )\n this.checkoutButton = this.container.getByTestId(\"checkout-button\")\n this.discountButton = this.container.getByTestId(\"add-discount-button\")\n this.discountInput = this.container.getByTestId(\"discount-input\")\n this.discountApplyButton = this.container.getByTestId(\n \"discount-apply-button\"\n )\n this.discountErrorMessage = this.container.getByTestId(\n \"discount-error-message\"\n )\n this.discountRow = this.container.getByTestId(\"discount-row\")\n this.giftCardRow = this.container.getByTestId(\"gift-card\")\n this.giftCardCode = this.container.getByTestId(\"gift-card-code\")\n this.giftCardAmount = this.container.getByTestId(\"gift-card-amount\")\n this.giftCardRemoveButton = this.container.getByTestId(\n \"remove-gift-card-button\"\n )\n this.cartSubtotal = this.container.getByTestId(\"cart-subtotal\")\n this.cartDiscount = this.container.getByTestId(\"cart-discount\")\n this.cartGiftCardAmount = this.container.getByTestId(\n \"cart-gift-card-amount\"\n )\n this.cartShipping = this.container.getByTestId(\"cart-shipping\")\n this.cartTaxes = this.container.getByTestId(\"cart-taxes\")\n this.cartTotal = this.container.getByTestId(\"cart-total\")\n }\n\n async getProduct(title: string, variant: string) {\n const productRow = this.productRow\n .filter({\n hasText: title,\n })\n .filter({\n hasText: `Variant: ${variant}`,\n })\n return {\n productRow,\n title: productRow.getByTestId(\"product-title\"),\n variant: productRow.getByTestId(\"product-variant\"),\n deleteButton: productRow.getByTestId(\"delete-button\"),\n quantitySelect: productRow.getByTestId(\"product-select-button\"),\n price: productRow.getByTestId(\"product-unit-price\"),\n total: productRow.getByTestId(\"product-price\"),\n }\n }\n\n async getGiftCard(code: string) {\n const giftCardRow = this.giftCardRow.filter({\n hasText: code,\n })\n const amount = giftCardRow.getByTestId(\"gift-card-amount\")\n return {\n locator: giftCardRow,\n code: giftCardRow.getByTestId(\"gift-card-code\"),\n amount,\n amountValue: await amount.getAttribute(\"data-value\"),\n removeButton: giftCardRow.getByTestId(\"remove-gift-card-button\"),\n }\n }\n\n async getDiscount(code: string) {\n const discount = this.discountRow\n const amount = discount.getByTestId(\"discount-amount\")\n return {\n locator: discount,\n code: discount.getByTestId(\"discount-code\"),\n amount,\n amountValue: await amount.getAttribute(\"data-value\"),\n removeButton: discount.getByTestId(\"remove-discount-button\"),\n }\n }\n\n async goto() {\n await this.cartLink.click({ clickCount: 2 })\n await this.container.waitFor({ state: \"visible\" })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/category-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"./base/base-page\"\n\nexport class CategoryPage extends BasePage {\n container: Locator\n sortByContainer: Locator\n\n pageTitle: Locator\n pagination: Locator\n productsListLoader: Locator\n productsList: Locator\n productWrapper: Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"category-container\")\n this.pageTitle = page.getByTestId(\"category-page-title\")\n this.sortByContainer = page.getByTestId(\"sort-by-container\")\n this.productsListLoader = this.container.getByTestId(\"products-list-loader\")\n this.productsList = this.container.getByTestId(\"products-list\")\n this.productWrapper = this.productsList.getByTestId(\"product-wrapper\")\n this.pagination = this.container.getByTestId(\"product-pagination\")\n }\n\n async getProduct(name: string) {\n const product = this.productWrapper.filter({ hasText: name })\n return {\n locator: product,\n title: product.getByTestId(\"product-title\"),\n price: product.getByTestId(\"price\"),\n originalPrice: product.getByTestId(\"original-price\"),\n }\n }\n\n async sortBy(sortString: string) {\n const link = this.sortByContainer.getByTestId(\"sort-by-link\").filter({\n hasText: sortString,\n })\n await link.click()\n // wait for page change\n await this.page.waitForFunction((linkElement) => {\n if (!linkElement) {\n return true\n }\n return linkElement.dataset.active === \"true\"\n }, await link.elementHandle())\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/checkout-page.ts",
"content": "import { ElementHandle, Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"./base/base-page\"\n\nexport class CheckoutPage extends BasePage {\n backToCartLink: Locator\n storeLink: Locator\n container: Locator\n editAddressButton: Locator\n editDeliveryButton: Locator\n editPaymentButton: Locator\n\n shippingAddressSelect: Locator\n shippingAddressOptions: Locator\n shippingAddressOption: Locator\n\n billingAddressCheckbox: Locator\n billingAddressInput: Locator\n billingCityInput: Locator\n billingCompanyInput: Locator\n billingFirstNameInput: Locator\n billingLastNameInput: Locator\n billingPhoneInput: Locator\n billingPostalInput: Locator\n billingProvinceInput: Locator\n shippingAddressInput: Locator\n shippingCityInput: Locator\n shippingCompanyInput: Locator\n shippingEmailInput: Locator\n shippingFirstNameInput: Locator\n shippingLastNameInput: Locator\n shippingPhoneInput: Locator\n shippingPostalCodeInput: Locator\n shippingProvinceInput: Locator\n\n billingCountrySelect: Locator\n shippingCountrySelect: Locator\n\n shippingAddressSummary: Locator\n shippingContactSummary: Locator\n billingAddressSummary: Locator\n\n submitAddressButton: Locator\n addressErrorMessage: Locator\n\n deliveryOptionsContainer: Locator\n deliveryOptionRadio: Locator\n deliveryOptionErrorMessage: Locator\n submitDeliveryOptionButton: Locator\n deliveryOptionSummary: Locator\n\n paymentMethodSummary: Locator\n paymentDetailsSummary: Locator\n paymentMethodErrorMessage: Locator\n stripePaymentErrorMessage: Locator\n paypalPaymentErrorMessage: Locator\n manualPaymentErrorMessage: Locator\n submitPaymentButton: Locator\n submitOrderButton: Locator\n\n discountButton: Locator\n discountInput: Locator\n discountApplyButton: Locator\n discountErrorMessage: Locator\n discountRow: Locator\n giftCardRow: Locator\n giftCardCode: Locator\n giftCardAmount: Locator\n giftCardRemoveButton: Locator\n cartSubtotal: Locator\n cartDiscount: Locator\n cartGiftCardAmount: Locator\n cartShipping: Locator\n cartTaxes: Locator\n cartTotal: Locator\n itemsTable: Locator\n itemRow: Locator\n itemTitle: Locator\n itemVariant: Locator\n itemQuantity: Locator\n itemOriginalPrice: Locator\n itemReducedPrice: Locator\n itemUnitOriginalPrice: Locator\n itemUnitReducedPrice: Locator\n\n constructor(page: Page) {\n super(page)\n this.backToCartLink = page.getByTestId(\"back-to-cart-link\")\n this.storeLink = page.getByTestId(\"store-link\")\n this.container = page.getByTestId(\"checkout-container\")\n\n this.editAddressButton = this.container.getByTestId(\"edit-address-button\")\n this.editDeliveryButton = this.container.getByTestId(\"edit-delivery-button\")\n this.editPaymentButton = this.container.getByTestId(\"edit-payment-button\")\n\n this.shippingAddressSelect = this.container.getByTestId(\n \"shipping-address-select\"\n )\n this.shippingAddressOptions = this.container.getByTestId(\n \"shipping-address-options\"\n )\n this.shippingAddressOption = this.container.getByTestId(\n \"shipping-address-option\"\n )\n this.billingAddressCheckbox = this.container.getByTestId(\n \"billing-address-checkbox\"\n )\n this.billingAddressInput = this.container.getByTestId(\n \"billing-address-input\"\n )\n this.billingCityInput = this.container.getByTestId(\"billing-city-input\")\n this.billingCompanyInput = this.container.getByTestId(\n \"billing-company-input\"\n )\n this.billingFirstNameInput = this.container.getByTestId(\n \"billing-first-name-input\"\n )\n this.billingLastNameInput = this.container.getByTestId(\n \"billing-last-name-input\"\n )\n this.billingPhoneInput = this.container.getByTestId(\"billing-phone-input\")\n this.billingPostalInput = this.container.getByTestId(\"billing-postal-input\")\n this.billingProvinceInput = this.container.getByTestId(\n \"billing-province-input\"\n )\n this.shippingAddressInput = this.container.getByTestId(\n \"shipping-address-input\"\n )\n this.shippingCityInput = this.container.getByTestId(\"shipping-city-input\")\n this.shippingCompanyInput = this.container.getByTestId(\n \"shipping-company-input\"\n )\n this.shippingEmailInput = this.container.getByTestId(\"shipping-email-input\")\n this.shippingFirstNameInput = this.container.getByTestId(\n \"shipping-first-name-input\"\n )\n this.shippingLastNameInput = this.container.getByTestId(\n \"shipping-last-name-input\"\n )\n this.shippingPhoneInput = this.container.getByTestId(\"shipping-phone-input\")\n this.shippingPostalCodeInput = this.container.getByTestId(\n \"shipping-postal-code-input\"\n )\n this.shippingProvinceInput = this.container.getByTestId(\n \"shipping-province-input\"\n )\n\n this.billingCountrySelect = this.container.getByTestId(\n \"billing-country-select\"\n )\n this.shippingCountrySelect = this.container.getByTestId(\n \"shipping-country-select\"\n )\n\n this.shippingAddressSummary = this.container.getByTestId(\n \"shipping-address-summary\"\n )\n this.shippingContactSummary = this.container.getByTestId(\n \"shipping-contact-summary\"\n )\n this.billingAddressSummary = this.container.getByTestId(\n \"billing-address-summary\"\n )\n\n this.submitAddressButton = this.container.getByTestId(\n \"submit-address-button\"\n )\n this.addressErrorMessage = this.container.getByTestId(\n \"address-error-message\"\n )\n\n this.deliveryOptionsContainer = this.container.getByTestId(\n \"delivery-options-container\"\n )\n this.deliveryOptionRadio = this.container.getByTestId(\n \"delivery-option-radio\"\n )\n this.deliveryOptionErrorMessage = this.container.getByTestId(\n \"delivery-option-error-message\"\n )\n this.submitDeliveryOptionButton = this.container.getByTestId(\n \"submit-delivery-option-button\"\n )\n this.deliveryOptionSummary = this.container.getByTestId(\n \"delivery-option-summary\"\n )\n\n this.paymentMethodSummary = this.container.getByTestId(\n \"payment-method-summary\"\n )\n this.paymentDetailsSummary = this.container.getByTestId(\n \"payment-details-summary\"\n )\n this.paymentMethodErrorMessage = this.container.getByTestId(\n \"payment-method-error-message\"\n )\n this.submitPaymentButton = this.container.getByTestId(\n \"submit-payment-button\"\n )\n this.stripePaymentErrorMessage = this.container.getByTestId(\n \"stripe-payment-error-message\"\n )\n this.paypalPaymentErrorMessage = this.container.getByTestId(\n \"paypal-payment-error-message\"\n )\n this.manualPaymentErrorMessage = this.container.getByTestId(\n \"manual-payment-error-message\"\n )\n this.submitOrderButton = this.container.getByTestId(\"submit-order-button\")\n\n this.discountButton = this.container.getByTestId(\"add-discount-button\")\n this.discountInput = this.container.getByTestId(\"discount-input\")\n this.discountApplyButton = this.container.getByTestId(\n \"discount-apply-button\"\n )\n this.discountErrorMessage = this.container.getByTestId(\n \"discount-error-message\"\n )\n this.discountRow = this.container.getByTestId(\"discount-row\")\n this.giftCardRow = this.container.getByTestId(\"gift-card\")\n this.giftCardCode = this.container.getByTestId(\"gift-card-code\")\n this.giftCardAmount = this.container.getByTestId(\"gift-card-amount\")\n this.giftCardRemoveButton = this.container.getByTestId(\n \"remove-gift-card-button\"\n )\n this.cartSubtotal = this.container.getByTestId(\"cart-subtotal\")\n this.cartDiscount = this.container.getByTestId(\"cart-discount\")\n this.cartGiftCardAmount = this.container.getByTestId(\n \"cart-gift-card-amount\"\n )\n this.cartShipping = this.container.getByTestId(\"cart-shipping\")\n this.cartTaxes = this.container.getByTestId(\"cart-taxes\")\n this.cartTotal = this.container.getByTestId(\"cart-total\")\n this.itemsTable = this.container.getByTestId(\"items-table\")\n this.itemRow = this.container.getByTestId(\"item-row\")\n this.itemTitle = this.container.getByTestId(\"item-title\")\n this.itemVariant = this.container.getByTestId(\"item-variant\")\n this.itemQuantity = this.container.getByTestId(\"item-quantity\")\n this.itemOriginalPrice = this.container.getByTestId(\"item-original-price\")\n this.itemReducedPrice = this.container.getByTestId(\"item-reduced-price\")\n this.itemUnitOriginalPrice = this.container.getByTestId(\n \"item-unit-original-price\"\n )\n this.itemUnitReducedPrice = this.container.getByTestId(\n \"item-unit-reduced-price\"\n )\n }\n\n async selectSavedAddress(address: string) {\n await this.shippingAddressSelect.click()\n const addressOption = this.shippingAddressOption.filter({\n hasText: address,\n })\n await addressOption.getByTestId(\"shipping-address-radio\").click()\n\n const selectHandle = await this.shippingAddressSelect.elementHandle()\n await this.page.waitForFunction(\n (opts) => {\n const select = opts[0]\n const choice = opts[1]\n return (select.textContent || \"\").includes(choice)\n },\n [selectHandle, address] as [ElementHandle, string]\n )\n }\n\n async selectDeliveryOption(option: string) {\n await this.deliveryOptionRadio.filter({ hasText: option }).click()\n }\n\n async getGiftCard(code: string) {\n const giftCardRow = this.giftCardRow.filter({\n hasText: code,\n })\n const amount = giftCardRow.getByTestId(\"gift-card-amount\")\n return {\n locator: giftCardRow,\n code: giftCardRow.getByTestId(\"gift-card-code\"),\n amount,\n amountValue: await amount.getAttribute(\"data-value\"),\n removeButton: giftCardRow.getByTestId(\"remove-gift-card-button\"),\n }\n }\n\n async getDiscount(code: string) {\n const discount = this.discountRow\n const amount = discount.getByTestId(\"discount-amount\")\n return {\n locator: discount,\n code: discount.getByTestId(\"discount-code\"),\n amount,\n amountValue: await amount.getAttribute(\"data-value\"),\n removeButton: discount.getByTestId(\"remove-discount-button\"),\n }\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/index.ts",
"content": "import { test as base, Page } from \"@playwright/test\"\nimport { resetDatabase } from \"../data/reset\"\nimport { CartPage } from \"./cart-page\"\nimport { CategoryPage } from \"./category-page\"\nimport { CheckoutPage } from \"./checkout-page\"\nimport { OrderPage } from \"./order-page\"\nimport { ProductPage } from \"./product-page\"\nimport { StorePage } from \"./store-page\"\n\nexport const fixtures = base.extend<{\n resetDatabaseFixture: void\n cartPage: CartPage\n categoryPage: CategoryPage\n checkoutPage: CheckoutPage\n orderPage: OrderPage\n productPage: ProductPage\n storePage: StorePage\n}>({\n page: async ({ page }, use) => {\n await page.goto(\"/\")\n use(page)\n },\n resetDatabaseFixture: [\n async function ({}, use) {\n await resetDatabase()\n await use()\n },\n { auto: true, timeout: 10000 },\n ],\n cartPage: async ({ page }, use) => {\n const cartPage = new CartPage(page)\n await use(cartPage)\n },\n categoryPage: async ({ page }, use) => {\n const categoryPage = new CategoryPage(page)\n await use(categoryPage)\n },\n checkoutPage: async ({ page }, use) => {\n const checkoutPage = new CheckoutPage(page)\n await use(checkoutPage)\n },\n orderPage: async ({ page }, use) => {\n const orderPage = new OrderPage(page)\n await use(orderPage)\n },\n productPage: async ({ page }, use) => {\n const productPage = new ProductPage(page)\n await use(productPage)\n },\n storePage: async ({ page }, use) => {\n const storePage = new StorePage(page)\n await use(storePage)\n },\n})\n"
},
{
"path": "storefront/e2e/fixtures/modals/mobile-actions-modal.ts",
"content": "import { Page, Locator } from \"@playwright/test\"\nimport { BaseModal } from \"../base/base-modal\"\n\nexport class MobileActionsModal extends BaseModal {\n optionButton: Locator\n\n constructor(page: Page) {\n super(page, page.getByTestId(\"mobile-actions-modal\"))\n this.optionButton = this.container.getByTestId(\"option-button\")\n }\n\n getOption(option: string) {\n return this.optionButton.filter({\n hasText: option,\n })\n }\n\n async selectOption(option: string) {\n const optionButton = this.getOption(option)\n await optionButton.click()\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/order-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"./base/base-page\"\n\nexport class OrderPage extends BasePage {\n container: Locator\n cartSubtotal: Locator\n cartDiscount: Locator\n cartGiftCardAmount: Locator\n cartShipping: Locator\n cartTaxes: Locator\n cartTotal: Locator\n orderEmail: Locator\n orderDate: Locator\n orderId: Locator\n orderStatus: Locator\n orderPaymentStatus: Locator\n shippingAddressSummary: Locator\n shippingContactSummary: Locator\n shippingMethodSummary: Locator\n paymentMethod: Locator\n paymentAmount: Locator\n productsTable: Locator\n productRow: Locator\n productTitle: Locator\n productVariant: Locator\n productQuantity: Locator\n productOriginalPrice: Locator\n productPrice: Locator\n productUnitOriginalPrice: Locator\n productUnitPrice: Locator\n\n constructor(page: Page) {\n super(page)\n this.container = page.getByTestId(\"order-complete-container\")\n this.orderEmail = this.container.getByTestId(\"order-email\")\n this.orderDate = this.container.getByTestId(\"order-date\")\n this.orderId = this.container.getByTestId(\"order-id\")\n this.orderStatus = this.container.getByTestId(\"order-status\")\n this.cartSubtotal = this.container.getByTestId(\"cart-subtotal\")\n this.cartDiscount = this.container.getByTestId(\"cart-discount\")\n this.cartGiftCardAmount = this.container.getByTestId(\n \"cart-gift-card-amount\"\n )\n this.cartShipping = this.container.getByTestId(\"cart-shipping\")\n this.cartTaxes = this.container.getByTestId(\"cart-taxes\")\n this.cartTotal = this.container.getByTestId(\"cart-total\")\n this.orderPaymentStatus = this.container.getByTestId(\"order-payment-status\")\n this.shippingAddressSummary = this.container.getByTestId(\n \"shipping-address-summary\"\n )\n this.shippingContactSummary = this.container.getByTestId(\n \"shipping-contact-summary\"\n )\n this.shippingMethodSummary = this.container.getByTestId(\n \"shipping-method-summary\"\n )\n this.paymentMethod = this.container.getByTestId(\"payment-method\")\n this.paymentAmount = this.container.getByTestId(\"payment-amount\")\n\n this.productsTable = this.container.getByTestId(\"products-table\")\n this.productRow = this.container.getByTestId(\"product-row\")\n this.productTitle = this.container.getByTestId(\"product-title\")\n this.productVariant = this.container.getByTestId(\"product-variant\")\n this.productQuantity = this.container.getByTestId(\"product-quantity\")\n this.productOriginalPrice = this.container.getByTestId(\n \"product-original-price\"\n )\n this.productPrice = this.container.getByTestId(\"product-price\")\n this.productUnitOriginalPrice = this.container.getByTestId(\n \"product-unit-original-price\"\n )\n this.productUnitPrice = this.container.getByTestId(\"product-unit-price\")\n }\n\n async getProduct(title: string, variant: string) {\n const productRow = this.productRow\n .filter({\n hasText: title,\n })\n .filter({\n hasText: `Variant: ${variant}`,\n })\n return {\n productRow,\n name: productRow.getByTestId(\"product-name\"),\n variant: productRow.getByTestId(\"product-variant\"),\n quantity: productRow.getByTestId(\"product-quantity\"),\n price: productRow.getByTestId(\"product-unit-price\"),\n total: productRow.getByTestId(\"product-price\"),\n }\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/product-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { BasePage } from \"./base/base-page\"\nimport { MobileActionsModal } from \"./modals/mobile-actions-modal\"\n\nexport class ProductPage extends BasePage {\n mobileActionsModal: MobileActionsModal\n\n container: Locator\n productTitle: Locator\n productDescription: Locator\n productOptions: Locator\n productPrice: Locator\n addProductButton: Locator\n mobileActionsContainer: Locator\n mobileTitle: Locator\n mobileActionsButton: Locator\n mobileAddToCartButton: Locator\n\n constructor(page: Page) {\n super(page)\n\n this.mobileActionsModal = new MobileActionsModal(page)\n\n this.container = page.getByTestId(\"product-container\")\n this.productTitle = this.container.getByTestId(\"product-title\")\n this.productDescription = this.container.getByTestId(\"product-description\")\n this.productOptions = this.container.getByTestId(\"product-options\")\n this.productPrice = this.container.getByTestId(\"product-price\")\n this.addProductButton = this.container.getByTestId(\"add-product-button\")\n this.mobileActionsContainer = page.getByTestId(\"mobile-actions\")\n this.mobileTitle = this.mobileActionsContainer.getByTestId(\"mobile-title\")\n this.mobileAddToCartButton = this.mobileActionsContainer.getByTestId(\n \"mobile-actions-button\"\n )\n this.mobileActionsButton = this.mobileActionsContainer.getByTestId(\n \"mobile-actions-select\"\n )\n }\n\n async clickAddProduct() {\n await this.addProductButton.click()\n await this.cartDropdown.cartDropdown.waitFor({ state: \"visible\" })\n }\n\n async selectOption(option: string) {\n await this.page.mouse.move(0, 0) // hides the checkout container\n const optionButton = this.productOptions\n .getByTestId(\"option-button\")\n .filter({ hasText: option })\n await optionButton.click({ clickCount: 2 })\n }\n}\n"
},
{
"path": "storefront/e2e/fixtures/store-page.ts",
"content": "import { Locator, Page } from \"@playwright/test\"\nimport { CategoryPage } from \"./category-page\"\n\nexport class StorePage extends CategoryPage {\n pageTitle: Locator\n\n constructor(page: Page) {\n super(page)\n this.pageTitle = page.getByTestId(\"store-page-title\")\n }\n\n async goto() {\n await this.navMenu.open()\n await this.navMenu.storeLink.click()\n await this.pageTitle.waitFor({ state: \"visible\" })\n await this.productsListLoader.waitFor({ state: \"hidden\" })\n }\n}"
},
{
"path": "storefront/e2e/index.ts",
"content": "import { mergeTests } from \"@playwright/test\"\nimport { fixtures } from \"./fixtures\"\nimport { accountFixtures } from \"./fixtures/account\"\n\nexport const test = mergeTests(fixtures, accountFixtures)\nexport { expect } from \"@playwright/test\"\n"
},
{
"path": "storefront/e2e/tests/authenticated/address.spec.ts",
"content": "import { AddressesPage } from \"../../fixtures/account/addresses-page\"\nimport { test, expect } from \"../../index\"\nimport { getSelectedOptionText } from \"../../utils/locators\"\n\ntest.describe(\"Addresses tests\", () => {\n test(\"Creating a new address is displayed during checkout\", async ({\n accountAddressesPage: addressesPage,\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to the new address modal\", async () => {\n await addressesPage.goto()\n await addressesPage.newAddressButton.click()\n await addressesPage.addAddressModal.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Inputs and saves the new address\", async () => {\n const modal = addressesPage.addAddressModal\n await modal.firstNameInput.fill(\"First\")\n await modal.lastNameInput.fill(\"Last\")\n await modal.companyInput.fill(\"FirstCorp\")\n await modal.address1Input.fill(\"123 Fake Street\")\n await modal.address2Input.fill(\"Apt 1\")\n await modal.postalCodeInput.fill(\"11111\")\n await modal.cityInput.fill(\"City\")\n await modal.stateInput.fill(\"Colorado\")\n await modal.countrySelect.selectOption({\n label: \"United States\",\n })\n await modal.phoneInput.fill(\"1112223333\")\n await modal.saveButton.click()\n await modal.container.waitFor({ state: \"hidden\" })\n })\n\n await test.step(\"Navigate to a product page and add a product to the cart\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n await productPage.selectOption(\"M\")\n await productPage.addProductButton.click()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the address is correct in the checkout process\", async () => {\n await checkoutPage.selectSavedAddress(\"123 Fake Street\")\n await expect(checkoutPage.shippingFirstNameInput).toHaveValue(\"First\")\n await expect(checkoutPage.shippingLastNameInput).toHaveValue(\"Last\")\n await expect(checkoutPage.shippingCompanyInput).toHaveValue(\"FirstCorp\")\n await expect(checkoutPage.shippingAddressInput).toHaveValue(\n \"123 Fake Street\"\n )\n await expect(checkoutPage.shippingPostalCodeInput).toHaveValue(\"11111\")\n await expect(checkoutPage.shippingCityInput).toHaveValue(\"City\")\n await expect(checkoutPage.shippingProvinceInput).toHaveValue(\"Colorado\")\n expect(\n await getSelectedOptionText(\n checkoutPage.page,\n checkoutPage.shippingCountrySelect\n )\n ).toContain(\"United States\")\n })\n })\n\n test(\"Performing all the CRUD actions for an address\", async ({\n accountAddressesPage: addressesPage,\n }) => {\n await test.step(\"Navigate to the new address modal\", async () => {\n await addressesPage.goto()\n await addressesPage.newAddressButton.click()\n await addressesPage.addAddressModal.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Input and save a new address\", async () => {\n const { addAddressModal } = addressesPage\n await addAddressModal.firstNameInput.fill(\"First\")\n await addAddressModal.lastNameInput.fill(\"Last\")\n await addAddressModal.companyInput.fill(\"MyCorp\")\n await addAddressModal.address1Input.fill(\"123 Fake Street\")\n await addAddressModal.address2Input.fill(\"Apt 1\")\n await addAddressModal.postalCodeInput.fill(\"80010\")\n await addAddressModal.cityInput.fill(\"Denver\")\n await addAddressModal.stateInput.fill(\"Colorado\")\n await addAddressModal.countrySelect.selectOption({ label: \"United States\" })\n await addAddressModal.phoneInput.fill(\"3031112222\")\n await addAddressModal.saveButton.click()\n await addAddressModal.container.waitFor({ state: \"hidden\" })\n })\n\n let addressContainer: ReturnType\n await test.step(\"Make sure the address container was appended to the page\", async () => {\n addressContainer = addressesPage.getAddressContainer(\"First Last\")\n await expect(addressContainer.name).toHaveText(\"First Last\")\n await expect(addressContainer.company).toHaveText(\"MyCorp\")\n await expect(addressContainer.address).toContainText(\"123 Fake Street\")\n await expect(addressContainer.address).toContainText(\"Apt 1\")\n await expect(addressContainer.postalCity).toContainText(\"80010, Denver\")\n await expect(addressContainer.provinceCountry).toContainText(\"Colorado, US\")\n })\n\n await test.step(\"Refresh the page and assert address was saved\", async () => {\n await addressesPage.page.reload()\n addressContainer = addressesPage.getAddressContainer(\"First Last\")\n await expect(addressContainer.name).toHaveText(\"First Last\")\n await expect(addressContainer.company).toHaveText(\"MyCorp\")\n await expect(addressContainer.address).toContainText(\"123 Fake Street\")\n await expect(addressContainer.address).toContainText(\"Apt 1\")\n await expect(addressContainer.postalCity).toContainText(\"80010, Denver\")\n await expect(addressContainer.provinceCountry).toContainText(\"Colorado, US\")\n })\n\n await test.step(\"Edit the address\", async () => {\n await addressContainer.editButton.click()\n await addressesPage.editAddressModal.container.waitFor({ state: \"visible\" })\n await addressesPage.editAddressModal.firstNameInput.fill(\"Second\")\n await addressesPage.editAddressModal.lastNameInput.fill(\"Final\")\n await addressesPage.editAddressModal.companyInput.fill(\"MeCorp\")\n await addressesPage.editAddressModal.address1Input.fill(\"123 Spark Street\")\n await addressesPage.editAddressModal.address2Input.fill(\"Unit 3\")\n await addressesPage.editAddressModal.postalCodeInput.fill(\"80011\")\n await addressesPage.editAddressModal.cityInput.fill(\"Broomfield\")\n await addressesPage.editAddressModal.stateInput.fill(\"CO\")\n await addressesPage.editAddressModal.countrySelect.selectOption({\n label: \"Canada\",\n })\n await addressesPage.editAddressModal.phoneInput.fill(\"3032223333\")\n await addressesPage.editAddressModal.saveButton.click()\n await addressesPage.editAddressModal.container.waitFor({ state: \"hidden\" })\n })\n\n await test.step(\"Make sure edits were saved on the addressContainer\", async () => {\n addressContainer = addressesPage.getAddressContainer(\"Second Final\")\n await expect(addressContainer.name).toContainText(\"Second Final\")\n await expect(addressContainer.company).toContainText(\"MeCorp\")\n await expect(addressContainer.address).toContainText(\"123 Spark Street, Unit 3\")\n await expect(addressContainer.postalCity).toContainText(\"80011, Broomfield\")\n await expect(addressContainer.provinceCountry).toContainText(\"CO, CA\")\n })\n\n await test.step(\"Refresh the page and assert edits were saved\", async () => {\n await addressesPage.page.reload()\n await expect(addressContainer.name).toContainText(\"Second Final\")\n await expect(addressContainer.company).toContainText(\"MeCorp\")\n await expect(addressContainer.address).toContainText(\"123 Spark Street, Unit 3\")\n await expect(addressContainer.postalCity).toContainText(\"80011, Broomfield\")\n await expect(addressContainer.provinceCountry).toContainText(\"CO, CA\")\n })\n\n await test.step(\"Delete the address\", async () => {\n await addressContainer.deleteButton.click()\n await addressContainer.container.waitFor({ state: \"hidden\" })\n await addressesPage.page.reload()\n await expect(addressContainer.container).not.toBeVisible()\n })\n\n await test.step(\"Ensure address remains deleted after refresh\", async () => {\n await addressesPage.page.reload()\n await expect(addressContainer.container).not.toBeVisible()\n })\n })\n\n test.skip(\"Attempt to create duplicate addresses on the address page\", async ({\n accountAddressesPage: addressesPage\n }) => {\n await test.step(\"navigate to the new address modal\", async () => {\n await addressesPage.goto()\n await addressesPage.newAddressButton.click()\n await addressesPage.addAddressModal.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Input and save a new address\", async () => {\n await addressesPage.addAddressModal.firstNameInput.fill(\"First\")\n await addressesPage.addAddressModal.lastNameInput.fill(\"Last\")\n await addressesPage.addAddressModal.companyInput.fill(\"MyCorp\")\n await addressesPage.addAddressModal.address1Input.fill(\"123 Fake Street\")\n await addressesPage.addAddressModal.address2Input.fill(\"Apt 1\")\n await addressesPage.addAddressModal.postalCodeInput.fill(\"80010\")\n await addressesPage.addAddressModal.cityInput.fill(\"Denver\")\n await addressesPage.addAddressModal.stateInput.fill(\"Colorado\")\n await addressesPage.addAddressModal.countrySelect.selectOption({\n label: \"United States\",\n })\n await addressesPage.addAddressModal.phoneInput.fill(\"3031112222\")\n await addressesPage.addAddressModal.saveButton.click()\n await addressesPage.addAddressModal.container.waitFor({ state: \"hidden\" })\n })\n\n await test.step(\"Attempt to create the same address\", async () => {\n await addressesPage.newAddressButton.click()\n await addressesPage.addAddressModal.container.waitFor({ state: \"visible\" })\n await addressesPage.addAddressModal.firstNameInput.fill(\"First\")\n await addressesPage.addAddressModal.lastNameInput.fill(\"Last\")\n await addressesPage.addAddressModal.companyInput.fill(\"MyCorp\")\n await addressesPage.addAddressModal.address1Input.fill(\"123 Fake Street\")\n await addressesPage.addAddressModal.address2Input.fill(\"Apt 1\")\n await addressesPage.addAddressModal.postalCodeInput.fill(\"80010\")\n await addressesPage.addAddressModal.cityInput.fill(\"Denver\")\n await addressesPage.addAddressModal.stateInput.fill(\"Colorado\")\n await addressesPage.addAddressModal.countrySelect.selectOption({\n label: \"United States\",\n })\n await addressesPage.addAddressModal.phoneInput.fill(\"3031112222\")\n await addressesPage.addAddressModal.saveButton.click()\n })\n\n await test.step(\"Validate error state\", async () => {\n\n })\n })\n\n test(\"Creating multiple tests works correctly\", async ({\n accountAddressesPage: addressesPage,\n }) => {\n test.slow()\n await test.step(\"Navigate to the new address modal\", async () => {\n await addressesPage.goto()\n })\n\n let addressContainer: ReturnType\n for (let i = 0; i < 10; i++) {\n await test.step(\"Open up the new address modal\", async () => {\n await addressesPage.newAddressButton.click()\n await addressesPage.addAddressModal.container.waitFor({ state: \"visible\" })\n })\n await test.step(\"Input and save a new address\", async () => {\n const { addAddressModal } = addressesPage\n await addAddressModal.firstNameInput.fill(`First-${i}`)\n await addAddressModal.lastNameInput.fill(`Last-${i}`)\n await addAddressModal.companyInput.fill(`MyCorp-${i}`)\n await addAddressModal.address1Input.fill(`123 Fake Street-${i}`)\n await addAddressModal.address2Input.fill(\"Apt 1\")\n await addAddressModal.postalCodeInput.fill(\"80010\")\n await addAddressModal.cityInput.fill(\"Denver\")\n await addAddressModal.stateInput.fill(\"Colorado\")\n await addAddressModal.countrySelect.selectOption({ label: \"United States\" })\n await addAddressModal.phoneInput.fill(\"3031112222\")\n await addAddressModal.saveButton.click()\n await addAddressModal.container.waitFor({ state: \"hidden\" })\n })\n await test.step(\"Make sure the address container was appended to the page\", async () => {\n addressContainer = addressesPage.getAddressContainer(`First-${i} Last-${i}`)\n await expect(addressContainer.name).toHaveText(`First-${i} Last-${i}`)\n await expect(addressContainer.company).toHaveText(`MyCorp-${i}`)\n await expect(addressContainer.address).toContainText(`123 Fake Street-${i}`)\n await expect(addressContainer.address).toContainText(\"Apt 1\")\n await expect(addressContainer.postalCity).toContainText(\"80010, Denver\")\n await expect(addressContainer.provinceCountry).toContainText(\"Colorado, US\")\n })\n }\n })\n})"
},
{
"path": "storefront/e2e/tests/authenticated/orders.spec.ts",
"content": "import { test, expect } from \"../../index\"\n\ntest.describe(\"Account orders page tests\", async () => {\n test.beforeEach(async ({ accountAddressesPage }) => {\n await accountAddressesPage.goto()\n await accountAddressesPage.newAddressButton.click()\n await test.step(\"Add default address\", async () => {\n const modal = accountAddressesPage.addAddressModal\n await modal.container.waitFor({ state: \"visible\" })\n await modal.firstNameInput.fill(\"First\")\n await modal.lastNameInput.fill(\"Last\")\n await modal.companyInput.fill(\"FirstCorp\")\n await modal.address1Input.fill(\"123 Fake Street\")\n await modal.address2Input.fill(\"Apt 1\")\n await modal.postalCodeInput.fill(\"11111\")\n await modal.cityInput.fill(\"City\")\n await modal.stateInput.fill(\"Colorado\")\n await modal.countrySelect.selectOption({\n label: \"United States\",\n })\n await modal.phoneInput.fill(\"1112223333\")\n await modal.saveButton.click()\n await modal.container.waitFor({ state: \"hidden\" })\n })\n })\n\n test(\"Verify account orders page displays empty container\", async ({\n accountOrdersPage,\n }) => {\n await accountOrdersPage.goto()\n await expect(accountOrdersPage.noOrdersContainer).toBeVisible()\n })\n\n test(\"Order shows up after checkout flow\", async ({\n accountOrdersPage,\n accountOrderPage,\n cartPage,\n checkoutPage,\n orderPage: publicOrderPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await checkoutPage.selectSavedAddress(\"123 Fake Street\")\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n await checkoutPage.deliveryOptionsContainer.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await publicOrderPage.container.waitFor({ state: \"visible\" })\n })\n\n let orderId = \"\"\n await test.step(\"Verify the order page information is correct\", async () => {\n orderId = (await publicOrderPage.orderId.textContent()) || \"\"\n\n await test.step(\"Verify the products ordered are correct\", async () => {\n const product = await publicOrderPage.getProduct(\"Sweatshirt\", \"M\")\n await expect(product.name).toContainText(\"Sweatshirt\")\n await expect(product.variant).toContainText(\"M\")\n await expect(product.quantity).toContainText(\"1\")\n })\n\n await test.step(\"Verify the shipping info is correct\", async () => {\n const address = publicOrderPage.shippingAddressSummary\n await expect(address).toContainText(\"First\")\n await expect(address).toContainText(\"Last\")\n await expect(address).toContainText(\"123 Fake Street\")\n await expect(address).toContainText(\"11111\")\n await expect(address).toContainText(\"City\")\n await expect(address).toContainText(\"US\")\n\n const contact = publicOrderPage.shippingContactSummary\n await expect(contact).toContainText(\"test@example.com\")\n await expect(contact).toContainText(\"3031112222\")\n\n const method = publicOrderPage.shippingMethodSummary\n await expect(method).toContainText(\"FakeEx Standard\")\n })\n })\n\n await test.step(\"Verify the account orders page displays a result\", async () => {\n await accountOrdersPage.goto()\n const order = await accountOrdersPage.getOrderById(orderId)\n expect(order.items.length).toBe(1)\n expect(order.items[0].title).toContainText(\"Sweatshirt\")\n expect(order.items[0].quantity).toHaveText(\"1\")\n await order.detailsLink.click()\n await accountOrderPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the order page displays the correct information\", async () => {\n await test.step(\"Verify the order id is correct\", async () => {\n await expect(accountOrderPage.orderId).toHaveText(orderId)\n })\n\n await test.step(\"Verify the products ordered are correct\", async () => {\n const product = await accountOrderPage.getProduct(\"Sweatshirt\", \"M\")\n await expect(product.name).toContainText(\"Sweatshirt\")\n await expect(product.variant).toContainText(\"M\")\n await expect(product.quantity).toContainText(\"1\")\n })\n\n await test.step(\"Verify the shipping info is correct\", async () => {\n const address = accountOrderPage.shippingAddressSummary\n await expect(address).toContainText(\"First\")\n await expect(address).toContainText(\"Last\")\n await expect(address).toContainText(\"123 Fake Street\")\n await expect(address).toContainText(\"11111\")\n await expect(address).toContainText(\"City\")\n await expect(address).toContainText(\"US\")\n\n const contact = accountOrderPage.shippingContactSummary\n await contact.highlight()\n await expect(contact.getByText(\"test@example.com\")).toBeVisible()\n await expect(contact.getByText(\"3031112222\")).toBeVisible()\n\n const method = accountOrderPage.shippingMethodSummary\n await method.highlight()\n await expect(method).toContainText(\"FakeEx Standard\")\n })\n })\n\n await test.step(\"Navigate back to the orders page, verifying back button works\", async () => {\n await accountOrderPage.backToOverviewButton.click()\n await accountOrdersPage.container.waitFor({ state: \"visible\" })\n })\n })\n\n test(\"Order preserves item count, and variants\", async ({\n accountOrdersPage,\n accountOrderPage,\n cartPage,\n checkoutPage,\n orderPage: publicOrderPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Add first batch or products to the cart\", async () => {\n await test.step(\"Navigate to the sweatshirt product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n })\n })\n\n await test.step(\"Add second batch of products to the cart\", async () => {\n await test.step(\"Navigate to the sweatshirt product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"S\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n })\n\n await test.step(\"Navigate to the checkout process\", async () => {\n await productPage.cartDropdown.goToCartButton.click()\n await productPage.cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n\n let orderId = \"\"\n await test.step(\"Checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await checkoutPage.selectSavedAddress(\"123 Fake Street\")\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n await checkoutPage.deliveryOptionsContainer.waitFor({\n state: \"visible\",\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await publicOrderPage.container.waitFor({ state: \"visible\" })\n orderId = (await publicOrderPage.orderId.textContent()) || \"\"\n })\n })\n\n await test.step(\"Verify the order page information is correct\", async () => {\n await test.step(\"Navigate to the account orders page, verify information, and navigate to the order page\", async () => {\n await accountOrdersPage.goto()\n const order = await accountOrdersPage.getOrderById(orderId)\n expect(order.itemsLocator).toHaveCount(3)\n expect(\n order.itemsLocator.filter({ hasText: \"Sweatpants\" })\n ).toHaveCount(2)\n expect(\n order.itemsLocator.filter({ hasText: \"Sweatshirt\" })\n ).toHaveCount(1)\n await order.detailsLink.click()\n await accountOrderPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify information on the order page\", async () => {\n const sweatshirt = await accountOrderPage.getProduct(\"Sweatshirt\", \"M\")\n await expect(sweatshirt.name).toContainText(\"Sweatshirt\")\n await expect(sweatshirt.variant).toContainText(\"M\")\n await expect(sweatshirt.quantity).toContainText(\"2\")\n\n const smallSweatpants = await accountOrderPage.getProduct(\n \"Sweatpants\",\n \"S\"\n )\n await expect(smallSweatpants.name).toContainText(\"Sweatpants\")\n await expect(smallSweatpants.variant).toContainText(\"S\")\n await expect(smallSweatpants.quantity).toContainText(\"1\")\n\n const mediumSweatpants = await accountOrderPage.getProduct(\n \"Sweatpants\",\n \"M\"\n )\n await expect(mediumSweatpants.name).toContainText(\"Sweatpants\")\n await expect(mediumSweatpants.variant).toContainText(\"M\")\n await expect(mediumSweatpants.quantity).toContainText(\"1\")\n })\n })\n })\n\n test(\"Multiple orders are stored correctly\", async ({\n accountOrdersPage,\n cartPage,\n checkoutPage,\n orderPage: publicOrderPage,\n productPage,\n storePage,\n }) => {\n let firstOrderId = \"\"\n let secondOrderId = \"\"\n await test.step(\"Make the first order\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await checkoutPage.selectSavedAddress(\"123 Fake Street\")\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n await checkoutPage.deliveryOptionsContainer.waitFor({\n state: \"visible\",\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await publicOrderPage.container.waitFor({ state: \"visible\" })\n firstOrderId = (await publicOrderPage.orderId.textContent()) || \"\"\n })\n })\n\n await test.step(\"Make the second order\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"S\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await checkoutPage.selectSavedAddress(\"123 Fake Street\")\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n await checkoutPage.deliveryOptionsContainer.waitFor({\n state: \"visible\",\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await publicOrderPage.container.waitFor({ state: \"visible\" })\n secondOrderId = (await publicOrderPage.orderId.textContent()) || \"\"\n })\n })\n\n await test.step(\"Verify there are distinct orders on the orders page\", async () => {\n await accountOrdersPage.goto()\n await test.step(\"Verify the first order info\", async () => {\n const order = await accountOrdersPage.getOrderById(firstOrderId)\n await expect(order.itemsLocator).toHaveCount(1)\n await expect(order.items[0].title).toContainText(\"Sweatshirt\")\n await expect(order.items[0].quantity).toHaveText(\"1\")\n })\n await test.step(\"Verify the second order info\", async () => {\n const order = await accountOrdersPage.getOrderById(secondOrderId)\n await expect(order.itemsLocator).toHaveCount(1)\n await expect(order.items[0].title).toContainText(\"Sweatpants\")\n await expect(order.items[0].quantity).toHaveText(\"1\")\n })\n })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/authenticated/profile.spec.ts",
"content": "import { test, expect } from \"../../index\"\n\ntest.describe(\"Account profile tests\", () => {\n test(\"Profile completed update flow\", async ({\n accountOverviewPage: overviewPage,\n accountProfilePage: profilePage,\n }) => {\n await overviewPage.goto()\n await expect(overviewPage.profileCompletion).toHaveText(\"50%\")\n\n await test.step(\"navigate to the profile page\", async () => {\n await profilePage.profileLink.click()\n await expect(profilePage.profileWrapper).toBeVisible()\n })\n\n await test.step(\"update the saved profile phone number\", async () => {\n await expect(profilePage.savedPhone).toHaveText(\"null\")\n await profilePage.phoneEditButton.click()\n await profilePage.phoneInput.fill(\"8888888888\")\n await profilePage.phoneSaveButton.click()\n await expect(profilePage.phoneSuccessMessage).toBeVisible()\n await expect(profilePage.savedPhone).toHaveText(\"8888888888\")\n })\n\n await test.step(\"verify the profile completion state and go back to the profile page\", async () => {\n await profilePage.overviewLink.click()\n await expect(overviewPage.profileCompletion).toHaveText(\"75%\")\n\n await profilePage.profileLink.click()\n await expect(profilePage.profileWrapper).toBeVisible()\n })\n\n await test.step(\"enter in the billing address\", async () => {\n await expect(profilePage.savedBillingAddress).toContainText(\n \"No billing address\"\n )\n await profilePage.billingAddressEditButton.click()\n await profilePage.billingFirstNameInput.fill(\"First\")\n await profilePage.billingLastNameInput.fill(\"Last\")\n await profilePage.billingAddress1Input.fill(\"123 Fake Street\")\n await profilePage.billingPostcalCodeInput.fill(\"11111\")\n await profilePage.billingCityInput.fill(\"Springdale\")\n await profilePage.billingProvinceInput.fill(\"IL\")\n await profilePage.billingCountryCodeSelect.selectOption({\n label: \"United States\",\n })\n await profilePage.billingAddressSaveButton.click()\n await expect(profilePage.billingAddressSuccessMessage).toBeVisible()\n })\n\n await test.step(\"profile completion state\", async () => {\n await profilePage.overviewLink.click()\n await expect(overviewPage.profileCompletion).toHaveText(\"100%\")\n\n await profilePage.goto()\n await expect(profilePage.savedBillingAddress).toContainText(\"First Last\")\n await expect(profilePage.savedBillingAddress).toContainText(\n \"123 Fake Street\"\n )\n await expect(profilePage.savedBillingAddress).toContainText(\n \"11111, Springdale\"\n )\n await expect(profilePage.savedBillingAddress).toContainText(\n \"United States\"\n )\n })\n })\n\n test(\"Profile changes persist across page refreshes and logouts\", async ({\n page,\n loginPage,\n accountOverviewPage: overviewPage,\n accountProfilePage: profilePage,\n }) => {\n await overviewPage.goto()\n await expect(overviewPage.profileCompletion).toHaveText(\"50%\")\n\n await test.step(\"navigate to the profile page\", async () => {\n await profilePage.profileLink.click()\n await expect(profilePage.profileWrapper).toBeVisible()\n })\n\n await test.step(\"update the first and last name\", async () => {\n await profilePage.nameEditButton.click()\n await profilePage.firstNameInput.fill(\"FirstNew\")\n await profilePage.lastNameInput.fill(\"LastNew\")\n await profilePage.nameSaveButton.click()\n await profilePage.nameSuccessMessage.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"update the saved profile phone number\", async () => {\n await expect(profilePage.savedPhone).toHaveText(\"null\")\n await profilePage.phoneEditButton.click()\n await profilePage.phoneInput.fill(\"8888888888\")\n await profilePage.phoneSaveButton.click()\n await expect(profilePage.phoneSuccessMessage).toBeVisible()\n await expect(profilePage.savedPhone).toHaveText(\"8888888888\")\n })\n\n await test.step(\"enter in the billing address\", async () => {\n await expect(profilePage.savedBillingAddress).toContainText(\n \"No billing address\"\n )\n await profilePage.billingAddressEditButton.click()\n await profilePage.billingFirstNameInput.fill(\"First\")\n await profilePage.billingLastNameInput.fill(\"Last\")\n await profilePage.billingAddress1Input.fill(\"123 Fake Street\")\n await profilePage.billingPostcalCodeInput.fill(\"11111\")\n await profilePage.billingCityInput.fill(\"Springdale\")\n await profilePage.billingProvinceInput.fill(\"IL\")\n await profilePage.billingCountryCodeSelect.selectOption({\n label: \"United States\",\n })\n await profilePage.billingAddressSaveButton.click()\n await expect(profilePage.billingAddressSuccessMessage).toBeVisible()\n })\n\n await test.step(\"Refresh page and verify information saved is still there\", async () => {\n await page.reload()\n await expect(profilePage.savedName).toContainText(\"FirstNew\")\n await expect(profilePage.savedName).toContainText(\"LastNew\")\n await expect(profilePage.savedPhone).toContainText(\"8888888888\")\n\n await expect(profilePage.savedBillingAddress).toContainText(\"First Last\")\n await expect(profilePage.savedBillingAddress).toContainText(\n \"123 Fake Street\"\n )\n await expect(profilePage.savedBillingAddress).toContainText(\n \"11111, Springdale\"\n )\n await expect(profilePage.savedBillingAddress).toContainText(\n \"United States\"\n )\n })\n\n await test.step(\"Log out and log back in\", async () => {\n await profilePage.logoutLink.click()\n await expect(loginPage.container).toBeVisible()\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"password\")\n await loginPage.signInButton.click()\n await overviewPage.overviewWrapper.waitFor({ state: \"visible\" })\n await overviewPage.profileLink.click()\n await profilePage.profileWrapper.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the saved profile information is correct\", async () => {\n await expect(profilePage.savedName).toContainText(\"FirstNew\")\n await expect(profilePage.savedName).toContainText(\"LastNew\")\n await expect(profilePage.savedPhone).toContainText(\"8888888888\")\n\n await expect(profilePage.savedBillingAddress).toContainText(\"First Last\")\n await expect(profilePage.savedBillingAddress).toContainText(\n \"123 Fake Street\"\n )\n await expect(profilePage.savedBillingAddress).toContainText(\n \"11111, Springdale\"\n )\n await expect(profilePage.savedBillingAddress).toContainText(\n \"United States\"\n )\n })\n })\n\n test(\"Verifies password changes work correctly\", async ({\n loginPage,\n accountProfilePage: profilePage,\n accountOverviewPage: overviewPage,\n }) => {\n await test.step(\"Navigate to the account Profile page\", async () => {\n await overviewPage.goto()\n await profilePage.profileLink.click()\n })\n\n await test.step(\"Update the password\", async () => {\n await profilePage.passwordEditButton.click()\n await profilePage.oldPasswordInput.fill(\"password\")\n await profilePage.newPasswordInput.fill(\"updated-password\")\n await profilePage.confirmPasswordInput.fill(\"updated-password\")\n await profilePage.passwordSaveButton.click()\n await expect(profilePage.passwordSuccessMessage).toBeVisible()\n })\n\n await test.step(\"logout and log back in\", async () => {\n await profilePage.logoutLink.click()\n await expect(loginPage.container).toBeVisible()\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"updated-password\")\n await loginPage.signInButton.click()\n await expect(overviewPage.container).toBeVisible()\n })\n })\n\n test(\"Check if changing email address updates user correctly\", async ({\n loginPage,\n accountProfilePage: profilePage,\n accountOverviewPage: accountPage,\n }) => {\n await test.step(\"Update the user email\", async () => {\n await accountPage.goto()\n await accountPage.welcomeMessage.waitFor({ state: \"visible\" })\n await accountPage.profileLink.click()\n await profilePage.profileWrapper.waitFor({ state: \"visible\" })\n await profilePage.emailEditButton.click()\n await profilePage.emailInput.fill(\"test-111@example.com\")\n await profilePage.emailSaveButton.click()\n await profilePage.emailSuccessMessage.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Try logging in again with the old email\", async () => {\n await profilePage.logoutLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"password\")\n await loginPage.signInButton.click()\n await loginPage.errorMessage.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Login with the new email\", async () => {\n await loginPage.emailInput.fill(\"test-111@example.com\")\n await loginPage.signInButton.click()\n await accountPage.welcomeMessage.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Set the email back to test@example.com\", async () => {\n await accountPage.profileLink.click()\n await profilePage.profileWrapper.waitFor({ state: \"visible\" })\n await profilePage.emailEditButton.click()\n await profilePage.emailInput.fill(\"test@example.com\")\n await profilePage.emailSaveButton.click()\n await profilePage.emailSuccessMessage.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Try logging out and logging in with the first email\", async () => {\n await profilePage.logoutLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"password\")\n await loginPage.signInButton.click()\n await accountPage.welcomeMessage.waitFor({ state: \"visible\" })\n })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/global/public-setup.ts",
"content": "import { test as setup } from \"@playwright/test\"\nimport { seedData } from \"../../data/seed\"\n\nsetup(\"Seed data\", async () => {\n await seedData()\n})\n"
},
{
"path": "storefront/e2e/tests/global/setup.ts",
"content": "import { test as setup } from \"@playwright/test\"\nimport { seedData } from \"../../data/seed\"\nimport { OverviewPage as AccountOverviewPage } from \"../../fixtures/account/overview-page\"\nimport { LoginPage } from \"../../fixtures/account/login-page\"\nimport { STORAGE_STATE } from \"../../../playwright.config\"\n\nsetup(\n \"Seed data and create session for authenticated user\",\n async ({ page }) => {\n const seed = await seedData()\n const user = seed.user\n\n const loginPage = new LoginPage(page)\n const accountPage = new AccountOverviewPage(page)\n await loginPage.goto()\n await loginPage.emailInput.fill(user?.email!)\n await loginPage.passwordInput.fill(user?.password!)\n await loginPage.signInButton.click()\n await accountPage.welcomeMessage.waitFor({ state: \"visible\" })\n\n await page.context().storageState({\n path: STORAGE_STATE,\n })\n }\n)\n"
},
{
"path": "storefront/e2e/tests/global/teardown.ts",
"content": "import { test as teardown } from \"@playwright/test\"\nimport { dropTemplate, resetDatabase } from \"../../data/reset\"\n\nteardown(\"Reset the database and the drop the template database\", async () => {\n await resetDatabase()\n await dropTemplate()\n})\n"
},
{
"path": "storefront/e2e/tests/public/cart.spec.ts",
"content": "/*\nTest List\n- login from the sign in page redirects you page to the cart\n*/\nimport { test, expect } from \"../../index\"\nimport { compareFloats, getFloatValue } from \"../../utils\"\n\ntest.describe(\"Cart tests\", async () => {\n test(\"Ensure adding multiple items from a product page adjusts the cart accordingly\", async ({\n page,\n cartPage,\n productPage,\n storePage,\n }) => {\n // Assuming we have access to our page objects here\n const cartDropdown = cartPage.cartDropdown\n\n await test.step(\"Navigate to the product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the small size to the cart and verify the data\", async () => {\n await productPage.selectOption(\"S\")\n await productPage.addProductButton.click()\n await expect(cartDropdown.navCartLink).toContainText(\"(1)\")\n const cartItem = await cartDropdown.getCartItem(\"Sweatshirt\", \"S\")\n await expect(cartItem.locator).toBeVisible()\n await expect(cartItem.variant).toContainText(\"S\")\n await expect(cartItem.quantity).toContainText(\"1\")\n await cartDropdown.goToCartButton.click()\n await cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n const productInCart = await cartPage.getProduct(\"Sweatshirt\", \"S\")\n await expect(productInCart.productRow).toBeVisible()\n await expect(productInCart.quantitySelect).toHaveValue(\"1\")\n await page.goBack()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the small size to the cart again and verify the data\", async () => {\n await productPage.selectOption(\"S\")\n await productPage.addProductButton.click()\n await expect(cartDropdown.navCartLink).toContainText(\"(2)\")\n const cartItem = await cartDropdown.getCartItem(\"Sweatshirt\", \"S\")\n await expect(cartItem.locator).toBeVisible()\n await expect(cartItem.variant).toContainText(\"S\")\n await expect(cartItem.quantity).toContainText(\"2\")\n await cartDropdown.goToCartButton.click()\n await cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n const productInCart = await cartPage.getProduct(\"Sweatshirt\", \"S\")\n await expect(productInCart.productRow).toBeVisible()\n await expect(productInCart.quantitySelect).toHaveValue(\"2\")\n await page.goBack()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the medium size to the cart and verify the data\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.addProductButton.click()\n await expect(cartDropdown.navCartLink).toContainText(\"(3)\")\n const mediumCartItem = await cartDropdown.getCartItem(\"Sweatshirt\", \"M\")\n await expect(mediumCartItem.locator).toBeVisible()\n await expect(mediumCartItem.variant).toContainText(\"M\")\n await expect(mediumCartItem.quantity).toContainText(\"1\")\n await cartDropdown.goToCartButton.click()\n await cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n const mediumProductInCart = await cartPage.getProduct(\"Sweatshirt\", \"M\")\n await expect(mediumProductInCart.productRow).toBeVisible()\n await expect(mediumProductInCart.quantitySelect).toHaveValue(\"1\")\n const smallProductInCart = await cartPage.getProduct(\"Sweatshirt\", \"S\")\n await expect(smallProductInCart.productRow).toBeVisible()\n await expect(smallProductInCart.quantitySelect).toHaveValue(\"2\")\n })\n })\n\n test(\"Ensure adding two products into the cart and verify the quantities\", async ({\n cartPage,\n productPage,\n storePage,\n }) => {\n const cartDropdown = cartPage.cartDropdown\n\n await test.step(\"Navigate to the product page - go to the store page and click on the Sweatshirt product\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the small sweatshirt to the cart\", async () => {\n await productPage.selectOption(\"S\")\n await productPage.addProductButton.click()\n await expect(cartDropdown.navCartLink).toContainText(\"(1)\")\n const sweatshirtItem = await cartDropdown.getCartItem(\"Sweatshirt\", \"S\")\n await expect(sweatshirtItem.locator).toBeVisible()\n await expect(sweatshirtItem.variant).toHaveText(\"Variant: S\")\n await expect(sweatshirtItem.quantity).toContainText(\"1\")\n await cartDropdown.close()\n })\n\n await test.step(\"Navigate to another product - Sweatpants\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the small sweatpants to the cart\", async () => {\n await productPage.selectOption(\"S\")\n await productPage.addProductButton.click()\n await expect(cartDropdown.navCartLink).toContainText(\"(2)\")\n const sweatpantsItem = await cartDropdown.getCartItem(\"Sweatpants\", \"S\")\n await expect(sweatpantsItem.locator).toBeVisible()\n await expect(sweatpantsItem.variant).toHaveText(\"Variant: S\")\n await expect(sweatpantsItem.quantity).toContainText(\"1\")\n const sweatshirtItem = await cartDropdown.getCartItem(\"Sweatshirt\", \"S\")\n await expect(sweatshirtItem.locator).toBeVisible()\n await expect(sweatshirtItem.quantity).toContainText(\"1\")\n await cartDropdown.goToCartButton.click()\n await cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the quantities in the cart\", async () => {\n const sweatpantsProduct = await cartPage.getProduct(\"Sweatpants\", \"S\")\n await expect(sweatpantsProduct.productRow).toBeVisible()\n await expect(sweatpantsProduct.quantitySelect).toHaveValue(\"1\")\n const sweatshirtProduct = await cartPage.getProduct(\"Sweatshirt\", \"S\")\n await expect(sweatshirtProduct.productRow).toBeVisible()\n await expect(sweatshirtProduct.quantitySelect).toHaveValue(\"1\")\n })\n })\n\n test(\"Verify the prices carries over to checkout\", async ({\n cartPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to the product page - go to the store page and click on the Hoodie product\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Hoodie\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n let hoodieSmallPrice = 0\n let hoodieMediumPrice = 0\n await test.step(\"Add the hoodie to the cart\", async () => {\n await productPage.selectOption(\"S\")\n hoodieSmallPrice = getFloatValue(\n (await productPage.productPrice.getAttribute(\"data-value\")) || \"0\"\n )\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await productPage.selectOption(\"M\")\n hoodieMediumPrice = getFloatValue(\n (await productPage.productPrice.getAttribute(\"data-value\")) || \"0\"\n )\n await productPage.clickAddProduct()\n\n await productPage.cartDropdown.close()\n })\n\n await test.step(\"Navigate to another product - Longsleeve\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Longsleeve\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n let longsleeveSmallPrice = 0\n await test.step(\"Add the small longsleeve to the cart\", async () => {\n await productPage.selectOption(\"S\")\n longsleeveSmallPrice = getFloatValue(\n (await productPage.productPrice.getAttribute(\"data-value\")) || \"0\"\n )\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await productPage.selectOption(\"S\")\n await productPage.clickAddProduct()\n await productPage.selectOption(\"S\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.goToCartButton.click()\n await productPage.cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the price in the cart is the expected value\", async () => {\n const total = getFloatValue(\n (await cartPage.cartSubtotal.getAttribute(\"data-value\")) || \"0\"\n )\n const calculatedTotal =\n 3 * longsleeveSmallPrice + hoodieSmallPrice + hoodieMediumPrice\n expect(compareFloats(total, calculatedTotal)).toBe(0)\n })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/public/checkout.spec.ts",
"content": "import { test, expect } from \"../../index\"\nimport { compareFloats, getFloatValue } from \"../../utils\"\n\ntest.describe(\"Checkout flow tests\", async () => {\n test(\"Default checkout flow\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.billingAddressCheckbox.uncheck()\n })\n\n await test.step(\"Enter in the billing address info\", async () => {\n await checkoutPage.billingFirstNameInput.fill(\"First\")\n await checkoutPage.billingLastNameInput.fill(\"Last\")\n await checkoutPage.billingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.billingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.billingPostalInput.fill(\"80010\")\n await checkoutPage.billingCityInput.fill(\"Denver\")\n await checkoutPage.billingProvinceInput.fill(\"Colorado\")\n await checkoutPage.billingCountrySelect.selectOption(\"United States\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the products ordered are correct\", async () => {\n const product = await orderPage.getProduct(\"Sweatshirt\", \"M\")\n await expect(product.name).toContainText(\"Sweatshirt\")\n await expect(product.variant).toContainText(\"M\")\n await expect(product.quantity).toContainText(\"1\")\n })\n\n await test.step(\"Verify the shipping info is correct\", async () => {\n const address = orderPage.shippingAddressSummary\n await expect(address).toContainText(\"First\")\n await expect(address).toContainText(\"Last\")\n await expect(address).toContainText(\"123 Fake street\")\n await expect(address).toContainText(\"80010\")\n await expect(address).toContainText(\"Denver\")\n await expect(address).toContainText(\"US\")\n\n const contact = orderPage.shippingContactSummary\n await expect(contact).toContainText(\"test@example.com\")\n await expect(contact).toContainText(\"3031112222\")\n\n const method = orderPage.shippingMethodSummary\n await expect(method).toContainText(\"FakeEx Standard\")\n })\n })\n\n test(\"Editing checkout steps works as expected\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.billingAddressCheckbox.uncheck()\n })\n\n await test.step(\"Enter in the billing address info\", async () => {\n await checkoutPage.billingFirstNameInput.fill(\"First\")\n await checkoutPage.billingLastNameInput.fill(\"Last\")\n await checkoutPage.billingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.billingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.billingPostalInput.fill(\"80010\")\n await checkoutPage.billingCityInput.fill(\"Denver\")\n await checkoutPage.billingProvinceInput.fill(\"Colorado\")\n await checkoutPage.billingCountrySelect.selectOption(\"United States\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Submit the delivery and payment options\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.click()\n })\n\n await test.step(\"Edit the shipping info\", async () => {\n await checkoutPage.editAddressButton.click()\n await test.step(\"Edit the shipping address\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First1\")\n await checkoutPage.shippingLastNameInput.fill(\"Last1\")\n await checkoutPage.shippingCompanyInput.fill(\"MeCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake Road\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80011\")\n await checkoutPage.shippingCityInput.fill(\"Donver\")\n await checkoutPage.shippingProvinceInput.fill(\"CO\")\n await checkoutPage.shippingCountrySelect.selectOption(\"Canada\")\n })\n\n await test.step(\"Edit the shipping contact info\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"tester@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3231112222\")\n })\n\n await test.step(\"Edit the billing info\", async () => {\n await checkoutPage.billingFirstNameInput.fill(\"Farst\")\n await checkoutPage.billingLastNameInput.fill(\"List\")\n await checkoutPage.billingCompanyInput.fill(\"MistCorp\")\n await checkoutPage.billingAddressInput.fill(\"321 Fake street\")\n await checkoutPage.billingPostalInput.fill(\"80110\")\n await checkoutPage.billingCityInput.fill(\"Denvur\")\n await checkoutPage.billingProvinceInput.fill(\"AB\")\n await checkoutPage.billingCountrySelect.selectOption(\"Canada\")\n })\n await checkoutPage.submitAddressButton.click()\n })\n\n await test.step(\"Make sure the edits are reflected in the container\", async () => {\n await test.step(\"Check shipping address summary\", async () => {\n const shippingColumn = checkoutPage.shippingAddressSummary\n await expect(shippingColumn).toContainText(\"First1\")\n await expect(shippingColumn).toContainText(\"Last1\")\n await expect(shippingColumn).toContainText(\"123 Fake Road\")\n await expect(shippingColumn).toContainText(\"80011\")\n await expect(shippingColumn).toContainText(\"Donver\")\n await expect(shippingColumn).toContainText(\"CA\")\n })\n\n await test.step(\"Check shipping contact summary\", async () => {\n const contactColumn = checkoutPage.shippingContactSummary\n await expect(contactColumn).toContainText(\"tester@example.com\")\n await expect(contactColumn).toContainText(\"3231112222\")\n })\n\n await test.step(\"Check billing summary\", async () => {\n const billingColumn = checkoutPage.billingAddressSummary\n await expect(billingColumn).toContainText(\"Farst\")\n await expect(billingColumn).toContainText(\"List\")\n await expect(billingColumn).toContainText(\"321 Fake street\")\n await expect(billingColumn).toContainText(\"Denvur\")\n await expect(billingColumn).toContainText(\"CA\")\n })\n })\n })\n\n test(\"Shipping info saved is filled back into the forms after clicking edit\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.billingAddressCheckbox.uncheck()\n })\n\n await test.step(\"Enter in the billing address info\", async () => {\n await checkoutPage.billingFirstNameInput.fill(\"First\")\n await checkoutPage.billingLastNameInput.fill(\"Last\")\n await checkoutPage.billingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.billingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.billingPostalInput.fill(\"80010\")\n await checkoutPage.billingCityInput.fill(\"Denver\")\n await checkoutPage.billingProvinceInput.fill(\"Colorado\")\n await checkoutPage.billingCountrySelect.selectOption(\"United States\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Click the edit address form and ensure the fields are filled correctly\", async () => {\n await checkoutPage.editAddressButton.click()\n await test.step(\"Check the shipping address\", async () => {\n await expect(checkoutPage.shippingFirstNameInput).toHaveValue(\"First\")\n await expect(checkoutPage.shippingLastNameInput).toHaveValue(\"Last\")\n await expect(checkoutPage.shippingCompanyInput).toHaveValue(\"MyCorp\")\n await expect(checkoutPage.shippingAddressInput).toHaveValue(\n \"123 Fake street\"\n )\n await expect(checkoutPage.shippingPostalCodeInput).toHaveValue(\"80010\")\n await expect(checkoutPage.shippingCityInput).toHaveValue(\"Denver\")\n await expect(checkoutPage.shippingProvinceInput).toHaveValue(\"Colorado\")\n await expect(checkoutPage.shippingCountrySelect).toHaveValue(\"us\")\n })\n\n await test.step(\"Check the shipping contact\", async () => {\n await expect(checkoutPage.shippingEmailInput).toHaveValue(\n \"test@example.com\"\n )\n await expect(checkoutPage.shippingPhoneInput).toHaveValue(\"3031112222\")\n })\n\n await test.step(\"Check the billing address\", async () => {\n await expect(checkoutPage.billingFirstNameInput).toHaveValue(\"First\")\n await expect(checkoutPage.billingLastNameInput).toHaveValue(\"Last\")\n await expect(checkoutPage.billingCompanyInput).toHaveValue(\"MyCorp\")\n await expect(checkoutPage.billingAddressInput).toHaveValue(\n \"123 Fake street\"\n )\n await expect(checkoutPage.billingPostalInput).toHaveValue(\"80010\")\n await expect(checkoutPage.billingCityInput).toHaveValue(\"Denver\")\n await expect(checkoutPage.billingProvinceInput).toHaveValue(\"Colorado\")\n await expect(checkoutPage.billingCountrySelect).toHaveValue(\"us\")\n })\n })\n\n await test.step(\"Set the billing info to the same as checked and perform checks\", async () => {\n await checkoutPage.billingAddressCheckbox.check()\n await checkoutPage.submitAddressButton.click()\n await checkoutPage.editAddressButton.click()\n await expect(checkoutPage.billingAddressCheckbox).toBeChecked()\n })\n })\n\n test(\"Shipping info in the checkout page is correctly reflected in the summary\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.billingAddressCheckbox.uncheck()\n })\n\n await test.step(\"Enter in the billing address info\", async () => {\n await checkoutPage.billingFirstNameInput.fill(\"First\")\n await checkoutPage.billingLastNameInput.fill(\"Last\")\n await checkoutPage.billingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.billingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.billingPostalInput.fill(\"80010\")\n await checkoutPage.billingCityInput.fill(\"Denver\")\n await checkoutPage.billingProvinceInput.fill(\"Colorado\")\n await checkoutPage.billingCountrySelect.selectOption(\"United States\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Ensure the shipping column reflects the entered data\", async () => {\n const shippingColumn = checkoutPage.shippingAddressSummary\n await expect(shippingColumn).toContainText(\"First\")\n await expect(shippingColumn).toContainText(\"Last\")\n await expect(shippingColumn).toContainText(\"123 Fake street\")\n await expect(shippingColumn).toContainText(\"80010\")\n await expect(shippingColumn).toContainText(\"Denver\")\n await expect(shippingColumn).toContainText(\"US\")\n })\n\n await test.step(\"Ensure the contact column reflects the entered data\", async () => {\n const contactColumn = checkoutPage.shippingContactSummary\n await expect(contactColumn).toContainText(\"test@example.com\")\n await expect(contactColumn).toContainText(\"3031112222\")\n })\n\n await test.step(\"Ensure the billing column reflects the entered data\", async () => {\n const billingColumn = checkoutPage.billingAddressSummary\n await expect(billingColumn).toContainText(\"First\")\n await expect(billingColumn).toContainText(\"Last\")\n await expect(billingColumn).toContainText(\"123 Fake street\")\n await expect(billingColumn).toContainText(\"Denver\")\n await expect(billingColumn).toContainText(\"US\")\n })\n\n await test.step(\"Edit the billing info so it is the same as the billing address\", async () => {\n await checkoutPage.editAddressButton.click()\n await checkoutPage.billingAddressCheckbox.check()\n await checkoutPage.submitAddressButton.click()\n const billingColumn = checkoutPage.billingAddressSummary\n await expect(billingColumn).toContainText(\"are the same.\")\n })\n })\n\n test(\"Entering checkout, leaving, then returning takes you back to the correct checkout spot\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Navigate away and back to the checkout page\", async () => {\n await checkoutPage.backToCartLink.click()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n await expect(checkoutPage.submitAddressButton).toBeVisible()\n })\n\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.billingAddressCheckbox.uncheck()\n })\n\n await test.step(\"Enter in the billing address info\", async () => {\n await checkoutPage.billingFirstNameInput.fill(\"First\")\n await checkoutPage.billingLastNameInput.fill(\"Last\")\n await checkoutPage.billingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.billingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.billingPostalInput.fill(\"80010\")\n await checkoutPage.billingCityInput.fill(\"Denver\")\n await checkoutPage.billingProvinceInput.fill(\"Colorado\")\n await checkoutPage.billingCountrySelect.selectOption(\"United States\")\n })\n await checkoutPage.submitAddressButton.click()\n await checkoutPage.deliveryOptionRadio\n .first()\n .waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Navigate away and back to the checkout page\", async () => {\n await checkoutPage.backToCartLink.click()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n await expect(checkoutPage.submitDeliveryOptionButton).toBeVisible()\n })\n\n await test.step(\"Submit the delivery choice and navigate back and forth\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n await checkoutPage.submitPaymentButton.waitFor({ state: \"visible\" })\n await checkoutPage.backToCartLink.click()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n await expect(checkoutPage.submitPaymentButton).toBeVisible()\n })\n\n await test.step(\"Submit the payment info and navigate back and forth\", async () => {\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.waitFor({ state: \"visible\" })\n await checkoutPage.backToCartLink.click()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n await expect(checkoutPage.submitPaymentButton).toBeVisible()\n })\n\n await test.step(\"Click edit on the shipping info and navigate back and forth\", async () => {\n await checkoutPage.editAddressButton.click()\n await checkoutPage.backToCartLink.click()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n await expect(checkoutPage.submitPaymentButton).toBeVisible()\n })\n\n await test.step(\"Click edit on the shipping choice and navigate back and forth\", async () => {\n await checkoutPage.editDeliveryButton.click()\n await checkoutPage.backToCartLink.click()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n await expect(checkoutPage.submitPaymentButton).toBeVisible()\n })\n })\n\n test(\"Verify the prices carries over to checkout\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Navigate to the product page - go to the store page and click on the Sweatshirt product\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n let sweatshirtSmallPrice = 0\n let sweatshirtMediumPrice = 0\n await test.step(\"Add the sweatshirts to the cart\", async () => {\n await productPage.selectOption(\"S\")\n sweatshirtSmallPrice = getFloatValue(\n (await productPage.productPrice.getAttribute(\"data-value\")) || \"0\"\n )\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await productPage.selectOption(\"M\")\n sweatshirtMediumPrice = getFloatValue(\n (await productPage.productPrice.getAttribute(\"data-value\")) || \"0\"\n )\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n })\n\n await test.step(\"Navigate to another product - Sweatpants\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n let sweatpantsSmallPrice = 0\n await test.step(\"Add the small sweatpants to the cart\", async () => {\n await productPage.selectOption(\"S\")\n sweatpantsSmallPrice = getFloatValue(\n (await productPage.productPrice.getAttribute(\"data-value\")) || \"0\"\n )\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await productPage.selectOption(\"S\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.goToCartButton.click()\n await productPage.cartDropdown.close()\n await cartPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Verify the price in the cart is the expected value\", async () => {\n const total = getFloatValue(\n (await cartPage.cartSubtotal.getAttribute(\"data-value\")) || \"0\"\n )\n const calculatedTotal =\n 2 * sweatpantsSmallPrice + sweatshirtSmallPrice + sweatshirtMediumPrice\n expect(compareFloats(total, calculatedTotal)).toBe(0)\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Go to checkout and verify the price in the checkout is the expected value\", async () => {\n const total = getFloatValue(\n (await checkoutPage.cartSubtotal.getAttribute(\"data-value\")) || \"0\"\n )\n const calculatedTotal =\n 2 * sweatpantsSmallPrice + sweatshirtSmallPrice + sweatpantsSmallPrice\n expect(compareFloats(total, calculatedTotal)).toBe(0)\n })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/public/discount.spec.ts",
"content": "import { seedDiscount, seedUser } from \"../../data/seed\"\nimport { test, expect } from \"../../index\"\n\ntest.describe(\"Discount tests\", async () => {\n let discount = {\n id: \"\",\n code: \"\",\n rule_id: \"\",\n amount: 0,\n }\n test.beforeEach(async () => {\n discount = await seedDiscount()\n })\n\n test(\"Make sure discount works during transaction\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = 0\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal = Number(\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n )\n })\n await test.step(\"Navigate to the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n\n await test.step(\"Enter in the discount and assert value works\", async () => {\n await checkoutPage.discountButton.click()\n await expect(checkoutPage.discountInput).toBeVisible()\n await checkoutPage.discountInput.fill(discount.code)\n await checkoutPage.discountApplyButton.click()\n const paymentDiscount = await checkoutPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toHaveText(discount.code)\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n let shippingTotal = 0\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal = Number(\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"0\"\n )\n await checkoutPage.submitPaymentButton.click()\n })\n\n await test.step(\"Make sure the cart total is the expected value after selecting shipping\", async () => {\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount + shippingTotal).toString()\n )\n })\n\n await test.step(\"Finish completing the order\", async () => {\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = Number(cartSubtotal) + Number(shippingTotal)\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartTotal - discount.amount).toString()\n )\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal.toString()\n )\n expect(await orderPage.cartDiscount.getAttribute(\"data-value\")).toBe(\n discount.amount.toString()\n )\n })\n })\n\n test(\"Make sure discount can be used when entered in from cart\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = 0\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal = Number(\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n )\n })\n })\n\n await test.step(\"Enter in the discount and assert value works\", async () => {\n await cartPage.discountButton.click()\n await expect(cartPage.discountInput).toBeVisible()\n await cartPage.discountInput.fill(discount.code)\n await cartPage.discountApplyButton.click()\n const paymentDiscount = await cartPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toHaveText(discount.code)\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n await test.step(\"Go to checkout and assert the value is still discounted\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n let shippingTotal = 0\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal = Number(\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"0\"\n )\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = Number(cartSubtotal) + Number(shippingTotal)\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartTotal - discount.amount).toString()\n )\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal.toString()\n )\n expect(await orderPage.cartDiscount.getAttribute(\"data-value\")).toBe(\n discount.amount.toString()\n )\n })\n })\n\n test(\"Ensure adding and removing a discout does not impact checkout amount\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = 0\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal = Number(\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n )\n })\n })\n\n await test.step(\"Enter in the discount and assert value works\", async () => {\n await cartPage.discountButton.click()\n await expect(cartPage.discountInput).toBeVisible()\n await cartPage.discountInput.fill(discount.code)\n await cartPage.discountApplyButton.click()\n const paymentDiscount = await cartPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toHaveText(discount.code)\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n await test.step(\"Go to checkout and assert the value is still discounted\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n const paymentDiscount = await checkoutPage.getDiscount(discount.code)\n await paymentDiscount.removeButton.click()\n await expect(paymentDiscount.locator).not.toBeVisible()\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).not.toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n let shippingTotal = \"\"\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal =\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"\"\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = (Number(cartSubtotal) + Number(shippingTotal)).toString()\n\n await test.step(\"Assert the order page shows the total was not discounted\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\n cartTotal\n )\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal.toString()\n )\n })\n })\n\n test(\"Make sure a fake discount displays an error message on the cart page\", async ({\n cartPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n })\n })\n await test.step(\"Enter in the fake discount\", async () => {\n await cartPage.discountButton.click()\n await expect(cartPage.discountInput).toBeVisible()\n await cartPage.discountInput.fill(\"__FAKE_DISCOUNT_DNE_1111111\")\n await cartPage.discountApplyButton.click()\n await expect(cartPage.discountErrorMessage).toBeVisible()\n })\n })\n\n test(\"Make sure a fake discount displays an error message on the checkout page\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n await test.step(\"Enter in the fake discount\", async () => {\n await checkoutPage.discountButton.click()\n await expect(checkoutPage.discountInput).toBeVisible()\n await checkoutPage.discountInput.fill(\"__FAKE_DISCOUNT_DNE_1111111\")\n await checkoutPage.discountApplyButton.click()\n await expect(checkoutPage.discountErrorMessage).toBeVisible()\n })\n })\n\n test(\"Adding a discount and then accessing the cart at a later point keeps the discount amount\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = 0\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal = Number(\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n )\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await cartPage.discountInput.fill(discount.code)\n await cartPage.discountApplyButton.click()\n const paymentDiscount = await cartPage.getDiscount(discount.code)\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n await test.step(\"Navigate away from the cart page and return to it\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n await cartPage.goto()\n await cartPage.cartDropdown.close()\n })\n\n await test.step(\"Verify the giftcard is still on the cart page\", async () => {\n const paymentDiscount = await cartPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toContainText(discount.code)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n await test.step(\"Verify the giftcard is still on the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n const paymentDiscount = await checkoutPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toContainText(discount.code)\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n })\n })\n\n test(\"Adding a discount and then adding another item to the cart keeps the discount\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = 0\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal = Number(\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n )\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await cartPage.discountInput.fill(discount.code)\n await cartPage.discountApplyButton.click()\n const paymentDiscount = await cartPage.getDiscount(discount.code)\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n await test.step(\"Navigate away from the cart page and return to it\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n await productPage.selectOption(\"XL\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await cartPage.goto()\n cartSubtotal = Number(\n (await cartPage.cartSubtotal.getAttribute(\"data-value\")) || \"\"\n )\n })\n\n await test.step(\"Verify the giftcard is still on the cart page\", async () => {\n const paymentDiscount = await cartPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toContainText(discount.code)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n })\n\n await test.step(\"Verify the giftcard is still on the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n const paymentDiscount = await checkoutPage.getDiscount(discount.code)\n await expect(paymentDiscount.locator).toBeVisible()\n await expect(paymentDiscount.code).toContainText(discount.code)\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n (cartSubtotal - discount.amount).toString()\n )\n expect(paymentDiscount.amountValue).toBe(discount.amount.toString())\n })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/public/giftcard.spec.ts",
"content": "import { first } from \"lodash\"\nimport { seedGiftcard, seedUser } from \"../../data/seed\"\nimport { test, expect } from \"../../index\"\n\ntest.describe(\"Gift card tests\", async () => {\n let giftcard = {\n id: \"\",\n code: \"\",\n value: 0,\n amount: \"0\",\n balance: \"\",\n }\n test.beforeEach(async () => {\n giftcard = await seedGiftcard()\n })\n\n test(\"Make sure giftcard can be used to pay for transaction\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = \"\"\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal =\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n })\n await test.step(\"Navigate to the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await checkoutPage.discountButton.click()\n await expect(checkoutPage.discountInput).toBeVisible()\n await checkoutPage.discountInput.fill(giftcard.code)\n await checkoutPage.discountApplyButton.click()\n const paymentGiftcard = await checkoutPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toHaveText(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n let shippingTotal = \"\"\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal =\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"\"\n await checkoutPage.submitPaymentButton.click()\n })\n\n await test.step(\"Make sure the giftcard still has the total as zero after selecting shipping\", async () => {\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n \"0\"\n )\n })\n\n await test.step(\"Finish completing the order\", async () => {\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = (Number(cartSubtotal) + Number(shippingTotal)).toString()\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal\n )\n expect(\n await orderPage.cartGiftCardAmount.getAttribute(\"data-value\")\n ).toBe(cartTotal)\n })\n })\n\n test(\"Make sure giftcard can be used when entered in from cart\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = \"\"\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal =\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await expect(cartPage.discountInput).toBeVisible()\n await cartPage.discountInput.fill(giftcard.code)\n await cartPage.discountApplyButton.click()\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toHaveText(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Go to checkout and assert the value is still 0\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n let shippingTotal = \"\"\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal =\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"\"\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = (Number(cartSubtotal) + Number(shippingTotal)).toString()\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal\n )\n expect(\n await orderPage.cartGiftCardAmount.getAttribute(\"data-value\")\n ).toBe(cartTotal)\n })\n })\n\n test(\"Ensure adding and removing a giftcard does not impact checkout amount\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let cartSubtotal = \"\"\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal =\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await expect(cartPage.discountInput).toBeVisible()\n await cartPage.discountInput.fill(giftcard.code)\n await cartPage.discountApplyButton.click()\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toHaveText(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Go to checkout and assert the value is still 0\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n const paymentGiftcard = await checkoutPage.getGiftCard(giftcard.code)\n await paymentGiftcard.removeButton.click()\n await expect(paymentGiftcard.locator).not.toBeVisible()\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).not.toBe(\n \"0\"\n )\n })\n\n let shippingTotal = \"\"\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\"United States\")\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal =\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"\"\n await checkoutPage.submitPaymentButton.click()\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = (Number(cartSubtotal) + Number(shippingTotal)).toString()\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\n cartTotal\n )\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal\n )\n })\n })\n\n test(\"Make sure a fake gift card displays an error message on the cart page\", async ({\n cartPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n })\n })\n await test.step(\"Enter in the fake giftcard\", async () => {\n await cartPage.discountButton.click()\n await expect(cartPage.discountInput).toBeVisible()\n await cartPage.discountInput.fill(\"__FAKE_GIFT_CARD_DNE_1111111\")\n await cartPage.discountApplyButton.click()\n await expect(cartPage.discountErrorMessage).toBeVisible()\n })\n })\n\n test(\"Make sure a fake gift card displays an error message on the checkout page\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.highlight()\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n await test.step(\"Enter in the fake giftcard\", async () => {\n await checkoutPage.discountButton.click()\n await expect(checkoutPage.discountInput).toBeVisible()\n await checkoutPage.discountInput.fill(\"__FAKE_GIFT_CARD_DNE_1111111\")\n await checkoutPage.discountApplyButton.click()\n await expect(checkoutPage.discountErrorMessage).toBeVisible()\n })\n })\n\n test(\"Adding a giftcard and then accessing the cart at a later point keeps the giftcard amount\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await cartPage.discountInput.fill(giftcard.code)\n await cartPage.discountApplyButton.click()\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Navigate away from the cart page and return to it\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n await cartPage.goto()\n })\n\n await test.step(\"Verify the giftcard is still on the cart page\", async () => {\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toContainText(giftcard.code)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Verify the giftcard is still on the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n const paymentGiftcard = await checkoutPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toContainText(giftcard.code)\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n })\n })\n\n test(\"Adding a giftcard and then adding another item to the cart keeps the giftcard\", async ({\n cartPage,\n checkoutPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await cartPage.discountInput.fill(giftcard.code)\n await cartPage.discountApplyButton.click()\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Navigate away from the cart page and return to it\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatpants\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n await productPage.selectOption(\"XL\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.close()\n await cartPage.goto()\n })\n\n await test.step(\"Verify the giftcard is still on the cart page\", async () => {\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toContainText(giftcard.code)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Verify the giftcard is still on the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n const paymentGiftcard = await checkoutPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toContainText(giftcard.code)\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n })\n })\n\n test(\"Applying a giftcard, deleting cookies, and then reapplying the giftcard works\", async ({\n cartPage,\n productPage,\n storePage,\n }) => {\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await cartPage.discountInput.fill(giftcard.code)\n await cartPage.discountApplyButton.click()\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n\n await test.step(\"Navigate away from the cart page and delete cookies\", async () => {\n const context = storePage.page.context()\n await context.clearCookies()\n await storePage.page.reload()\n await storePage.goto()\n })\n\n await test.step(\"Recreate the cart\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n })\n })\n await test.step(\"Re-enter in the giftcard and assert value works\", async () => {\n await cartPage.discountButton.click()\n await cartPage.discountInput.fill(giftcard.code)\n await cartPage.discountApplyButton.click()\n const paymentGiftcard = await cartPage.getGiftCard(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await cartPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n })\n })\n\n test(\"Gift card balance works as expected across transactions\", async ({\n cartPage,\n checkoutPage,\n orderPage,\n productPage,\n storePage,\n }) => {\n let firstTransactionTotal = 0\n await test.step(\"Complete first transaction using the giftcard\", async () => {\n let cartSubtotal = \"\"\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal =\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n })\n await test.step(\"Navigate to the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await checkoutPage.discountButton.click()\n await expect(checkoutPage.discountInput).toBeVisible()\n await checkoutPage.discountInput.fill(giftcard.code)\n await checkoutPage.discountApplyButton.click()\n const paymentGiftcard = await checkoutPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toHaveText(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(giftcard.amount)\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n \"0\"\n )\n })\n\n let shippingTotal = \"\"\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\n \"United States\"\n )\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal =\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"\"\n await checkoutPage.submitPaymentButton.click()\n })\n\n await test.step(\"Make sure the giftcard still has the total as zero after selecting shipping\", async () => {\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n \"0\"\n )\n })\n\n await test.step(\"Finish completing the order\", async () => {\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = Number(cartSubtotal) + Number(shippingTotal)\n firstTransactionTotal = cartTotal\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal\n )\n expect(\n await orderPage.cartGiftCardAmount.getAttribute(\"data-value\")\n ).toBe(cartTotal.toString())\n })\n })\n await test.step(\"Setup the second transaction with the same giftcard\", async () => {\n let cartSubtotal = \"\"\n await test.step(\"Go through purchasing process, upto the cart page\", async () => {\n await test.step(\"Navigate to a product page\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n })\n\n await test.step(\"Add the product to the cart and goto checkout\", async () => {\n await productPage.selectOption(\"M\")\n await productPage.clickAddProduct()\n await productPage.cartDropdown.navCartLink.click()\n await productPage.cartDropdown.goToCartButton.click()\n await cartPage.container.waitFor({ state: \"visible\" })\n await cartPage.cartDropdown.close()\n cartSubtotal =\n (await cartPage.cartTotal.getAttribute(\"data-value\")) || \"\"\n })\n await test.step(\"Navigate to the checkout page\", async () => {\n await cartPage.checkoutButton.click()\n await checkoutPage.container.waitFor({ state: \"visible\" })\n })\n })\n\n await test.step(\"Enter in the giftcard and assert value works\", async () => {\n await checkoutPage.discountButton.click()\n await expect(checkoutPage.discountInput).toBeVisible()\n await checkoutPage.discountInput.fill(giftcard.code)\n await checkoutPage.discountApplyButton.click()\n const paymentGiftcard = await checkoutPage.getGiftCard(giftcard.code)\n await expect(paymentGiftcard.locator).toBeVisible()\n await expect(paymentGiftcard.code).toHaveText(giftcard.code)\n expect(paymentGiftcard.amountValue).toBe(\n (giftcard.value - firstTransactionTotal).toString()\n )\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n \"0\"\n )\n })\n\n let shippingTotal = \"\"\n await test.step(\"Go through checkout process\", async () => {\n await test.step(\"Enter in the first step of the checkout process\", async () => {\n await test.step(\"Enter in the shipping address info\", async () => {\n await checkoutPage.shippingFirstNameInput.fill(\"First\")\n await checkoutPage.shippingLastNameInput.fill(\"Last\")\n await checkoutPage.shippingCompanyInput.fill(\"MyCorp\")\n await checkoutPage.shippingAddressInput.fill(\"123 Fake street\")\n await checkoutPage.shippingPostalCodeInput.fill(\"80010\")\n await checkoutPage.shippingCityInput.fill(\"Denver\")\n await checkoutPage.shippingProvinceInput.fill(\"Colorado\")\n await checkoutPage.shippingCountrySelect.selectOption(\n \"United States\"\n )\n })\n\n await test.step(\"Enter in the contact info and open the billing info form\", async () => {\n await checkoutPage.shippingEmailInput.fill(\"test@example.com\")\n await checkoutPage.shippingPhoneInput.fill(\"3031112222\")\n await checkoutPage.submitAddressButton.click()\n })\n })\n\n await test.step(\"Complete the rest of the payment process\", async () => {\n await checkoutPage.selectDeliveryOption(\"FakeEx Standard\")\n await checkoutPage.submitDeliveryOptionButton.click()\n shippingTotal =\n (await checkoutPage.cartShipping.getAttribute(\"data-value\")) || \"\"\n await checkoutPage.submitPaymentButton.click()\n })\n\n await test.step(\"Make sure the giftcard still has the total as zero after selecting shipping\", async () => {\n expect(await checkoutPage.cartTotal.getAttribute(\"data-value\")).toBe(\n \"0\"\n )\n })\n\n await test.step(\"Finish completing the order\", async () => {\n await checkoutPage.submitOrderButton.click()\n await orderPage.container.waitFor({ state: \"visible\" })\n })\n })\n const cartTotal = (\n Number(cartSubtotal) + Number(shippingTotal)\n ).toString()\n\n await test.step(\"Assert the order page shows the total was 0\", async () => {\n expect(await orderPage.cartTotal.getAttribute(\"data-value\")).toBe(\"0\")\n expect(await orderPage.cartSubtotal.getAttribute(\"data-value\")).toBe(\n cartSubtotal\n )\n expect(\n await orderPage.cartGiftCardAmount.getAttribute(\"data-value\")\n ).toBe(cartTotal)\n })\n })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/public/login.spec.ts",
"content": "import { test, expect } from \"../../index\"\n\ntest.describe(\"Login Page functionality\", async () => {\n test(\"access login page from nav menu and submit (partially) empty form\", async ({\n loginPage,\n }) => {\n await loginPage.accountLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.signInButton.click()\n await expect(loginPage.emailInput).toBeFocused()\n\n await loginPage.emailInput.fill(\"test-dne@example.com\")\n await loginPage.signInButton.click()\n await expect(loginPage.passwordInput).toBeFocused()\n })\n\n test(\"enter incorrect creds and verify error message\", async ({\n loginPage,\n }) => {\n await loginPage.accountLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.emailInput.fill(\"test-dne@example.com\")\n await loginPage.passwordInput.fill(\"password\")\n await loginPage.signInButton.click()\n await expect(loginPage.errorMessage).toBeVisible()\n })\n\n test(\"enter different incorrect creds and verify error message\", async ({\n loginPage,\n }) => {\n await loginPage.accountLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"passwrong\")\n await loginPage.signInButton.click()\n await expect(loginPage.errorMessage).toBeVisible()\n })\n\n test(\"successful login redirects to account page\", async ({\n accountOverviewPage,\n loginPage,\n }) => {\n await loginPage.accountLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"password\")\n await loginPage.signInButton.click()\n await expect(accountOverviewPage.welcomeMessage).toBeVisible()\n })\n\n test(\"logging out works correctly\", async ({\n page,\n accountOverviewPage,\n loginPage,\n }) => {\n await loginPage.accountLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n await loginPage.emailInput.fill(\"test@example.com\")\n await loginPage.passwordInput.fill(\"password\")\n await loginPage.signInButton.click()\n await expect(accountOverviewPage.welcomeMessage).toBeVisible()\n\n await accountOverviewPage.logoutLink.highlight()\n await accountOverviewPage.logoutLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n\n await loginPage.accountLink.click()\n await loginPage.container.waitFor({ state: \"visible\" })\n })\n})\n"
},
{
"path": "storefront/e2e/tests/public/register.spec.ts",
"content": "import { test, expect } from \"../../index\"\n\ntest.describe(\"User registration functionality\", async () => {\n test(\"registration with existing user shows error message\", async ({\n loginPage,\n registerPage,\n }) => {\n await loginPage.accountLink.click()\n await registerPage.container.isVisible()\n await loginPage.registerButton.click()\n\n await registerPage.firstNameInput.fill(\"first\")\n await registerPage.lastNameInput.fill(\"last\")\n await registerPage.emailInput.fill(\"test@example.com\")\n await registerPage.passwordInput.fill(\"password\")\n await registerPage.registerButton.click()\n\n await expect(registerPage.registerError).toBeVisible()\n })\n\n test(\"registration with empty form data highlights corresponding input\", async ({\n accountOverviewPage,\n loginPage,\n registerPage,\n }) => {\n await loginPage.accountLink.click()\n await registerPage.container.isVisible()\n await loginPage.registerButton.click()\n\n await registerPage.registerButton.click()\n await expect(registerPage.firstNameInput).toBeFocused()\n await registerPage.firstNameInput.fill(\"first\")\n\n await registerPage.registerButton.click()\n await expect(registerPage.lastNameInput).toBeFocused()\n await registerPage.lastNameInput.fill(\"last\")\n\n await registerPage.registerButton.click()\n await expect(registerPage.emailInput).toBeFocused()\n await registerPage.emailInput.fill(\"test-reg-new@example.com\")\n\n await registerPage.registerButton.click()\n await expect(registerPage.passwordInput).toBeFocused()\n await registerPage.passwordInput.fill(\"password\")\n\n await registerPage.registerButton.click()\n await expect(accountOverviewPage.welcomeMessage).toBeVisible()\n })\n\n test(\"successful registration and navigation to account overview\", async ({\n loginPage,\n registerPage,\n accountOverviewPage,\n }) => {\n await loginPage.accountLink.click()\n await registerPage.container.isVisible()\n await loginPage.registerButton.click()\n\n await registerPage.firstNameInput.fill(\"first\")\n await registerPage.lastNameInput.fill(\"last\")\n await registerPage.emailInput.fill(\"test-reg@example.com\")\n await registerPage.passwordInput.fill(\"password\")\n await registerPage.registerButton.click()\n\n await expect(accountOverviewPage.welcomeMessage).toBeVisible()\n })\n})\n"
},
{
"path": "storefront/e2e/tests/public/search.spec.ts",
"content": "import { test, expect } from \"../../index\"\n\ntest.describe(\"Search tests\", async () => {\n test(\"Searching for a specific product returns the correct product page\", async ({\n productPage,\n }) => {\n const searchModal = productPage.searchModal\n await searchModal.open()\n await searchModal.searchInput.fill(\"Sweatshirt\")\n await searchModal.searchResult\n .filter({ hasText: \"Sweatshirt\" })\n .first()\n .click()\n await productPage.container.waitFor({ state: \"visible\" })\n await expect(productPage.productTitle).toContainText(\"Sweatshirt\")\n })\n\n test(\"An erroneous search returns an empty result\", async ({\n productPage,\n }) => {\n const searchModal = productPage.searchModal\n await searchModal.open()\n await searchModal.searchInput.fill(\"Does Not Sweatshirt\")\n await expect(searchModal.noSearchResultsContainer).toBeVisible()\n })\n\n test(\"User can search after an empty search result\", async ({\n productPage,\n }) => {\n const searchModal = productPage.searchModal\n\n await searchModal.open()\n await searchModal.searchInput.fill(\"Does Not Sweatshirt\")\n await expect(searchModal.noSearchResultsContainer).toBeVisible()\n\n await searchModal.searchInput.fill(\"Sweat\")\n await expect(searchModal.searchResults).toBeVisible()\n await expect(searchModal.searchResult.first()).toBeVisible()\n })\n\n test(\"Closing the search page returns user back to their current page\", async ({\n storePage,\n productPage,\n loginPage,\n }) => {\n const searchModal = storePage.searchModal\n await test.step(\"Navigate to the store page and open and close search modal\", async () => {\n await storePage.goto()\n await searchModal.open()\n await searchModal.close()\n await expect(storePage.container).toBeVisible()\n })\n\n await test.step(\"Navigate to the product page and open and close search modal\", async () => {\n await storePage.goto()\n const product = await storePage.getProduct(\"Sweatshirt\")\n await product.locator.click()\n await productPage.container.waitFor({ state: \"visible\" })\n await searchModal.open()\n await searchModal.close()\n await expect(productPage.container).toBeVisible()\n })\n\n await test.step(\"Navigate to the login page and open and close search modal\", async () => {\n await loginPage.goto()\n await searchModal.open()\n await searchModal.close()\n await expect(loginPage.container).toBeVisible()\n })\n })\n})\n"
},
{
"path": "storefront/e2e/utils/index.ts",
"content": "export function getFloatValue(s: string) {\n return parseFloat(parseFloat(s).toFixed(2))\n}\n\nexport function compareFloats(f1: number, f2: number) {\n const diff = f1 - f2\n if (Math.abs(diff) < 0.01) {\n return 0\n } else if (diff < 0) {\n return -1\n } else {\n return 1\n }\n}\n"
},
{
"path": "storefront/e2e/utils/locators.ts",
"content": "import { Page, Locator} from '@playwright/test'\n\nexport async function getSelectedOptionText(page: Page, select: Locator) {\n const handle = await select.elementHandle()\n return await page.evaluate(\n (opts) => {\n if (!opts || !opts[0]) { return \"\" }\n const select = opts[0] as HTMLSelectElement\n return select.options[select.selectedIndex].textContent\n },\n [handle]\n )\n}\n"
},
{
"path": "storefront/eslint.config.cjs",
"content": "const { FlatCompat } = require(\"@eslint/eslintrc\")\n\nconst compat = new FlatCompat({\n baseDirectory: __dirname,\n})\n\nmodule.exports = [\n ...compat.config({\n extends: [\"next/core-web-vitals\", \"next/typescript\", \"prettier\"],\n ignorePatterns: [\n // Dependencies\n \"node_modules/\",\n\n // Build and output directories\n \".next/\",\n \"out/\",\n\n // Coverage\n \"coverage/\",\n\n // Static and public assets\n \"public/\",\n\n // Test directories\n \"e2e/\",\n \"integration-tests/\",\n\n // Type definitions\n \"**/*.d.ts\",\n\n // Environment and config files\n \".env\",\n \".env.local\",\n \".env.*.local\",\n\n // Linting cache\n \".eslintcache\",\n\n // Package lock files (yarn only)\n \"yarn.lock\",\n ],\n rules: {\n // General best practices\n \"no-console\": [\n \"warn\",\n {\n allow: [\"warn\", \"error\", \"info\"],\n },\n ],\n \"no-debugger\": \"error\",\n \"no-duplicate-imports\": \"error\",\n \"no-var\": \"error\",\n \"prefer-const\": \"error\",\n \"prefer-arrow-callback\": \"warn\",\n \"object-shorthand\": \"warn\",\n eqeqeq: [\"error\", \"always\"],\n\n // React best practices\n \"react/no-unescaped-entities\": \"warn\",\n \"react/self-closing-comp\": \"error\",\n \"react/prefer-es6-class\": \"error\",\n \"react/no-array-index-key\": \"warn\",\n \"react/no-danger\": \"warn\",\n\n // React hooks\n \"react-hooks/rules-of-hooks\": \"error\",\n \"react-hooks/exhaustive-deps\": \"warn\",\n\n // Next.js\n \"@next/next/no-img-element\": \"warn\",\n \"@next/next/no-html-link-for-pages\": \"error\",\n },\n }),\n // Override for config files that legitimately use require()\n {\n files: [\"**/*.config.js\", \"**/*.config.cjs\", \"check-env-variables.js\"],\n rules: {\n \"@typescript-eslint/no-require-imports\": \"off\",\n },\n },\n]\n"
},
{
"path": "storefront/next-env.d.ts",
"content": "/// \",\n \"description\": \"Next.js Fashion E-Commerce Starter to be used with Medusa 2.0\",\n \"keywords\": [\n \"medusa-storefront\"\n ],\n \"scripts\": {\n \"dev\": \"next dev -p 8000 --turbo\",\n \"build\": \"next build\",\n \"start\": \"next start -p 8000\",\n \"lint\": \"eslint . --ext .js,.jsx,.ts,.tsx\",\n \"lint:fix\": \"eslint . --ext .js,.jsx,.ts,.tsx --fix\",\n \"analyze\": \"ANALYZE=true next build\",\n \"test-e2e\": \"playwright test e2e\"\n },\n \"resolutions\": {\n \"webpack\": \"^5\"\n },\n \"dependencies\": {\n \"@hookform/resolvers\": \"^5.2.2\",\n \"@medusajs/icons\": \"^2.13.1\",\n \"@medusajs/js-sdk\": \"2.13.1\",\n \"@medusajs/types\": \"2.13.1\",\n \"@paypal/paypal-js\": \"^8.4.2\",\n \"@paypal/react-paypal-js\": \"^8.9.2\",\n \"@stripe/react-stripe-js\": \"^5.6.0\",\n \"@stripe/stripe-js\": \"^8.7.0\",\n \"@tanstack/react-query\": \"^5.70.2\",\n \"@vercel/speed-insights\": \"^1.2.0\",\n \"axios\": \"^1.13.5\",\n \"embla-carousel-react\": \"^8.6.0\",\n \"lodash\": \"^4.17.23\",\n \"meilisearch\": \"^0.55.0\",\n \"next\": \"15.5.10\",\n \"pg\": \"^8.13.3\",\n \"qs\": \"^6.14.2\",\n \"react\": \"^19.0.0\",\n \"react-aria-components\": \"^1.15.1\",\n \"react-dom\": \"^19.0.0\",\n \"react-hook-form\": \"^7.71.1\",\n \"react-stately\": \"^3.44.0\",\n \"server-only\": \"^0.0.1\",\n \"tailwind-merge\": \"^3.4.0\",\n \"tailwindcss-animate\": \"^1.0.7\",\n \"tailwindcss-radix\": \"^4.0.2\",\n \"zod\": \"^4.3.6\"\n },\n \"devDependencies\": {\n \"@playwright/test\": \"^1.58.2\",\n \"@tailwindcss/postcss\": \"^4\",\n \"@types/lodash\": \"^4.17.16\",\n \"@types/node\": \"^20\",\n \"@types/pg\": \"^8.11.11\",\n \"@types/react\": \"^19\",\n \"@types/react-dom\": \"^19\",\n \"ansi-colors\": \"^4.1.3\",\n \"autoprefixer\": \"^10.4.21\",\n \"eslint\": \"^9\",\n \"eslint-config-next\": \"15.2.1\",\n \"eslint-config-prettier\": \"^10.1.8\",\n \"postcss\": \"^8.5.3\",\n \"prettier\": \"^3.8.1\",\n \"tailwindcss\": \"^3.4.17\",\n \"typescript\": \"^5\",\n \"webpack\": \"^5\"\n },\n \"packageManager\": \"yarn@1.22.19\"\n}\n"
},
{
"path": "storefront/playwright.config.ts",
"content": "import { defineConfig, devices } from \"@playwright/test\"\nimport path from \"path\"\nimport \"dotenv/config.js\"\n\nexport const STORAGE_STATE = path.join(__dirname, \"playwright/.auth/user.json\")\n\nexport default defineConfig({\n testDir: \"./e2e\",\n /* Run tests in files in parallel */\n fullyParallel: false,\n /* Fail the build on CI if you accidentally left test.only in the source code. */\n forbidOnly: !!process.env.CI,\n /* Retry on CI only */\n retries: process.env.CI ? 2 : 0,\n /* Opt out of parallel tests on CI. */\n workers: 1,\n /* Reporter to use. See https://playwright.dev/docs/test-reporters */\n reporter: \"html\",\n /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */\n use: {\n /* Base URL to use in actions like `await page.goto('/')`. */\n baseURL: process.env.NEXT_PUBLIC_BASE_URL,\n\n /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */\n trace: \"retain-on-failure\",\n },\n\n /* Configure projects for major browsers */\n projects: [\n {\n name: \"setup\",\n testMatch: /global\\/setup\\.ts/,\n teardown: \"cleanup test database\",\n },\n {\n name: \"public setup\",\n testMatch: /global\\/public-setup\\.ts/,\n teardown: \"cleanup test database\",\n },\n {\n name: \"cleanup test database\",\n testMatch: /global\\/teardown\\.ts/,\n },\n {\n name: \"chromium auth\",\n dependencies: [\"setup\"],\n testIgnore: \"public/*.spec.ts\",\n use: { ...devices[\"Desktop Chrome\"], storageState: STORAGE_STATE },\n },\n\n {\n name: \"chromium public\",\n dependencies: [\"public setup\"],\n testMatch: \"public/*.spec.ts\",\n use: { ...devices[\"Desktop Chrome\"] },\n },\n\n /*\n {\n name: \"firefox\",\n use: { ...devices[\"Desktop Firefox\"] },\n },\n\n {\n name: \"webkit\",\n use: { ...devices[\"Desktop Safari\"] },\n },\n */\n ],\n\n /* Run your local dev server before starting the tests */\n webServer: {\n command: 'yarn start',\n url: process.env.NEXT_PUBLIC_BASE_URL,\n // reuseExistingServer: !process.env.CI,\n },\n})\n"
},
{
"path": "storefront/postcss.config.js",
"content": "module.exports = {\n plugins: {\n tailwindcss: {},\n autoprefixer: {},\n },\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(checkout)/checkout/loading.tsx",
"content": "import { Icon } from \"@/components/Icon\"\n\nexport default function Loading() {\n return (\n \n
\n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(checkout)/checkout/page.tsx",
"content": "import React from \"react\"\nimport { Metadata } from \"next\"\nimport { notFound } from \"next/navigation\"\nimport { getCartId } from \"@lib/data/cookies\"\nimport { CheckoutForm } from \"@modules/checkout/components/checkout-form\"\n\nexport const metadata: Metadata = {\n title: \"Checkout\",\n}\n\nexport default async function Checkout({\n params,\n searchParams,\n}: {\n params: Promise<{ countryCode: string }>\n searchParams: Promise<{ step?: string }>\n}) {\n const cart = await getCartId()\n if (!cart) {\n return notFound()\n }\n\n const { countryCode } = await params\n const { step } = await searchParams\n\n return \n \n \n
\n SofaSocietyCo.\n \n
\n
\n \n \n \n \n \n \n
\n \n \n \n \n SofaSocietyCo.\n \n {children}\n
\n \n
\n
\n \n \n \n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(checkout)/not-found.tsx",
"content": "import { Metadata } from \"next\"\n\nimport NotFoundPage from \"app/not-found\"\n\nexport const metadata: Metadata = {\n title: \"404\",\n description: \"Something went wrong\",\n}\n\nexport default async function NotFound() {\n return \n
\n \n
\n \n \n At Sofa Society, we believe that a sofa is the heart of every\n home.\n \n \n \n \n
\n Welcome to Sofa Society, where we believe that comfort and style\n should be effortlessly intertwined. Our mission is to help you\n create beautiful, functional spaces that bring warmth and\n relaxation into your home.\n
\n
\n Every piece in our collection is designed with care, blending\n timeless craftsmanship with modern aesthetics to offer you the\n perfect balance between form and function.\n
\n
\n \n \n \n \n We are here to make your living space a true reflection of your\n personal style.\n \n \n \n \n
\n At the heart of our brand is a deep commitment to quality. We\n understand that a sofa isn't just another piece of\n furniture; it's where you unwind, gather with loved ones,\n and make memories. That's why we source only the finest\n materials and fabrics, ensuring that every sofa we offer is\n built to last.\n
\n
\n From luxurious leathers and soft linens to high-performance\n textiles, each fabric is carefully selected for its durability\n and beauty. Our attention to detail extends to every stitch and\n seam, guaranteeing that your sofa will not only look stunning\n but will also withstand the test of time.\n
\n
\n \n \n \n \n
\n Our design philosophy revolves around creating pieces that are\n both beautiful and practical. Inspired by Scandinavian\n simplicity, modern luxury, and timeless classics, our\n collections are curated to suit a wide variety of tastes and\n lifestyles. We understand that every home is different, so we\n offer a diverse range of styles, colors, and textures to help\n you find the perfect fit. Whether you prefer sleek modern lines\n or soft, inviting silhouettes, we have something to suit every\n space and personality.\n
\n
\n
\n We believe that great design should be environmentally\n conscious, which is why we strive to minimise our environmental\n footprint through responsible sourcing and production practices.\n Our commitment to sustainability ensures that our products are\n not only beautiful but also kind to the planet.\n
\n
\n \n
\n
\n \n \n Our customers are at the center of everything we do!\n \n \n \n \n
\n Our team is here to help guide you through the process, offering\n personalised support to ensure that you find exactly what\n you're looking for.\n
\n
\n We're not just selling sofas - we're helping you\n create spaces where you can relax, recharge, and make lasting\n memories. Thank you for choosing Sofa Society to be a part of\n your home!\n
\n
\n \n
\n
\n
\n
\n
My account \n \n
\n Log out\n \n \n
\n
\n {props.children}\n
\n
\n \n Canceled\n \n \n )\n }\n\n if (order.fulfillment_status === \"delivered\") {\n return (\n \n \n Packing\n \n \n Delivering\n \n \n Delivered\n \n \n )\n }\n\n if (\n order.fulfillment_status === \"shipped\" ||\n order.fulfillment_status === \"partially_delivered\"\n ) {\n return (\n \n \n Packing\n \n \n Delivering\n \n \n Delivered\n \n \n )\n }\n\n return (\n \n \n Packing\n \n \n Delivering\n \n \n Delivered\n \n \n )\n}\n\nexport default async function AccountOrderPage({\n params,\n}: {\n params: Promise<{ orderId: string }>\n}) {\n const customer = await getCustomer().catch(() => null)\n\n if (!customer) {\n redirect(`/`)\n }\n\n const { orderId } = await params\n const order = await retrieveOrder(orderId)\n\n return (\n <>\n \n Order: {order.display_id}\n \n \n
\n
\n
\n
{new Date(order.created_at).toLocaleDateString()}
\n
\n
\n
\n
\n
\n
\n
\n
\n {[\n order.shipping_address?.first_name,\n order.shipping_address?.last_name,\n ]\n .filter(Boolean)\n .join(\" \")}\n
\n {Boolean(order.shipping_address?.company) && (\n
{order.shipping_address?.company}
\n )}\n
\n {[\n order.shipping_address?.address_1,\n order.shipping_address?.address_2,\n [\n order.shipping_address?.postal_code,\n order.shipping_address?.city,\n ]\n .filter(Boolean)\n .join(\" \"),\n order.shipping_address?.country?.display_name,\n ]\n .filter(Boolean)\n .join(\", \")}\n
\n {Boolean(order.shipping_address?.phone) && (\n
{order.shipping_address?.phone}
\n )}\n
\n
\n
\n
\n
\n
\n {[\n order.billing_address?.first_name,\n order.billing_address?.last_name,\n ]\n .filter(Boolean)\n .join(\" \")}\n
\n {Boolean(order.billing_address?.company) && (\n
{order.billing_address?.company}
\n )}\n
\n {[\n order.billing_address?.address_1,\n order.billing_address?.address_2,\n [\n order.billing_address?.postal_code,\n order.billing_address?.city,\n ]\n .filter(Boolean)\n .join(\" \"),\n order.billing_address?.country?.display_name,\n ]\n .filter(Boolean)\n .join(\", \")}\n
\n {Boolean(order.billing_address?.phone) && (\n
{order.billing_address?.phone}
\n )}\n
\n
\n
\n
\n {order.items?.map((item) => (\n
\n {item.thumbnail && (\n \n \n
\n \n {item.product_title}\n \n
\n
\n
\n {item.variant?.options?.map((option) => (\n
\n \n {option.option?.title}:\n \n {option.value}\n
\n ))}\n
\n
\n
\n
\n \n Quantity:\n \n {item.quantity}\n
\n
\n
\n
\n {convertToLocale({\n currency_code: order.currency_code,\n amount: item.total,\n })}\n
\n
\n
\n
\n
\n ))}\n
\n Canceled\n \n )\n }\n\n if (order.fulfillment_status === \"delivered\") {\n return (\n \n Delivered\n \n )\n }\n\n if (\n order.fulfillment_status === \"shipped\" ||\n order.fulfillment_status === \"partially_delivered\"\n ) {\n return (\n \n Delivering\n \n )\n }\n\n return (\n \n Packing\n \n )\n}\n\ntype PageProps = {\n searchParams: Promise<{\n page?: string\n }>\n}\n\nconst ORDERS_PER_PAGE = 6\n\nexport default async function AccountMyOrdersPage({ searchParams }: PageProps) {\n const { page } = await searchParams\n\n const customer = await getCustomer().catch(() => null)\n\n if (!customer) {\n redirect(`/`)\n }\n\n const pageNumber = page ? parseInt(page, 10) : 1\n const { orders, count } = await listOrders(\n ORDERS_PER_PAGE,\n (pageNumber - 1) * ORDERS_PER_PAGE\n )\n const totalPages = Math.ceil(count / ORDERS_PER_PAGE)\n\n return (\n <>\n My orders \n {orders.length > 0 ? (\n \n
\n {orders.map((order) => (\n
\n \n
\n
\n
\n \n Order: {\" \"}\n {order.display_id}\n \n
\n
\n Order date:{\" \"}\n {new Date(order.created_at).toLocaleDateString()}\n
\n
\n
\n {order.items\n ?.filter((item) => item.thumbnail)\n .map((item) => (\n \n
\n
\n \n Check details\n \n \n Check details\n \n
\n \n ))}\n
You haven't ordered anything yet
\n )}\n \n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(main)/account/page.tsx",
"content": "import { Metadata } from \"next\"\nimport { redirect } from \"next/navigation\"\nimport { getCustomer } from \"@lib/data/customer\"\nimport { getRegion, listRegions } from \"@lib/data/regions\"\nimport { UpsertAddressForm } from \"@modules/account/components/UpsertAddressForm\"\nimport { PersonalInfoForm } from \"@modules/account/components/PersonalInfoForm\"\nimport { SignOutButton } from \"@modules/account/components/SignOutButton\"\nimport { Icon } from \"@/components/Icon\"\nimport { Button } from \"@/components/Button\"\nimport { UiModal, UiModalOverlay } from \"@/components/ui/Modal\"\nimport { UiDialog, UiDialogTrigger } from \"@/components/Dialog\"\nimport { RequestPasswordResetButton } from \"@modules/account/components/RequestPasswordResetButton\"\nimport { AddressSingle } from \"@modules/account/components/AddressSingle\"\nimport { AddressMultiple } from \"@modules/account/components/AddressMultiple\"\nimport { DefaultShippingAddressSelect } from \"@modules/account/components/DefaultShippingAddressSelect\"\nimport { DefaultBillingAddressSelect } from \"@modules/account/components/DefaultBillingAddressSelect\"\nimport { UiRadioGroup } from \"@/components/ui/Radio\"\n\nexport const metadata: Metadata = {\n title: \"Account - Personal & security\",\n description: \"Manage your personal information and security settings\",\n}\n\nexport default async function AccountPersonalAndSecurityPage({\n params,\n}: {\n params: Promise<{ countryCode: string }>\n}) {\n const { countryCode } = await params\n const customer = await getCustomer().catch(() => null)\n\n if (!customer) {\n redirect(`/${countryCode}/auth/login`)\n }\n\n const [region, regions] = await Promise.all([\n getRegion(countryCode),\n listRegions(),\n ])\n const countries = regions.flatMap((region) => region.countries ?? [])\n\n return (\n <>\n \n Personal & security\n \n Personal information \n \n
\n
\n
\n
\n
Name
\n
\n {[customer.first_name, customer.last_name]\n .filter(Boolean)\n .join(\" \")}\n
\n
\n
\n
Number
\n
{customer.phone || \"-\"}
\n
\n
\n
\n
\n Change \n \n \n \n \n \n \n \n
Contact \n \n
\n
\n
Email
\n
{customer.email}
\n
\n
\n If you want to change your email please contact us via customer support.\n
\n \n {customer.addresses.length > 1 ? \"Addresses\" : \"Address\"}\n \n {customer.addresses.length === 0 && (\n \n You don't have any addresses saved yet.\n
\n )}\n {customer.addresses.length === 1 &&\n customer.addresses.map((address) => (\n \n {customer.addresses\n .sort(\n (a, b) =>\n new Date(b.created_at).getTime() -\n new Date(a.created_at).getTime()\n )\n .map((address) => (\n \n {customer.addresses.length > 0 ? (\n Add another address \n ) : (\n Add address \n )}\n \n \n \n \n \n \n \n Change password \n \n To change your password, we'll send you an email. Just click on the\n reset button below.\n
\n \n \n \n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(main)/auth/login/loading.tsx",
"content": "import Image from \"next/image\"\n\nimport { LocalizedLink } from \"@/components/LocalizedLink\"\nimport { Button } from \"@/components/Button\"\nimport { Input } from \"@/components/Forms\"\n\nexport default async function LoginLoadingPage() {\n return (\n \n
\n
\n
\n Welcome back to Sofa Society!\n \n
\n
\n Don't have an account yet? You can{\" \"}\n \n register here\n \n .\n
\n
\n
\n
\n
\n
\n Welcome back to Sofa Society!\n \n
\n
\n Don't have an account yet? You can{\" \"}\n \n register here\n \n .\n
\n
\n
\n
\n
\n
\n Hey, welcome to Sofa Society!\n \n
\n
\n Already have an account? No worries, just{\" \"}\n \n log in\n \n .\n
\n
\n
\n
\n
\n
\n Hey, welcome to Sofa Society!\n \n
\n
\n Already have an account? No worries, just{\" \"}\n \n log in\n \n .\n
\n
\n
\n \n \n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(main)/cart/loading.tsx",
"content": "import SkeletonCartPage from \"@modules/skeletons/templates/skeleton-cart-page\"\n\nexport default function Loading() {\n return {\n const { handle } = await params\n\n const collection = await getCollectionByHandle(handle, [\n \"id\",\n \"title\",\n \"metadata\",\n ])\n\n if (!collection) {\n notFound()\n }\n\n const collectionDetails = collectionMetadataCustomFieldsSchema.safeParse(\n collection.metadata ?? {}\n )\n\n const metadata = {\n title: `${collection.title} | Medusa Store`,\n description:\n collectionDetails.success && collectionDetails.data.description\n ? collectionDetails.data.description\n : `${collection.title} collection`,\n } as Metadata\n\n return metadata\n}\n\nexport default async function CollectionPage({ params, searchParams }: Props) {\n const { handle, countryCode } = await params\n const { sortBy, page, category, type } = await searchParams\n\n const collection = await getCollectionByHandle(handle, [\n \"id\",\n \"title\",\n \"metadata\",\n ])\n\n if (!collection) {\n notFound()\n }\n\n return (\n \n \n \n Cookie Policy for Sofa Society\n \n \n \n \n This Cookie Policy explains how Sofa Society uses cookies and similar\n technologies on our website. By using our website, you consent to the\n use of cookies as described in this policy.\n
\n 1. What Are Cookies: \n \n Cookies are small text files that are placed on your computer or\n device when you visit a website. They are widely used to make websites\n work more efficiently and provide a better browsing experience.\n Cookies also enable website owners to collect certain information\n about visitors.\n
\n 2. Types of Cookies We Use: \n We use the following types of cookies on our website:
\n \n \n Essential Cookies: These cookies are necessary for the operation of\n our website and enable you to navigate and use its features. They\n are typically set in response to your actions, such as setting your\n privacy preferences, logging in, or filling out forms.\n \n \n Analytics and Performance Cookies: These cookies help us understand\n how visitors interact with our website by collecting information\n such as the number of visitors, pages visited, and sources of\n traffic. This data helps us improve our website's performance\n and usability.\n \n \n Functionality Cookies: These cookies allow our website to remember\n choices you make (such as language preferences) and provide enhanced\n features. They may also be used to provide personalized content\n based on your browsing history.\n \n \n Advertising and Targeting Cookies: These cookies are used to deliver\n advertisements that are relevant to your interests. They may also be\n used to limit the number of times you see an advertisement and\n measure the effectiveness of advertising campaigns.\n \n \n 3. Third-Party Cookies: \n \n We may allow third-party service providers, such as analytics and\n advertising companies, to place cookies on our website. These third\n parties may collect information about your online activities over time\n and across different websites.\n
\n 4. Cookie Management: \n \n You can manage and control cookies through your browser settings. Most\n web browsers allow you to block or delete cookies. However, please\n note that blocking or deleting certain cookies may impact the\n functionality and user experience of our website.\n
\n \n For more information on how to manage cookies, you can visit the help\n or settings section of your browser.\n
\n 5. Updates to the Cookie Policy: \n \n We may update this Cookie Policy from time to time to reflect changes\n in our use of cookies or for other operational, legal, or regulatory\n reasons. We will notify you of any material changes by posting a\n prominent notice on our website.\n
\n 6. Contact Us: \n \n If you have any questions, concerns, or requests regarding this\n Privacy Policy or how we handle your personal information, please\n contact us at:\n
\n \n Email: privacy@sofasociety.com\n
\n \n \n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(main)/inspiration/page.tsx",
"content": "import { Metadata } from \"next\"\nimport Image from \"next/image\"\nimport { StoreRegion } from \"@medusajs/types\"\nimport { listRegions } from \"@lib/data/regions\"\nimport { Layout, LayoutColumn } from \"@/components/Layout\"\nimport { LocalizedLink } from \"@/components/LocalizedLink\"\nimport { CollectionsSection } from \"@/components/CollectionsSection\"\n\nexport const metadata: Metadata = {\n title: \"Inspiration\",\n description: \"Get inspired by our latest collections\",\n}\n\nexport async function generateStaticParams() {\n const countryCodes = await listRegions().then((regions: StoreRegion[]) =>\n regions.flatMap((r) =>\n r.countries\n ? r.countries\n .map((c) => c.iso_2)\n .filter(\n (value): value is string =>\n typeof value === \"string\" && Boolean(value)\n )\n : []\n )\n )\n\n const staticParams = countryCodes.map((countryCode) => ({\n countryCode,\n }))\n\n return staticParams\n}\n\nexport default function InspirationPage() {\n return (\n <>\n \n
\n \n
\n \n \n The Astrid Curve sofa is a masterpiece of minimalism and luxury.\n \n \n
\n Our design philosophy revolves around creating pieces that are\n both beautiful and practical. Inspired by Scandinavian\n simplicity, modern luxury, and timeless classics.\n
\n
\n \n \n \n
\n
Astrid Curve
\n
\n Scandinavian Simplicity\n
\n
\n
\n
\n \n \n \n \n \n Haven Sofas have minimalistic designs, neutral colors, and\n high-quality textures.\n \n \n
\n Perfect for those who seek comfort with a clean and understated\n aesthetic. This collection brings the essence of Scandinavian\n elegance to your living room.\n
\n
\n \n \n \n
\n
Nordic Haven
\n
\n Scandinavian Simplicity\n
\n
\n
\n
\n \n
\n
Nordic Breeze
\n
\n Scandinavian Simplicity\n
\n
\n
\n
\n \n \n
\n
\n \n \n Oslo Drift is infused with playful textures and vibrant patterns\n with eclectic vibes.\n \n \n
\n Whether you're looking for bold statement pieces or subtle\n elegance, this collection elevates your home with a touch of\n glamour, sophistication, and unmatched coziness.\n
\n
\n \n \n \n
\n
Oslo Drift
\n
\n Scandinavian Simplicity\n
\n
\n
\n
\n \n \n
\n
\n \n Our products \n \n {productTypes.productTypes.map((productType, index) => (\n \n \n {typeof productType.metadata?.image === \"object\" &&\n productType.metadata.image &&\n \"url\" in productType.metadata.image &&\n typeof productType.metadata.image.url === \"string\" && (\n {productType.value}
\n \n \n ))}\n \n )\n}\n\nexport default async function Home({\n params,\n}: {\n params: Promise<{ countryCode: string }>\n}) {\n const { countryCode } = await params\n const region = await getRegion(countryCode)\n\n if (!region) {\n return null\n }\n\n return (\n <>\n \n
\n \n
\n \n \n Elevate Your Living Space with Unmatched Comfort & Style\n \n \n \n \n
\n
Discover Your Perfect Sofa Today
\n
\n Explore Now\n \n
\n
\n \n
\n
\n
\n \n \n About Sofa Society\n \n \n \n \n At Sofa Society, we believe that a sofa is the heart of every\n home.\n \n \n \n \n
\n We are dedicated to delivering high-quality, thoughtfully\n designed sofas that merge comfort and style effortlessly.\n
\n
\n Our mission is to transform your living space into a sanctuary\n of relaxation and beauty, with products built to last.\n
\n
\n Read more about Sofa Society\n \n
\n
\n \n \n Privacy Policy for Sofa Society\n \n \n \n \n At Sofa Society, we value your privacy and are committed to protecting\n your personal information. This Privacy Policy outlines how we\n collect, use, disclose, and safeguard your data when you interact with\n our website, services, and products. By using our platform, you\n consent to the practices described in this policy.\n
\n 1. Information We Collect: \n \n We may collect personal information you provide directly to us, such\n as:\n
\n \n \n Name, email address, and contact details when you sign up for an\n account.\n \n Billing and shipping addresses when you make a purchase. \n \n Payment information (credit/debit card details) for completing\n transactions securely.\n \n Personal preferences and fashion interests you share with us. \n \n \n Additionally, we may automatically collect certain information when\n you access or use our website, including:\n
\n \n \n IP address, browser type, operating system, and device information.\n \n \n Usage data, such as pages visited, time spent on our platform, and\n referring website.\n \n \n 2. How We Use Your Information: \n \n We may use your personal information for various purposes, including\n but not limited to:\n
\n \n Providing and managing your account, purchases, and orders. \n \n Customizing your shopping experience and suggesting relevant\n products.\n \n \n Sending you updates, newsletters, and marketing communications (you\n can opt-out anytime).\n \n Analyzing user behavior to improve our website and services. \n \n Complying with legal obligations and enforcing our Terms of Service.\n \n \n 3. Cookies and Similar Technologies: \n \n We use cookies and similar technologies to collect information about\n your browsing activity on our website. These technologies help us\n analyze usage patterns and enhance user experience. You can manage\n your cookie preferences through your browser settings.\n
\n 4. Data Sharing and Disclosure: \n \n We may share your personal information with third parties under\n certain circumstances, including:\n
\n \n \n Service providers who assist us in operating our business and\n delivering services.\n \n Legal authorities or government agencies as required by law. \n \n \n We do not sell or rent your personal information to third parties for\n their marketing purposes.\n
\n 5. Data Security: \n \n We implement reasonable security measures to protect your personal\n information from unauthorized access, alteration, or disclosure.\n However, no method of transmission over the internet or electronic\n storage is completely secure.\n
\n 6. Your Choices: \n You have the right to:
\n \n \n Review and update your personal information in your account\n settings.\n \n Opt-out of receiving marketing communications. \n \n Delete your account (subject to applicable laws and regulations).\n \n \n 7. Children's Privacy: \n \n Our services are not intended for individuals under the age of 16. If\n we become aware that we have collected personal information from\n children without parental consent, we will take prompt action to\n delete such data.\n
\n 8. Changes to this Privacy Policy: \n \n We may update this Privacy Policy from time to time to reflect changes\n in our practices or for other operational, legal, or regulatory\n reasons. We will notify you of any material changes via email or by\n prominently posting a notice on our website.\n
\n 9. Contact Us: \n \n If you have any questions, concerns, or requests regarding this\n Privacy Policy or how we handle your personal information, please\n contact us at:\n
\n \n Email: privacy@sofasociety.com\n
\n \n \n )\n}\n"
},
{
"path": "storefront/src/app/[countryCode]/(main)/products/[handle]/page.tsx",
"content": "import { Metadata } from \"next\"\nimport { notFound } from \"next/navigation\"\n\nimport { sdk } from \"@lib/config\"\nimport { getRegion, listRegions } from \"@lib/data/regions\"\nimport {\n getProductByHandle,\n getProductFashionDataByHandle,\n} from \"@lib/data/products\"\nimport ProductTemplate from \"@modules/products/templates\"\n\ntype Props = {\n params: Promise<{ countryCode: string; handle: string }>\n}\n\nexport async function generateStaticParams() {\n try {\n const countryCodes = await listRegions().then(\n (regions) =>\n regions\n ?.map((r) => r.countries?.map((c) => c.iso_2))\n .flat()\n .filter(Boolean) as string[]\n )\n\n if (!countryCodes) {\n return []\n }\n\n const { products } = await sdk.store.product.list(\n { fields: \"handle\" },\n { next: { tags: [\"products\"] } }\n )\n\n const staticParams = countryCodes\n ?.map((countryCode) =>\n products.map((product) => ({\n countryCode,\n handle: product.handle,\n }))\n )\n .flat()\n .filter((product) => product.handle)\n\n return staticParams\n } catch (error) {\n console.error(\n `Failed to generate static paths for product pages: ${\n error instanceof Error ? error.message : \"Unknown error\"\n }.`\n )\n return []\n }\n}\n\nexport async function generateMetadata({ params }: Props): Promise {\n const { handle, countryCode } = await params\n const region = await getRegion(countryCode)\n\n if (!region) {\n notFound()\n }\n\n const product = await getProductByHandle(handle, region.id)\n\n if (!product) {\n notFound()\n }\n\n return {\n title: `${product.title} | Medusa Store`,\n description: `${product.title}`,\n openGraph: {\n title: `${product.title} | Medusa Store`,\n description: `${product.title}`,\n images: product.thumbnail ? [product.thumbnail] : [],\n },\n }\n}\n\nexport default async function ProductPage({ params }: Props) {\n const { handle, countryCode } = await params\n const region = await getRegion(countryCode)\n\n if (!region) {\n notFound()\n }\n\n const [pricedProduct, fashionData] = await Promise.all([\n getProductByHandle(handle, region.id),\n getProductFashionDataByHandle(handle),\n ])\n\n if (!pricedProduct) {\n notFound()\n }\n\n return (\n (query)\n const region = await getRegion(countryCode)\n\n return (\n \n
\n \n \n Search results for '{query}'\n \n \n \n
}>\n {region && (\n
h.id)}\n typeId={undefined}\n />\n )}\n \n \n \n \n Terms of Use for Sofa Society\n \n \n \n \n Welcome to Sofa Society. These Terms of Use govern your access to and\n use of our website, products, and services. By accessing or using our\n platform, you agree to be bound by these terms and conditions. If you\n do not agree with any part of these terms, please do not use our\n website.\n
\n 1. Terms of Use: \n \n All content and materials on our website, including text, graphics,\n logos, images, videos, and trademarks, are the property of Sofa\n Society or its licensors and are protected by intellectual property\n laws. You may not use, reproduce, modify, or distribute any of our\n content without our prior written permission.\n
\n 2. Use of the Website: \n \n \n Eligibility: You must be at least 16 years old to use our website.\n If you are under the age of 18, you should review these terms with a\n parent or guardian to ensure their understanding and agreement.\n \n \n User Account: Some features of our website may require you to create\n an account. You are responsible for maintaining the confidentiality\n of your account credentials and are solely responsible for any\n activity that occurs under your account.\n \n \n Prohibited Activities: You agree not to engage in any of the\n following activities:\n \n Violating any applicable laws or regulations. \n \n Impersonating any person or entity or falsely representing your\n affiliation with any person or entity.\n \n \n Interfering with or disrupting the functionality of our website\n or servers.\n \n \n Uploading or transmitting any viruses, malware, or other\n malicious code.\n \n \n Collecting or harvesting any information from our website\n without our consent.\n \n \n \n \n 3. Third-Party Links and Content: \n \n Our website may contain links to third-party websites or display\n content from third parties. We do not endorse or control these\n third-party websites or content, and your use of them is at your own\n risk. We are not responsible for the accuracy, reliability, or\n legality of any third-party websites or content.\n
\n 4. Disclaimer of Warranties: \n \n Our website is provided on an "as is" and "as\n available" basis. We do not make any warranties, express or\n implied, regarding the operation, availability, or accuracy of our\n website or the content therein. Your use of our website is at your\n sole risk.\n
\n 5. Limitation of Liability: \n \n To the maximum extent permitted by law, Sofa Society and its\n affiliates, officers, directors, employees, and agents shall not be\n liable for any direct, indirect, incidental, consequential, or special\n damages arising out of or in connection with your use of our website,\n even if advised of the possibility of such damages.\n
\n 6. Indemnification: \n \n You agree to indemnify, defend, and hold harmless Sofa Society and its\n affiliates, officers, directors, employees, and agents from and\n against any claims, liabilities, damages, losses, and expenses,\n including reasonable attorney's fees, arising out of or in\n connection with your use of our website or violation of these Terms of\n Use.\n
\n 7. Modifications to the Terms: \n \n You agree to indemnify, defend, and hold harmless Sofa Society and its\n affiliates, officers, directors, employees, and agents from and\n against any claims, liabilities, damages, losses, and expenses,\n including reasonable attorney's fees, arising out of or in\n connection with your use of our website or violation of these Terms of\n Use.\n
\n 8. Governing Law and Jurisdiction: \n \n These Terms of Use shall be governed by and construed in accordance\n with the laws. Any disputes arising out of or in connection with these\n terms shall be subject to the exclusive jurisdiction of the courts.\n
\n \n \n )\n}\n"
},
{
"path": "storefront/src/app/layout.tsx",
"content": "import { Metadata } from \"next\"\nimport { SpeedInsights } from \"@vercel/speed-insights/next\"\nimport { Mona_Sans } from \"next/font/google\"\nimport { getBaseURL } from \"@lib/util/env\"\n\nimport \"../styles/globals.css\"\nimport React from \"react\"\nimport { WebMCPProvider } from \"@lib/webmcp/WebMCPProvider\"\n\nexport const metadata: Metadata = {\n metadataBase: new URL(getBaseURL()),\n}\n\nconst monaSans = Mona_Sans({\n preload: true,\n subsets: [\"latin\"],\n style: [\"normal\", \"italic\"],\n display: \"swap\",\n weight: \"variable\",\n variable: \"--font-mona-sans\",\n})\n\nexport default function RootLayout(props: { children: React.ReactNode }) {\n return (\n \n \n {props.children} \n \n \n \n 404\n \n \n \n \n
\n The page you are looking for doesn't exist or an error\n occurred. Go back, or head over to our home page.\n
\n
Back to home \n \n \n \n \n )\n}\n"
},
{
"path": "storefront/src/app/robots.ts",
"content": "import { MetadataRoute } from \"next\"\n\nexport default function robots(): MetadataRoute.Robots {\n if (process.env.DISALLOW_ROBOTS) {\n return {\n rules: {\n userAgent: \"*\",\n disallow: \"/\",\n },\n }\n }\n\n return {\n rules: {\n userAgent: \"*\",\n allow: \"/\",\n disallow: \"/private/\",\n },\n }\n}\n"
},
{
"path": "storefront/src/components/Button.tsx",
"content": "\"use client\"\n\nimport * as React from \"react\"\nimport { twJoin, twMerge } from \"tailwind-merge\"\nimport * as ReactAria from \"react-aria-components\"\nimport Link, { LinkProps } from \"next/link\"\nimport { Icon, IconNames } from \"@/components/Icon\"\n\nexport type ButtonOwnProps = {\n isFullWidth?: boolean\n iconName?: IconNames\n iconPosition?: \"start\" | \"end\"\n isVisuallyDisabled?: boolean\n isLoading?: boolean\n loadingText?: string\n size?: \"sm\" | \"md\"\n spinnerPosition?: \"start\" | \"end\"\n variant?: \"ghost\" | \"outline\" | \"solid\" | \"link\" | \"unstyled\"\n}\n\nexport const getButtonClassNames = ({\n isFullWidth,\n iconName,\n iconPosition,\n isVisuallyDisabled,\n isLoading,\n loadingText,\n size,\n spinnerPosition,\n variant = \"solid\",\n}: ButtonOwnProps): string => {\n const variantClasses = {\n ghost: \"text-black h-auto disabled:text-grayscale-200\",\n unstyled: \"text-black h-auto disabled:text-grayscale-200\",\n outline:\n \"text-black hover:text-grayscale-500 hover:border-grayscale-500 border border-black disabled:text-grayscale-200 disabled:border-grayscale-200\",\n solid:\n \"bg-black hover:bg-grayscale-500 text-white disabled:bg-grayscale-200\",\n link: \"text-black h-auto border-b border-current px-0 rounded-none disabled:text-grayscale-200 hover:border-transparent\",\n }\n\n const visuallyDisabledClasses = isVisuallyDisabled\n ? {\n ghost: \"pointer-events-none text-grayscale-200\",\n link: \"pointer-events-none text-grayscale-200\",\n unstyled: \"pointer-events-none text-grayscale-200\",\n outline: \"pointer-events-none border-grayscale-200 text-grayscale-200\",\n solid: \"pointer-events-none bg-grayscale-200\",\n }[variant]\n : \"\"\n\n const flexDirection =\n iconPosition === \"end\" || spinnerPosition === \"end\"\n ? \"flex-row-reverse\"\n : \"\"\n const hasGap = (isLoading && loadingText) || iconName\n const sizeClasses =\n size === \"sm\" ? \"px-4 h-8 text-xs\" : size === \"md\" ? \"px-6 h-12\" : \"\"\n\n return twJoin(\n \"inline-flex items-center focus-visible:outline-none rounded-xs justify-center transition-colors disabled:pointer-events-none\",\n isFullWidth && \"w-full\",\n flexDirection,\n hasGap && \"gap-2\",\n sizeClasses,\n variantClasses[variant],\n visuallyDisabledClasses\n )\n}\n\nexport type ButtonProps = React.ComponentPropsWithoutRef<\"button\"> &\n ButtonOwnProps &\n ReactAria.ButtonProps\n\nexport const Button: React.FC = ({\n isFullWidth,\n isVisuallyDisabled,\n iconName,\n iconPosition = \"start\",\n isLoading,\n loadingText,\n size = \"md\",\n spinnerPosition = \"start\",\n variant = \"solid\",\n type = \"button\",\n className,\n children,\n ...rest\n}) => (\n \n {Boolean(isLoading) && \n {Boolean(isLoading) && &\n ButtonOwnProps & {\n className?: string\n children?: React.ReactNode\n }\n> = ({\n isFullWidth,\n isVisuallyDisabled,\n iconName,\n iconPosition = \"start\",\n isLoading,\n loadingText,\n size = \"md\",\n spinnerPosition = \"start\",\n variant = \"solid\",\n className,\n children,\n ...rest\n}) => (\n \n {Boolean(isLoading) && = ({\n heading,\n button,\n arrows = true,\n children,\n className,\n}) => {\n const [emblaRef, emblaApi] = useEmblaCarousel({\n containScroll: \"trimSnaps\",\n skipSnaps: true,\n active: true,\n })\n const [prevBtnDisabled, setPrevBtnDisabled] = React.useState(true)\n const [nextBtnDisabled, setNextBtnDisabled] = React.useState(true)\n\n const scrollPrev = React.useCallback(\n () => emblaApi && emblaApi.scrollPrev(),\n [emblaApi]\n )\n const scrollNext = React.useCallback(\n () => emblaApi && emblaApi.scrollNext(),\n [emblaApi]\n )\n const onSelect = React.useCallback((emblaApi: EmblaCarouselType) => {\n setPrevBtnDisabled(!emblaApi.canScrollPrev())\n setNextBtnDisabled(!emblaApi.canScrollNext())\n }, [])\n\n React.useEffect(() => {\n if (!emblaApi) return\n\n onSelect(emblaApi)\n emblaApi.on(\"reInit\", onSelect)\n emblaApi.on(\"select\", onSelect)\n }, [emblaApi, onSelect])\n\n return (\n \n
\n \n \n {heading}\n {(arrows || button) && (\n
\n {button}\n {arrows && (\n
\n \n \n \n \n \n \n \n \n
\n )}\n
\n )}\n
\n \n
setIsCartDrawerOpen(true)}\n variant=\"ghost\"\n className=\"p-1 group-data-[light=true]:md:text-white group-data-[sticky=true]:md:text-black\"\n aria-label=\"Open cart\"\n >\n {pendingQuantity ? (\n 0 ? quantity : undefined}\n />\n )}\n \n \n {({ close }) => (\n <>\n \n {cart?.items?.length ? (\n <>\n \n {cart?.items\n .sort((a, b) => {\n return (a.created_at ?? \"\") > (b.created_at ?? \"\")\n ? -1\n : 1\n })\n .map((item) => {\n return (\n
\n \n \n Proceed to checkout\n \n
\n \n ) : isPending ? (\n \n
\n ) : (\n <>\n \n You don't have anything in your cart. Let's change\n that, use the link below to start browsing our products.\n
\n \n {\n setIsCartDrawerOpen(false)\n }}\n >\n Explore products\n \n
\n \n )}\n \n )}\n \n \n )\n})\n"
},
{
"path": "storefront/src/components/CartIcon.tsx",
"content": "import { Suspense } from \"react\"\nimport { getCartQuantity } from \"@lib/data/cart\"\nimport { Icon, IconProps } from \"@/components/Icon\"\n\nconst CartIconWithQuantity: React.FC<\n Omit\n> = async (props) => {\n const quantity = await getCartQuantity()\n\n return (\n 0 ? quantity : undefined} {...props} />\n )\n}\n\nexport const CartIcon: React.FC> = (\n props\n) => {\n return (\n Collections}\n button={\n <>\n \n View All\n \n \n View All\n \n \n }\n className={className}\n >\n {collections.collections.map((collection) => (\n \n \n {typeof collection.metadata?.image === \"object\" &&\n collection.metadata.image &&\n \"url\" in collection.metadata.image &&\n typeof collection.metadata.image.url === \"string\" && (\n \n
\n )}\n {collection.title} \n {typeof collection.metadata?.description === \"string\" &&\n collection.metadata?.description.length > 0 && (\n \n {collection.metadata.description}\n
\n )}\n \n \n ))}\n \n )\n}\n"
},
{
"path": "storefront/src/components/Dialog.tsx",
"content": "\"use client\"\n\nimport * as React from \"react\"\nimport * as ReactAria from \"react-aria-components\"\nimport { twMerge } from \"tailwind-merge\"\nimport { Button, ButtonProps } from \"@/components/Button\"\n\nexport const UiDialogTrigger: React.FC = ({\n children,\n ...rest\n}) => {children} \n\nexport const UiDialog: React.FC = ({\n children,\n className,\n ...rest\n}) => (\n \n {children}\n \n)\n\nexport const UiCloseButton: React.FC = (props) => {\n const { close } = React.useContext(ReactAria.OverlayTriggerStateContext)!\n\n return }\n> = (props) => {\n const { close } = React.useContext(ReactAria.OverlayTriggerStateContext)!\n const onPress = React.useCallback(\n async (e: ReactAria.PressEvent) => {\n await props.onConfirm()\n close()\n props.onPress?.(e)\n },\n [props, close]\n )\n\n return ,\n UiModalOwnProps,\n Pick {\n colorScheme?: \"light\" | \"dark\"\n className?: string\n}\n\nexport const Drawer: React.FC = ({\n colorScheme = \"dark\",\n animateFrom,\n className,\n children,\n ...rest\n}) => {\n return (\n \n \n {children} \n \n \n )\n}\n"
},
{
"path": "storefront/src/components/Footer.tsx",
"content": "\"use client\"\n\nimport { useParams, usePathname } from \"next/navigation\"\nimport { twMerge } from \"tailwind-merge\"\nimport { Layout, LayoutColumn } from \"@/components/Layout\"\nimport { NewsletterForm } from \"@/components/NewsletterForm\"\nimport { LocalizedLink } from \"@/components/LocalizedLink\"\n\nexport const Footer: React.FC = () => {\n const pathName = usePathname()\n const { countryCode } = useParams()\n const currentPath = pathName.split(`/${countryCode}`)[1]\n\n const isAuthPage = currentPath === \"/register\" || currentPath === \"/login\"\n\n return (\n \n \n \n \n
\n
\n
\n Sofa Society Co.\n \n
\n © {new Date().getFullYear()}, Sofa Society\n
\n
\n
\n
\n \n FAQ \n \n \n Help \n \n \n Delivery \n \n \n Returns \n \n \n
\n
\n \n \n Privacy Policy\n \n \n \n \n Cookie Policy\n \n \n \n \n Terms of Use\n \n \n \n
\n
\n\n
\n
\n \n \n )\n}\n"
},
{
"path": "storefront/src/components/Forms.tsx",
"content": "\"use client\"\n\nimport * as React from \"react\"\nimport { twJoin, twMerge } from \"tailwind-merge\"\nimport * as ReactAria from \"react-aria-components\"\nimport { Icon } from \"@/components/Icon\"\nimport {\n FormProvider,\n useForm,\n UseFormProps,\n DefaultValues,\n UseFormReturn,\n useController,\n ControllerRenderProps,\n} from \"react-hook-form\"\nimport { z } from \"zod\"\nimport { zodResolver } from \"@hookform/resolvers/zod\"\nimport CountrySelect from \"@modules/checkout/components/country-select\"\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type FormProps> = UseFormProps<\n z.infer\n> & {\n schema: T\n onSubmit: (\n values: z.infer,\n form: UseFormReturn>\n ) => void | Promise\n defaultValues?: DefaultValues>\n children?:\n | React.ReactNode\n | ((form: UseFormReturn>) => React.ReactNode)\n\n formProps?: Omit, \"onSubmit\">\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const Form = >({\n schema,\n onSubmit,\n children,\n formProps,\n ...props\n}: FormProps) => {\n const form = useForm({\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n resolver: zodResolver(schema as any),\n ...props,\n })\n\n const submitHandler = React.useCallback(\n (values: z.infer) => {\n return onSubmit(values, form)\n },\n [onSubmit, form]\n )\n\n const onFormSubmit: React.FormEventHandler =\n React.useCallback(\n (event) => {\n event.preventDefault()\n event.stopPropagation()\n form.handleSubmit(submitHandler, (err) => console.error(err))(event)\n },\n [form, submitHandler]\n )\n\n return (\n \n \n \n )\n}\n\nexport const getInputClassNames = ({\n uiSize = \"lg\",\n isVisuallyDisabled,\n isSuccess,\n}: InputOwnProps): string => {\n const sizeClasses = {\n sm: \"h-9 text-xs focus:pt-3.5 [&:not(:placeholder-shown)]:pt-3.5 [&:autofill]:pt-3.5\",\n md: \"h-12 focus:pt-3 [&:not(:placeholder-shown)]:pt-3 [&:autofill]:pt-3\",\n lg: \"h-14 focus:pt-4 [&:not(:placeholder-shown)]:pt-4 [&:autofill]:pt-4\",\n }\n\n const visuallyDisabledClasses = isVisuallyDisabled\n ? \"pointer-events-none bg-grayscale-50\"\n : \"\"\n\n const successClasses = isSuccess ? \"border-green-500 pr-7\" : \"\"\n\n return twJoin(\n \"peer block w-full rounded-xs transition-all outline-none px-4 placeholder:invisible border border-grayscale-200 hover:border-grayscale-500 focus:border-grayscale-500 bg-transparent disabled:pointer-events-none disabled:bg-grayscale-50 [&:autofill]:bg-clip-text aria-[invalid=true]:border-red-primary aria-[invalid=true]:focus:border-red-900 aria-[invalid=true]:hover:border-red-900\",\n sizeClasses[uiSize],\n visuallyDisabledClasses,\n successClasses\n )\n}\n\nexport const getPlaceholderClassNames = ({\n uiSize = \"lg\",\n}: Pick): string => {\n const sizeClasses = {\n lg: \"peer-focus:top-2.5 peer-[:not(:placeholder-shown)]:top-2.5 peer-[:autofill]:top-2.5 peer-focus:text-xs peer-[:not(:placeholder-shown)]:text-xs peer-[:autofill]:text-xs\",\n md: \"peer-focus:top-1 peer-[:not(:placeholder-shown)]:top-1 peer-[:autofill]:top-1 peer-focus:text-xs peer-[:not(:placeholder-shown)]:text-xs peer-[:autofill]:text-xs\",\n sm: \"peer-focus:top-1 peer-[:not(:placeholder-shown)]:top-1 peer-[:autofill]:top-1 text-xs peer-focus:text-2xs peer-[:not(:placeholder-shown)]:text-2xs peer-[:autofill]:text-2xs\",\n }\n\n return twJoin(\n \"absolute -translate-y-1/2 peer-placeholder-shown:top-1/2 left-4 peer-[:not(:placeholder-shown)]:translate-y-0 peer-[:autofill]:translate-y-0 peer-focus:translate-y-0 text-grayscale-400 pointer-events-none transition-all\",\n sizeClasses[uiSize]\n )\n}\n\n/**\n * Label\n */\ntype InputLabelOwnProps = {\n isRequired?: boolean\n}\n\nexport const InputLabel: React.FC<\n React.ComponentPropsWithRef<\"label\"> & InputLabelOwnProps\n> = ({ isRequired, children, className, ...rest }) => (\n \n {children}\n {isRequired && * }\n \n)\n\n/**\n * SubLabel\n */\ntype InputSubLabelOwnProps = {\n type: \"success\" | \"error\"\n}\n\nexport const InputSubLabel: React.FC<\n React.ComponentPropsWithRef<\"p\"> & InputSubLabelOwnProps\n> = ({ type, children, className, ...rest }) => (\n \n {children}\n \n)\n\n/**\n * Input\n */\nexport type InputOwnProps = {\n uiSize?: \"sm\" | \"md\" | \"lg\"\n isVisuallyDisabled?: boolean\n isSuccess?: boolean\n errorMessage?: string\n wrapperClassName?: string\n}\n\nexport const Input = React.forwardRef<\n HTMLInputElement,\n React.ComponentProps<\"input\"> & InputOwnProps\n>(\n (\n {\n uiSize = \"lg\",\n isVisuallyDisabled,\n isSuccess,\n errorMessage,\n wrapperClassName,\n placeholder,\n className,\n ...rest\n },\n ref\n ) => (\n \n \n {placeholder}\n \n )}\n {isSuccess && (\n \n {errorMessage}\n \n )}\n
\n )\n)\n\nInput.displayName = \"Input\"\n\nexport interface InputFieldProps {\n className?: string\n name: string\n placeholder?: string\n type?: React.ComponentProps[\"type\"]\n inputProps?: Omit<\n React.ComponentProps,\n \"name\" | \"id\" | \"type\" | keyof ControllerRenderProps\n >\n}\n\nexport const InputField: React.FC = ({\n className,\n name,\n type,\n inputProps,\n placeholder,\n}) => {\n const { field, fieldState } = useController<{ __name__: string }, \"__name__\">(\n { name: name as \"__name__\" }\n )\n\n return (\n \n
\n {fieldState.error && (\n
\n {fieldState.error.message} \n
\n )}\n
,\n \"name\" | \"id\" | keyof ControllerRenderProps\n >\n isRequired?: boolean\n children?: React.ReactNode\n}\n\nexport const CountrySelectField: React.FC = ({\n className,\n name,\n selectProps,\n children,\n}) => {\n const { field, fieldState } = useController<{ __name__: string }, \"__name__\">(\n { name: name as \"__name__\" }\n )\n\n return (\n \n
\n {children}\n \n {fieldState.error && (\n \n {fieldState.error.message} \n
\n )}\n \n \n \n \n
\n SofaSocietyCo. \n \n
\n About \n Inspiration \n Shop \n
\n
\n \n \n
\n
\n \n \n
\n
\n \n \n \n )\n}\n"
},
{
"path": "storefront/src/components/HeaderDrawer.tsx",
"content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Button } from \"@/components/Button\"\nimport { Icon } from \"@/components/Icon\"\nimport { Drawer } from \"@/components/Drawer\"\nimport { LocalizedLink } from \"@/components/LocalizedLink\"\nimport { RegionSwitcher } from \"@/components/RegionSwitcher\"\nimport { SearchField } from \"@/components/SearchField\"\nimport { useSearchParams } from \"next/navigation\"\n\nexport const HeaderDrawer: React.FC<{\n countryOptions: {\n country: string | undefined\n region: string\n label: string | undefined\n }[]\n}> = ({ countryOptions }) => {\n const [isMenuOpen, setIsMenuOpen] = React.useState(false)\n\n const searchParams = useSearchParams()\n const searchQuery = searchParams.get(\"query\")\n\n React.useEffect(() => {\n if (searchQuery) setIsMenuOpen(false)\n }, [searchQuery])\n\n return (\n <>\n setIsMenuOpen(true)}\n aria-label=\"Open menu\"\n >\n \n {({ close }) => (\n <>\n \n
\n \n \n
\n
\n setIsMenuOpen(false)}\n >\n About\n \n setIsMenuOpen(false)}\n >\n Inspiration\n \n setIsMenuOpen(false)}\n >\n Shop\n \n
\n
\n
![\"Figma](\"https://img.shields.io/badge/Figma-Design_Template-F24E1E?style=for-the-badge&logo=figma&logoColor=white\"){kind=icon}
\n \n![\"Medusa](\"https://user-images.githubusercontent.com/59018053/229103726-e5b529a3-9b3f-4970-8a1f-c6af37f087bf.svg\")
\n ![\"PRs](\"https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat\"){kind=icon}
\n \n ![\"Product](\"https://img.shields.io/badge/Product%20Hunt-%231%20Product%20of%20the%20Day-%23DA552E\"){kind=icon}
![\"Discord](\"https://img.shields.io/badge/chat-on%20discord-7289DA.svg\"){kind=icon}
\n \n \n ![\"Follow](\"https://img.shields.io/twitter/follow/medusajs.svg?label=Follow%20@medusajs\")
\n \n