@lookiero/checkout 0.1.1

package/src/infrastructure/projection/httpBookedSizeReplaceableProductVariantsForCheckoutItemView.ts

@@ -0,0 +1,102 @@
+import {
+  BookedSizeReplaceableProductVariantsProjection,
+  BookedSizeReplaceableProductVariantsForCheckoutItemView,
+  ProductVariant,
+  Size,
+} from "../../projection/bookedSizeReplaceableProductVariants/viewBookedSizeReplaceableProductVariantsForCheckoutItem";
+import { HttpPostFunction } from "../delivery/http/httpClient";
+
+interface SizeFormatDto {
+  readonly size: string;
+  readonly format: string;
+  readonly length?: string;
+}
+
+interface SizeDto {
+  readonly id: string;
+  readonly europe: SizeFormatDto;
+  readonly it: SizeFormatDto;
+  readonly lookiero: SizeFormatDto;
+  readonly uk: SizeFormatDto;
+}
+
+interface ToSizeFunction {
+  (size: SizeDto): Size;
+}
+
+const toSize: ToSizeFunction = (size) => ({
+  id: size.id,
+  europe: size.europe,
+  it: size.it,
+  lookiero: size.lookiero,
+  uk: size.uk,
+});
+
+interface ProductVariantDto {
+  readonly id: string;
+  readonly size: SizeDto;
+}
+
+interface ToProductVariantFunction {
+  (productVariant: ProductVariantDto): ProductVariant;
+}
+
+const toProductVariant: ToProductVariantFunction = (productVariant) => ({
+  id: productVariant.id,
+  size: toSize(productVariant.size),
+});
+
+interface BookedSizeReplaceableProductVariantsDto {
+  readonly booking: string | null;
+  readonly product_variants: ProductVariantDto[];
+}
+
+interface ToBookedSizeReplaceableProductVariantsFunction {
+  (
+    bookedSizeReplaceableProductVariants: BookedSizeReplaceableProductVariantsDto,
+  ): BookedSizeReplaceableProductVariantsProjection;
+}
+
+const toBookedSizeReplaceableProductVariants: ToBookedSizeReplaceableProductVariantsFunction = (
+  bookedSizeReplaceableProductVariants,
+) => ({
+  booking: bookedSizeReplaceableProductVariants.booking,
+  productVariants: bookedSizeReplaceableProductVariants.product_variants.map(toProductVariant),
+});
+
+interface HttpBookedSizeReplaceableProductVariantsForCheckoutItemView
+  extends BookedSizeReplaceableProductVariantsForCheckoutItemView {}
+
+interface HttpBookedSizeReplaceableProductVariantsForCheckoutItemViewFunctionArgs {
+  readonly httpPost: HttpPostFunction;
+}
+
+interface HttpBookedSizeReplaceableProductVariantsForCheckoutItemViewFunction {
+  (
+    args: HttpBookedSizeReplaceableProductVariantsForCheckoutItemViewFunctionArgs,
+  ): HttpBookedSizeReplaceableProductVariantsForCheckoutItemView;
+}
+
+const httpBookedSizeReplaceableProductVariantsForCheckoutItemView: HttpBookedSizeReplaceableProductVariantsForCheckoutItemViewFunction =
+
+    ({ httpPost }) =>
+    async ({ checkoutItemId }): Promise<BookedSizeReplaceableProductVariantsProjection | undefined> => {
+      try {
+        const response = await httpPost({
+          endpoint: "/view-booked-size-replaceable-product-variants-for-checkout-item",
+          body: { checkout_item_id: checkoutItemId },
+        });
+
+        return response.status === 404
+          ? undefined
+          : toBookedSizeReplaceableProductVariants((await response.json()).result);
+      } catch (ignored) {
+        throw new Error("Could not fetch BookedSizeReplaceableProductVariantsForCheckoutItem");
+      }
+    };
+
+export {
+  BookedSizeReplaceableProductVariantsDto,
+  toBookedSizeReplaceableProductVariants,
+  httpBookedSizeReplaceableProductVariantsForCheckoutItemView,
+};

package/src/infrastructure/projection/httpFirstAvailableCheckoutByCustomerIdView.test.ts

@@ -0,0 +1,99 @@
+import { v4 as uuid } from "uuid";
+import {
+  CheckoutItemStatus,
+  CheckoutStatus,
+  Currency,
+  MediaPerspective,
+} from "../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
+import {
+  CheckoutDto,
+  httpFirstAvailableCheckoutByCustomerIdView as sut,
+  toCheckoutProjection,
+} from "./httpFirstAvailableCheckoutByCustomerIdView";
+
+const customerId = "29790d24-b139-4ab8-b618-d796d101e974";
+const checkoutResponse: { result: CheckoutDto } = {
+  result: {
+    id: uuid(),
+    status: CheckoutStatus.STARTED,
+    customer_id: uuid(),
+    box_id: uuid(),
+    booking_id: uuid(),
+    expires_on: "2022-09-20",
+    items: [
+      {
+        id: uuid(),
+        status: CheckoutItemStatus.KEPT,
+        product_variant: {
+          id: uuid(),
+          media: [
+            {
+              id: uuid(),
+              url: "https://cdn-catalog-back-prod.envs.lookiero.tech/d2/65/d2655b80-7745-4537-bb17-eb38f960a8de.jpg",
+              perspective: MediaPerspective.FRONT,
+            },
+          ],
+          brand: "CKS",
+          name: "Sari Tshirt lines",
+          price: {
+            amount: 3999,
+            currency: Currency.EUR,
+          },
+          size: {
+            id: uuid(),
+            lookiero: "M",
+            uk: "M",
+            it: "M",
+            europe: "M",
+            unique: false,
+          },
+          color: {
+            id: uuid(),
+            label: "black_C2",
+          },
+        },
+      },
+    ],
+  },
+};
+const checkoutResponseOk: Response = {
+  ok: true,
+  status: 200,
+  json: () => Promise.resolve(checkoutResponse),
+} as Response;
+const checkoutResponseNotFound: Response = {
+  ok: false,
+  status: 404,
+} as Response;
+const checkoutResponseError: Response = {
+  ok: false,
+} as Response;
+
+const httpPostMock = jest.fn();
+const view = sut({ httpPost: httpPostMock });
+
+describe("httpFirstAvailableCheckoutByCustomerIdView", () => {
+  it("returns a Checkout projection for a 200 response", async () => {
+    httpPostMock.mockReturnValue(Promise.resolve(checkoutResponseOk));
+
+    const returnedCheckout = await view({ customerId });
+
+    expect(returnedCheckout).toStrictEqual(toCheckoutProjection(checkoutResponse.result));
+  });
+
+  it("returns undefined for a 404 response", async () => {
+    httpPostMock.mockReturnValue(Promise.resolve(checkoutResponseNotFound));
+
+    const returnedCheckout = await view({ customerId });
+
+    expect(returnedCheckout).toBeUndefined();
+  });
+
+  it("returns undefined for a non successfull response", async () => {
+    httpPostMock.mockReturnValue(Promise.resolve(checkoutResponseError));
+
+    const returnedCheckout = await view({ customerId });
+
+    expect(returnedCheckout).toBeUndefined();
+  });
+});

package/src/infrastructure/projection/httpFirstAvailableCheckoutByCustomerIdView.ts

@@ -0,0 +1,128 @@
+import {
+  CheckoutItemStatus,
+  CheckoutProjection,
+  CheckoutStatus,
+  Currency,
+  FirstAvailableCheckoutByCustomerIdView,
+  MediaPerspective,
+} from "../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
+import { HttpPostFunction } from "../delivery/http/httpClient";
+
+interface CheckoutDto {
+  readonly id: string;
+  readonly customer_id: string;
+  readonly box_id: string;
+  readonly booking_id: string;
+  readonly status: CheckoutStatus;
+  readonly expires_on: string;
+  readonly items: {
+    readonly id: string;
+    readonly status: CheckoutItemStatus;
+    readonly product_variant: {
+      readonly id: string;
+      readonly media: {
+        readonly id: string;
+        readonly url: string;
+        readonly perspective: MediaPerspective;
+      }[];
+      readonly brand: string;
+      readonly name: string;
+      readonly price: {
+        readonly amount: number;
+        readonly currency: Currency;
+        readonly discounted_price?: {
+          readonly amount: number;
+          readonly percentage: number;
+        };
+      };
+      readonly size: {
+        readonly id: string;
+        readonly lookiero: string;
+        readonly uk: string;
+        readonly it: string;
+        readonly europe: string;
+        readonly unique: boolean;
+        readonly visual_order?: number;
+      };
+      readonly color: {
+        readonly id: string;
+        readonly label: string;
+      };
+    };
+    readonly replaced_for?: string;
+  }[];
+}
+
+interface ToCheckoutProjectionFunction {
+  (checkoutDto: CheckoutDto): CheckoutProjection;
+}
+
+const toCheckoutProjection: ToCheckoutProjectionFunction = (checkoutDto) => ({
+  id: checkoutDto.id,
+  customerId: checkoutDto.customer_id,
+  boxId: checkoutDto.box_id,
+  bookingId: checkoutDto.booking_id,
+  status: checkoutDto.status,
+  expiresOn: new Date(checkoutDto.expires_on),
+  items: checkoutDto.items.map((item) => ({
+    id: item.id,
+    status: item.status,
+    replacedFor: item.replaced_for,
+    productVariant: {
+      id: item.product_variant.id,
+      media: item.product_variant.media.map((media) => ({
+        id: media.id,
+        url: media.url,
+        perspective: media.perspective,
+      })),
+      brand: item.product_variant.brand,
+      name: item.product_variant.name,
+      price: {
+        amount: item.product_variant.price.amount,
+        currency: item.product_variant.price.currency,
+        discountedPrice: item.product_variant.price.discounted_price
+          ? {
+              amount: item.product_variant.price.discounted_price.amount,
+              percentage: item.product_variant.price.discounted_price.percentage,
+            }
+          : undefined,
+      },
+      size: {
+        id: item.product_variant.size.id,
+        lookiero: item.product_variant.size.lookiero,
+        uk: item.product_variant.size.uk,
+        it: item.product_variant.size.it,
+        europe: item.product_variant.size.europe,
+        unique: item.product_variant.size.unique,
+        visualOrder: item.product_variant.size.visual_order,
+      },
+      color: {
+        id: item.product_variant.color.id,
+        label: item.product_variant.color.label,
+      },
+    },
+  })),
+});
+
+interface HttpFirstAvailableCheckoutByCustomerIdView extends FirstAvailableCheckoutByCustomerIdView {}
+
+interface HttpFirstAvailableCheckoutByCustomerIdViewFunctionArgs {
+  readonly httpPost: HttpPostFunction;
+}
+
+interface HttpFirstAvailableCheckoutByCustomerIdViewFunction {
+  (args: HttpFirstAvailableCheckoutByCustomerIdViewFunctionArgs): HttpFirstAvailableCheckoutByCustomerIdView;
+}
+
+const httpFirstAvailableCheckoutByCustomerIdView: HttpFirstAvailableCheckoutByCustomerIdViewFunction =
+  ({ httpPost }) =>
+  async ({ customerId }): Promise<CheckoutProjection | undefined> => {
+    const response = await httpPost({
+      endpoint: "/view-first-available-checkout-by-customer-id",
+      body: { customer_id: customerId },
+    });
+
+    return !response.ok || response.status === 404 ? undefined : toCheckoutProjection((await response.json()).result);
+  };
+
+export { CheckoutDto, toCheckoutProjection, httpFirstAvailableCheckoutByCustomerIdView };

package/src/infrastructure/projection/httpIsCheckoutEnabledByCustomerIdView.test.ts

@@ -0,0 +1,32 @@
+import { httpIsCheckoutEnabledByCustomerIdView as sut } from "./httpIsCheckoutEnabledByCustomerIdView";
+
+const customerId = "29790d24-b139-4ab8-b618-d796d101e974";
+const checkoutResponseOk: Response = {
+  ok: true,
+  status: 200,
+  json: () => Promise.resolve(true),
+} as Response;
+const checkoutResponseError: Response = {
+  ok: false,
+} as Response;
+
+const httpGetMock = jest.fn();
+const view = sut({ httpGet: httpGetMock });
+
+describe("httpIsCheckoutEnabledByCustomerIdView", () => {
+  it("returns true/false if enabled/not for a 200 response", async () => {
+    httpGetMock.mockReturnValue(Promise.resolve(checkoutResponseOk));
+
+    const enabled = await view({ customerId });
+
+    expect(enabled).toBe(true);
+  });
+
+  it("returns false for a non successfull response", async () => {
+    httpGetMock.mockReturnValue(Promise.resolve(checkoutResponseError));
+
+    const enabled = await view({ customerId });
+
+    expect(enabled).toBe(false);
+  });
+});

package/src/infrastructure/projection/httpIsCheckoutEnabledByCustomerIdView.ts

@@ -0,0 +1,27 @@
+import {
+  IsCheckoutEnabledByCustomerIdProjection,
+  IsCheckoutEnabledByCustomerIdView,
+} from "../../projection/checkout/viewIsCheckoutEnabledByCustomerId";
+import { HttpGetFunction } from "../delivery/http/httpClient";
+
+interface HttpIsCheckoutEnabledByCustomerIdView extends IsCheckoutEnabledByCustomerIdView {}
+
+interface HttpIsCheckoutEnabledByCustomerIdViewFunctionArgs {
+  readonly httpGet: HttpGetFunction;
+}
+
+interface HttpIsCheckoutEnabledByCustomerIdViewFunction {
+  (args: HttpIsCheckoutEnabledByCustomerIdViewFunctionArgs): HttpIsCheckoutEnabledByCustomerIdView;
+}
+
+const httpIsCheckoutEnabledByCustomerIdView: HttpIsCheckoutEnabledByCustomerIdViewFunction =
+  ({ httpGet }) =>
+  async ({ customerId }): Promise<IsCheckoutEnabledByCustomerIdProjection> => {
+    const response = await httpGet({
+      endpoint: `/is-new-checkout-enabled/${customerId}`,
+    });
+
+    return !response.ok ? false : await response.json();
+  };
+
+export { httpIsCheckoutEnabledByCustomerIdView };

package/src/infrastructure/projection/react/useViewBookedSizeReplaceableProductVariantsForCheckoutItem.test.ts

@@ -0,0 +1,51 @@
+import { bootstrap } from "@lookiero/messaging-react";
+import { renderHook } from "@testing-library/react-hooks";
+import {
+  BookedSizeReplaceableProductVariantsProjection,
+  viewBookedSizeReplaceableProductVariantsForCheckoutItemHandler,
+  VIEW_BOOKED_SIZE_REPLACEABLE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM,
+} from "../../../projection/bookedSizeReplaceableProductVariants/viewBookedSizeReplaceableProductVariantsForCheckoutItem";
+import { useViewBookedSizeReplaceableProductVariantsForCheckoutItem } from "./useViewBookedSizeReplaceableProductVariantsForCheckoutItem";
+
+const checkoutItemId = "6f720954-8039-4bed-9596-34fc5a02131b";
+const bookedSizeReplaceableProductVariants: BookedSizeReplaceableProductVariantsProjection = {
+  booking: "b00e2c2d-7d9c-4808-88a4-e1c845ae6889",
+  productVariants: [
+    {
+      id: "383fab95-56eb-4639-bb18-530ab792b4d3",
+      size: {
+        id: "4f8a26b8-8d2d-4012-b49a-7d2820095598",
+        europe: { size: "36", format: "36" },
+        lookiero: { size: "S", format: "S" },
+        uk: { size: "8", format: "8" },
+        it: { size: "M", format: "M" },
+      },
+    },
+  ],
+};
+const view = jest.fn().mockReturnValue(bookedSizeReplaceableProductVariants);
+const { Component: Messaging } = bootstrap({ id: "Checkout" })
+  .query(
+    VIEW_BOOKED_SIZE_REPLACEABLE_PRODUCT_VARIANTS_FOR_CHECKOUT_ITEM,
+    viewBookedSizeReplaceableProductVariantsForCheckoutItemHandler,
+    {
+      view,
+    },
+  )
+  .build();
+
+describe("useViewBookedSizeReplaceableProductVariantsForCheckoutItem integration hook", () => {
+  it("returns success as the query status and the result itself after rendering the hook", async () => {
+    const { result, waitFor } = renderHook(
+      () => useViewBookedSizeReplaceableProductVariantsForCheckoutItem({ checkoutItemId }),
+      { wrapper: Messaging },
+    );
+
+    await waitFor(() => {
+      const [projection, status] = result.current;
+
+      expect(projection).toStrictEqual(bookedSizeReplaceableProductVariants);
+      expect(status).toBe("success");
+    });
+  });
+});

package/src/infrastructure/projection/react/useViewBookedSizeReplaceableProductVariantsForCheckoutItem.ts

@@ -0,0 +1,25 @@
+import { useQuery, UseQueryFunctionResult } from "@lookiero/messaging-react";
+import {
+  BookedSizeReplaceableProductVariantsProjection,
+  viewBookedSizeReplaceableProductVariantsForCheckoutItem,
+} from "../../../projection/bookedSizeReplaceableProductVariants/viewBookedSizeReplaceableProductVariantsForCheckoutItem";
+
+interface UseViewBookedSizeReplaceableProductVariantsForCheckoutItemFunctionArgs {
+  readonly checkoutItemId: string;
+}
+
+interface UseViewBookedSizeReplaceableProductVariantsForCheckoutItemFunction {
+  (
+    args: UseViewBookedSizeReplaceableProductVariantsForCheckoutItemFunctionArgs,
+  ): UseQueryFunctionResult<BookedSizeReplaceableProductVariantsProjection>;
+}
+
+const useViewBookedSizeReplaceableProductVariantsForCheckoutItem: UseViewBookedSizeReplaceableProductVariantsForCheckoutItemFunction =
+  ({ checkoutItemId }) =>
+    useQuery({
+      query: viewBookedSizeReplaceableProductVariantsForCheckoutItem({ checkoutItemId }),
+      contextId: "Checkout",
+      options: { staleTime: Infinity },
+    });
+
+export { useViewBookedSizeReplaceableProductVariantsForCheckoutItem };

package/src/infrastructure/projection/react/useViewFirstAvailableCheckoutByCustomerId.test.ts

@@ -0,0 +1,28 @@
+import { bootstrap } from "@lookiero/messaging-react";
+import { renderHook } from "@testing-library/react-hooks";
+import {
+  CheckoutProjection,
+  viewFirstAvailableCheckoutByCustomerIdHandler,
+  VIEW_FIRST_AVAILABLE_CHECKOUT_BY_CUSTOMER_ID,
+} from "../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
+import { useViewFirstAvailableCheckoutByCustomerId as sut } from "./useViewFirstAvailableCheckoutByCustomerId";
+
+const customerId = "29790d24-b139-4ab8-b618-d796d101e974";
+const checkoutProjection: CheckoutProjection = { id: "75574065-5838-42de-9924-c712f7854347" };
+const view = jest.fn().mockReturnValue(checkoutProjection);
+const { Component: Messaging } = bootstrap({ id: "Checkout" })
+  .query(VIEW_FIRST_AVAILABLE_CHECKOUT_BY_CUSTOMER_ID, viewFirstAvailableCheckoutByCustomerIdHandler, { view })
+  .build();
+
+describe("useViewFirstAvailableCheckoutByCustomerId integration hook", () => {
+  it("returns success as the query status and the result itself after rendering the hook", async () => {
+    const { result, waitFor } = renderHook(() => sut({ customerId }), { wrapper: Messaging });
+
+    await waitFor(() => {
+      const [projection, status] = result.current;
+
+      expect(projection).toStrictEqual(checkoutProjection);
+      expect(status).toBe("success");
+    });
+  });
+});

package/src/infrastructure/projection/react/useViewFirstAvailableCheckoutByCustomerId.ts

@@ -0,0 +1,22 @@
+import { useQuery, UseQueryFunctionResult } from "@lookiero/messaging-react";
+import {
+  CheckoutProjection,
+  viewFirstAvailableCheckoutByCustomerId,
+} from "../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
+
+interface UseViewFirstAvailableCheckoutByCustomerIdFunctionArgs {
+  readonly customerId: string;
+}
+
+interface UseViewFirstAvailableCheckoutByCustomerIdFunction {
+  (args: UseViewFirstAvailableCheckoutByCustomerIdFunctionArgs): UseQueryFunctionResult<CheckoutProjection>;
+}
+
+const useViewFirstAvailableCheckoutByCustomerId: UseViewFirstAvailableCheckoutByCustomerIdFunction = ({ customerId }) =>
+  useQuery({
+    query: viewFirstAvailableCheckoutByCustomerId({ customerId }),
+    contextId: "Checkout",
+    options: { staleTime: Infinity, retry: false },
+  });
+
+export { useViewFirstAvailableCheckoutByCustomerId };

package/src/infrastructure/projection/react/useViewIsCheckoutAccessibleByCustomerId.test.ts

@@ -0,0 +1,44 @@
+import { bootstrap } from "@lookiero/messaging-react";
+import { renderHook } from "@testing-library/react-hooks";
+import {
+  CheckoutProjection,
+  viewFirstAvailableCheckoutByCustomerIdHandler,
+  VIEW_FIRST_AVAILABLE_CHECKOUT_BY_CUSTOMER_ID,
+} from "../../../projection/checkout/viewFirstAvailableCheckoutByCustomerId";
+import {
+  viewIsCheckoutAccessibleByCustomerIdHandler,
+  VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID,
+} from "../../../projection/checkout/viewIsCheckoutAccessibleByCustomerId";
+import {
+  viewIsCheckoutEnabledByCustomerIdHandler,
+  VIEW_IS_CHECKOUT_ENABLED_BY_CUSTOMER_ID,
+} from "../../../projection/checkout/viewIsCheckoutEnabledByCustomerId";
+import { useViewIsCheckoutAccessibleByCustomerId as sut } from "./useViewIsCheckoutAccessibleByCustomerId";
+
+const customerId = "29790d24-b139-4ab8-b618-d796d101e974";
+const checkoutProjection: CheckoutProjection = { id: "75574065-5838-42de-9924-c712f7854347" };
+const firstAvailableCheckoutByCustomerIdViewMock = jest.fn().mockReturnValue(checkoutProjection);
+const isCheckoutAccessibleByCustomerIdViewMock = jest.fn().mockReturnValue(checkoutProjection);
+
+const { Component: Messaging } = bootstrap({ id: "Checkout" })
+  .query(VIEW_FIRST_AVAILABLE_CHECKOUT_BY_CUSTOMER_ID, viewFirstAvailableCheckoutByCustomerIdHandler, {
+    view: firstAvailableCheckoutByCustomerIdViewMock,
+  })
+  .query(VIEW_IS_CHECKOUT_ENABLED_BY_CUSTOMER_ID, viewIsCheckoutEnabledByCustomerIdHandler, {
+    view: isCheckoutAccessibleByCustomerIdViewMock,
+  })
+  .query(VIEW_IS_CHECKOUT_ACCESSIBLE_BY_CUSTOMER_ID, viewIsCheckoutAccessibleByCustomerIdHandler, {})
+  .build();
+
+describe("useViewIsCheckoutAccessibleByCustomerId integration hook", () => {
+  it("returns success as the query status and the result itself after rendering the hook", async () => {
+    const { result, waitFor } = renderHook(() => sut({ customerId }), { wrapper: Messaging });
+
+    await waitFor(() => {
+      const [projection, status] = result.current;
+
+      expect(projection).toBe(true);
+      expect(status).toBe("success");
+    });
+  });
+});

package/src/infrastructure/projection/react/useViewIsCheckoutAccessibleByCustomerId.ts

@@ -0,0 +1,24 @@
+import { useQuery, UseQueryFunctionResult } from "@lookiero/messaging-react";
+import {
+  IsCheckoutAccessibleByCustomerIdProjection,
+  viewIsCheckoutAccessibleByCustomerId,
+} from "../../../projection/checkout/viewIsCheckoutAccessibleByCustomerId";
+
+interface UseViewIsCheckoutAccessibleByCustomerIdFunctionArgs {
+  readonly customerId: string | undefined;
+}
+
+interface UseViewIsCheckoutAccessibleByCustomerIdFunction {
+  (
+    args: UseViewIsCheckoutAccessibleByCustomerIdFunctionArgs,
+  ): UseQueryFunctionResult<IsCheckoutAccessibleByCustomerIdProjection>;
+}
+
+const useViewIsCheckoutAccessibleByCustomerId: UseViewIsCheckoutAccessibleByCustomerIdFunction = ({ customerId }) =>
+  useQuery({
+    query: viewIsCheckoutAccessibleByCustomerId({ customerId }),
+    contextId: "Checkout",
+    options: { staleTime: Infinity },
+  });
+
+export { useViewIsCheckoutAccessibleByCustomerId };

package/src/infrastructure/projection/react/useViewIsCheckoutIntroVisible.ts

@@ -0,0 +1,5 @@
+import { QueryStatus } from "@lookiero/messaging-react";
+
+const useViewIsCheckoutIntroVisible = () => [false, QueryStatus.SUCCESS];
+
+export { useViewIsCheckoutIntroVisible };

package/src/infrastructure/projection/react/useViewUiSettingByKey.test.ts

@@ -0,0 +1,30 @@
+import { bootstrap } from "@lookiero/messaging-react";
+import { renderHook } from "@testing-library/react-hooks";
+import {
+  UiSettingProjection,
+  viewUiSettingByKeyHandler,
+  VIEW_UI_SETTING_BY_KEY,
+} from "../../../projection/uiSetting/viewUiSettingByKey";
+import { useViewUiSettingByKey as sut } from "./useViewUiSettingByKey";
+
+const uiSettingKey = "ui_setting_key";
+const uiSettingProjection: UiSettingProjection = {
+  id: "this-should-be-a-uuid",
+  key: uiSettingKey,
+  value: "ui_setting_value",
+};
+const view = jest.fn().mockReturnValue(uiSettingProjection);
+const { Component: Messaging } = bootstrap().query(VIEW_UI_SETTING_BY_KEY, viewUiSettingByKeyHandler, { view }).build();
+
+describe("useViewUiSettingByKey integration hook", () => {
+  it("returns success as the query status and the result itself after rendering the hook", async () => {
+    const { result, waitFor } = renderHook(() => sut({ uiSettingKey }), { wrapper: Messaging });
+
+    await waitFor(() => {
+      const [projection, status] = result.current;
+
+      expect(projection).toStrictEqual(uiSettingProjection);
+      expect(status).toBe("success");
+    });
+  });
+});

package/src/infrastructure/projection/react/useViewUiSettingByKey.ts

@@ -0,0 +1,18 @@
+import { useQuery, UseQueryFunctionResult } from "@lookiero/messaging-react";
+import { uiSettingUpdated } from "../../../domain/uiSetting/model/uiSettingUpdated";
+import { UiSettingProjection, viewUiSettingByKey } from "../../../projection/uiSetting/viewUiSettingByKey";
+
+interface UseViewUiSettingByKeyFunctionArgs {
+  readonly uiSettingKey: string;
+}
+
+interface UseViewUiSettingByKeyFunction {
+  (args: UseViewUiSettingByKeyFunctionArgs): UseQueryFunctionResult<UiSettingProjection>;
+}
+
+export const useViewUiSettingByKey: UseViewUiSettingByKeyFunction = ({ uiSettingKey }) =>
+  useQuery({
+    query: viewUiSettingByKey({ key: uiSettingKey }),
+    invalidation: (event) => event instanceof uiSettingUpdated,
+    options: { staleTime: Infinity },
+  });

package/src/infrastructure/projection/storageUiSettingByKeyView.test.ts

@@ -0,0 +1,32 @@
+import { UiSettingDto } from "../persistence/uiSettingData";
+import { storageUiSettingByKeyView as sut } from "./storageUiSettingByKeyView";
+
+const uiSettingKey = "ui_setting_key";
+const uiSetting: UiSettingDto = { id: "this-should-be-a-uuid", key: uiSettingKey, value: "ui_setting_value" };
+
+const readMock = jest.fn();
+const view = sut({ read: readMock });
+
+describe("storageUiSettingByKeyView", () => {
+  it("returns a UiSetting projection", async () => {
+    readMock.mockReturnValue(Promise.resolve(uiSetting));
+
+    const returnedUiSetting = await view({ key: uiSettingKey });
+
+    expect(returnedUiSetting).toStrictEqual(uiSetting);
+  });
+
+  it("returns undefined when ui setting key does not exist", async () => {
+    readMock.mockReturnValue(Promise.resolve(undefined));
+
+    const returnedUiSetting = await view({ key: uiSettingKey });
+
+    expect(returnedUiSetting).toBeUndefined();
+  });
+
+  it("throws for an unsuccessfull response", async () => {
+    readMock.mockRejectedValue("error");
+
+    await expect(view({ key: uiSettingKey })).rejects.toThrow();
+  });
+});