@evenicanpm/storefront-core 1.0.0-alpha

package/src/auth/providers/authentik-provider.ts

@@ -0,0 +1,24 @@
+import AuthentikProvider from "next-auth/providers/authentik";
+
+const clientId = "DRWJuuA4HEWyhSAsDjTgUHrsDo7CmeUa1p5UVN2e";
+const clientSecret =
+  "4PyTnKqbO6fzDngGrLkD9YiFTxXASsJH7WPoMBeFCpezfrooZE3j2FCnWYXfO5ioFm8Uwx95kHspXsNRjl9S3uq7CBZcJUpbFfXywDMEGqrxXKT4biEuiihOTHL65qOY";
+const issuer =
+  "https://authentik-server.orangeocean-cbcb289b.eastus.azurecontainerapps.io/application/o/sandboxauthapp";
+const wellKnown =
+  "https://authentik-server.orangeocean-cbcb289b.eastus.azurecontainerapps.io/application/o/sandboxauthapp/.well-known/openid-configuration";
+const authentikProvider = AuthentikProvider({
+  clientId,
+  clientSecret,
+  issuer,
+  id: "Authentik",
+  name: "Authentik",
+  wellKnown: wellKnown,
+  authorization: {
+    params: {
+      scope: "openid email profile offline_access",
+    },
+  },
+});
+
+export default authentikProvider;

package/src/auth/providers/index.ts

@@ -0,0 +1,9 @@
+import azureADB2CProvider from "./aadb2c-provider";
+import authentikProvider from "./authentik-provider";
+import keycloakProvider from "./keycloak-provider";
+
+export const getProviders = () => {
+  const azureProvider = azureADB2CProvider();
+  // once we stop hard coding others use loader function here
+  return [authentikProvider, azureProvider, keycloakProvider];
+};

package/src/auth/providers/keycloak-provider.ts

@@ -0,0 +1,22 @@
+import KeycloakProvider from "next-auth/providers/keycloak";
+
+const clientid = "b6229a60-b0de-4f86-9891-e0b58d756e39";
+const issuer =
+  "https://keycloak-app-g9dmfkf6atdqdrcn.eastus2-01.azurewebsites.net/realms/e4headless";
+const wellKnown =
+  "https://keycloak-app-g9dmfkf6atdqdrcn.eastus2-01.azurewebsites.net/realms/e4headless/.well-known/openid-configuration";
+const keycloakProvider = KeycloakProvider({
+  clientId: clientid,
+  clientSecret: "",
+  issuer: issuer,
+  id: "Keycloak",
+  name: "Keycloak",
+  wellKnown: wellKnown,
+  authorization: {
+    params: {
+      scope: "openid email profile offline_access",
+    },
+  },
+});
+
+export default keycloakProvider;

package/src/auth/refresh-token-url-keys.ts

@@ -0,0 +1,6 @@
+export const TokenRefreshUrlParams = {
+  RedirectPathKey: "redirectpath",
+  RetryCountKey: "r",
+  RoutePathName: "/api/refresh-token",
+} as const;
+export type TokenRefreshUrlParams = typeof TokenRefreshUrlParams;

package/src/auth/refresh-token.ts

@@ -0,0 +1,134 @@
+"use server";
+import { JWT } from "next-auth/jwt";
+// TODO: what is going on here?
+import { AuthorizationEndpointHandler, OAuthConfig } from "next-auth/providers";
+import jwt from "jsonwebtoken";
+import { ExtendedJwtToken } from "./auth-options";
+import { getProviders } from "./providers";
+
+type TokenResponse = {
+  token: ExtendedJwtToken;
+  isRefreshed: boolean;
+};
+
+const checkAccessTokenExpiry = async (
+  token: ExtendedJwtToken,
+): Promise<TokenResponse> => {
+  const providers = getProviders();
+  const decryptedToken = jwt.decode(token?.accessToken ?? "") as jwt.JwtPayload;
+  if (!decryptedToken) {
+    token.error = "Token Invalid";
+    return { token, isRefreshed: false };
+  }
+  // console.log('Token Expires:', new Date(decryptedToken.exp! * 1000).toLocaleString());
+  // console.log('Time now', new Date(Date.now()).toLocaleString());
+  if (!decryptedToken.exp) {
+    token.error = "noExpiryOnToken";
+    return {
+      token,
+      isRefreshed: false,
+    };
+  }
+  const expiry = decryptedToken.exp * 1000;
+  const nowMinusBuffer = 5 * 60 * 1000; // 5 minutes
+  // Check if token is expired or will expire in 5 minutes
+  // return token if access Token is not expired yet
+  if (Date.now() < expiry - nowMinusBuffer) {
+    return {
+      token,
+      isRefreshed: false,
+    };
+  }
+
+  const refreshTokenExpiry = token.exp * 1000;
+
+  // Avoid making request for access token if refresh token is expired.
+  if (Date.now() >= refreshTokenExpiry) {
+    token.error = "RefreshTokenExpired";
+    return {
+      token,
+      isRefreshed: false,
+    };
+  }
+
+  //Find the provider that matches the provider cookie
+  const matchedProvider = providers.find(
+    (p) => p.id.toLowerCase() === token.provider.toLowerCase(),
+  ) as OAuthConfig<Record<string, unknown>> | undefined;
+  if (!matchedProvider) {
+    token.error = "NoProviderMatch";
+    return {
+      token,
+      isRefreshed: false,
+    };
+  }
+
+  const wellKnown = matchedProvider.wellKnown;
+  const clientId = matchedProvider.options?.clientId;
+  const scope = (
+    matchedProvider.options?.authorization as AuthorizationEndpointHandler
+  )?.params?.scope;
+
+  if (!wellKnown || !clientId || !scope) {
+    return {
+      token: { ...token, error: "MissingProviderInfo" },
+      isRefreshed: false,
+    };
+  }
+
+  const newToken = await refreshAccessToken(token, wellKnown, clientId, scope);
+
+  return {
+    token: newToken as ExtendedJwtToken,
+    isRefreshed: !newToken.error,
+  };
+};
+
+const refreshAccessToken = async (
+  token: JWT,
+  wellKnown: string,
+  clientId: string,
+  scope: string,
+) => {
+  if (!token.refreshToken) {
+    return { ...token, error: "NoRefreshToken" };
+  }
+
+  const refreshUrl = await getTokenEndpoint(wellKnown);
+  try {
+    const response = await fetch(refreshUrl, {
+      method: "POST",
+      headers: { "Content-Type": "application/x-www-form-urlencoded" },
+      body: new URLSearchParams({
+        client_id: clientId,
+        grant_type: "refresh_token",
+        refresh_token: token.refreshToken,
+        scope: scope,
+      }),
+    });
+    const refreshedTokens = await response.json();
+    if (!response.ok) {
+      throw new Error(refreshedTokens.error_description);
+    }
+    return {
+      ...token,
+      accessToken: refreshedTokens.access_token,
+      refreshToken: refreshedTokens.refresh_token,
+    };
+  } catch (error) {
+    console.error("Error refreshing web token:", error);
+    return { ...token, error: "RefreshAccessTokenError" };
+  }
+};
+
+const getTokenEndpoint = async (wellKnown: string) => {
+  const json = await getWellKnownData(wellKnown);
+  return json.token_endpoint;
+};
+
+const getWellKnownData = async (wellKnown: string) => {
+  const data = await fetch(wellKnown);
+  return data.json();
+};
+
+export default checkAccessTokenExpiry;

package/src/auth/signout.ts

@@ -0,0 +1,46 @@
+const fetchCsrfToken = async (): Promise<string> => {
+  try {
+    const response = await fetch("/api/auth/csrf");
+    if (!response.ok) {
+      throw new Error(`Failed to fetch CSRF token: ${response.statusText}`);
+    }
+    const data: { csrfToken: string } = await response.json();
+    return data.csrfToken;
+  } catch (error) {
+    console.error("Error fetching CSRF token:", error);
+    throw error;
+  }
+};
+
+/**
+ *  Alternative to signOut from "next-auth/react" - https://github.com/nextauthjs/next-auth/blob/main/packages/next-auth/src/react.tsx
+ *  Solution to known next-auth issue - https://github.com/nextauthjs/next-auth/issues/4612
+ */
+const signOut = async (): Promise<void> => {
+  try {
+    const csrfToken = await fetchCsrfToken();
+
+    const formData = new URLSearchParams({
+      csrfToken,
+      json: "true",
+    });
+
+    const response = await fetch("/api/auth/signout", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/x-www-form-urlencoded",
+      },
+      body: formData,
+    });
+
+    if (!response.ok) {
+      throw new Error(`Failed to sign out: ${response.statusText}`);
+    }
+
+    window.location.href = "/";
+  } catch (error) {
+    console.error(error);
+  }
+};
+
+export default signOut;

package/src/auth/types/next-auth.d.ts

@@ -0,0 +1,38 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import type { NextAuthOptions } from "next-auth";
+
+declare module "next-auth" {
+  /**
+   * Returned by `useSession`, `getSession` and received as a prop on the `SessionProvider` React Context
+   */
+  interface Session {
+    error?: string;
+    accessToken?: string;
+  }
+}
+
+declare module "next-auth/jwt" {
+  interface JWT {
+    accessToken?: string;
+    accessTokenExpiresAt: number;
+    refreshToken?: string;
+    refreshTokenExpiresAt: number;
+    error?: string;
+  }
+}
+
+/**
+ * Usually contains information about the provider being used
+ * and also extends `TokenSet`, which is different tokens returned by OAuth Providers.
+ */
+declare module "next-auth/providers/azure-ad-b2c" {
+  interface Account {
+    access_token: string;
+    expires_on: number;
+    refresh_token: string;
+    refresh_token_expires_in: number;
+  }
+
+  /** The OAuth profile returned from your provider */
+  // interface Profile {}
+}

package/src/cms/blog.ts

@@ -0,0 +1,229 @@
+import cms from "./endpoints";
+import { type BlocksContent } from "@strapi/blocks-react-renderer";
+import { Formats } from "./interfaces/productData";
+
+export interface Blogs {
+  data: Array<{
+    id: number;
+    title: string;
+    content: BlocksContent;
+    image: {
+      id: number;
+      url: string;
+      alternativeText: string;
+      caption: string;
+      formats: {
+        large: {
+          url: string;
+        };
+        thumbnail: {
+          url: string;
+        };
+      };
+    };
+    createdAt: string;
+    updatedAt: string;
+    publishedAt: string;
+  }>;
+  meta: {
+    pagination: {
+      page: number;
+      pageSize: number;
+      pageCount: number;
+      total: number;
+    };
+  };
+}
+
+export interface TransformedBlogs {
+  __typename: string;
+  recordCount: number;
+  pageInfo: {
+    __typename: string;
+    top: number;
+    skip: number;
+    sort: string;
+    sortDesc: boolean;
+    search: string;
+  };
+  nodes: Array<{
+    __typename: string;
+    id: string;
+    title: string;
+    content: BlocksContent;
+    image: {
+      id: number;
+      url: string;
+      alternativeText: string;
+      caption: string;
+      formats: {
+        large: {
+          url: string;
+        };
+        thumbnail: {
+          url: string;
+        };
+      };
+    };
+    modified: string;
+    modifiedBy: null;
+    created: string;
+  }>;
+}
+
+export const transformBlogs = (strapiResponse: Blogs): TransformedBlogs => {
+  const { data, meta } = strapiResponse;
+
+  const nodes = data.map((item) => ({
+    __typename: "Blog",
+    id: item.id.toString(),
+    title: item.title,
+    content: item.content,
+    image: {
+      id: item.image.id,
+      url: item.image.url,
+      alternativeText: item.image.alternativeText,
+      caption: item.image.caption,
+      formats: item.image.formats,
+    },
+    modified: item.updatedAt,
+    modifiedBy: null,
+    created: item.createdAt,
+  }));
+
+  return {
+    __typename: "BlogConnection",
+    recordCount: meta.pagination.total,
+    pageInfo: {
+      __typename: "PageInfo",
+      top: 50,
+      skip: 0,
+      sort: "modified",
+      sortDesc: false,
+      search: "",
+    },
+    nodes: nodes,
+  };
+};
+
+export interface Blog {
+  data: {
+    id: number;
+    title: string;
+    content: BlocksContent;
+    image: {
+      id: number;
+      url: string;
+      alternativeText: string;
+      caption: string;
+      formats: {
+        large: {
+          url: string;
+        };
+        thumbnail: {
+          url: string;
+        };
+      };
+    };
+    createdAt: string;
+    updatedAt: string;
+    publishedAt: string;
+  };
+  meta: {
+    pagination: {
+      total: number;
+    };
+  };
+}
+
+export interface TransformedBlog {
+  __typename: string;
+  recordCount: number;
+  pageInfo: {
+    __typename: string;
+    top: number;
+    skip: number;
+    sort: string;
+    sortDesc: boolean;
+    search: string;
+  };
+  id: string;
+  title: string;
+  content: BlocksContent;
+  image: {
+    id: number;
+    url: string;
+    alternativeText: string;
+    caption: string;
+    formats: {
+      large: {
+        url: string;
+      };
+      thumbnail: {
+        url: string;
+      };
+    };
+  };
+  created: string;
+}
+
+export const transformBlog = (response: Blog): TransformedBlog => {
+  const { data, meta } = response;
+  return {
+    __typename: "Blog",
+    recordCount: meta.pagination.total,
+    pageInfo: {
+      __typename: "PageInfo",
+      top: 50,
+      skip: 0,
+      sort: "modified",
+      sortDesc: false,
+      search: "",
+    },
+    id: data.id.toString(),
+    title: data.title,
+    content: data.content,
+    image: {
+      id: data.image.id,
+      url: data.image.url,
+      alternativeText: data.image.alternativeText,
+      caption: data.image.caption,
+      formats: data.image.formats,
+    },
+    created: data.createdAt,
+  };
+};
+
+export interface BlogData {
+  title: string;
+  id: number;
+  content: BlocksContent;
+  image: {
+    id: number;
+    url: string;
+    alternativeText: string;
+    caption: string;
+    formats: Formats;
+  };
+}
+
+export const createBlog = async (blogData: BlogData) => {
+  try {
+    const response = await fetch(cms.getCmsApiUrl("blogs"), {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        data: blogData,
+      }),
+    });
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! Status: ${response.status}`);
+    }
+
+    return await response.json();
+  } catch (error) {
+    console.error("Error creating blog:", error);
+    throw error;
+  }
+};

package/src/cms/endpoints.ts

@@ -0,0 +1,76 @@
+import { Formats } from "./interfaces/productData";
+import { getConfig } from "@config";
+
+const apiKeys = {
+  pages: "/cms/pages",
+  blogs: "/cms/blogs",
+  home: "/cms/home",
+  productData: "/api/product-data-items",
+  navigation: "/cms/navlinks",
+  products: "/cms/products",
+  footer: "/cms/footer",
+  pagePreview: "/cms/pages/preview",
+} as const;
+
+// to provide auto-completion of keys when calling getCmsApiUrl
+type ApiKeysType = typeof apiKeys;
+type ApiKey = keyof ApiKeysType;
+
+const getCmsApiUrl = (apiKey: ApiKey) => {
+  const cmsApiEndpoint = getConfig().E4_API_ENDPOINT;
+  return `${cmsApiEndpoint}${apiKeys[apiKey]}`;
+};
+
+const buildCmsMediaUrl = (mediaUrl: string) => {
+  const cmsEndpoint = getConfig().CMS_ENDPOINT;
+
+  if (mediaUrl === undefined || mediaUrl === null) {
+    return "";
+  }
+  //full URL is provided when using azure storage provider in cms
+  if (/(http(s?)):\/\//i.test(mediaUrl)) {
+    return mediaUrl;
+  }
+  return `${cmsEndpoint}${mediaUrl}`;
+};
+
+// Allow extension of the cmsEndPoints object
+export const extendCmsEndpoints = (
+  customConfig: Partial<typeof cmsEndPoints>,
+) => {
+  Object.assign(cmsEndPoints, customConfig);
+};
+
+export type sizes = "small" | "medium" | "large" | "thumbnail";
+
+/**
+ * @param formats formats array from CMS data
+ * @param size size of the image
+ * @returns largest available image url
+ */
+export const getImageUrl = (formats: Formats, size?: sizes) => {
+  if (size) {
+    return buildCmsMediaUrl(formats[size]?.url ?? "");
+  }
+
+  if (formats?.large?.url) {
+    return cmsEndPoints.buildCmsMediaUrl(formats.large.url);
+  } else if (formats?.medium?.url) {
+    return cmsEndPoints.buildCmsMediaUrl(formats.medium.url);
+  } else if (formats?.small?.url) {
+    return cmsEndPoints.buildCmsMediaUrl(formats.small.url);
+  } else if (formats?.thumbnail?.url) {
+    return cmsEndPoints.buildCmsMediaUrl(formats.thumbnail.url);
+  }
+  return "";
+};
+
+const cmsEndPoints = {
+  // Storefront
+  apiKeys,
+  getCmsApiUrl,
+  buildCmsMediaUrl,
+  getImageUrl,
+};
+
+export default cmsEndPoints;

package/src/cms/interfaces/navigation.ts

@@ -0,0 +1,52 @@
+// cms internal interfaces
+export interface CmsNavigation {
+  nodes: {
+    name: string;
+    id: number;
+    items: (CmsPage | CmsSubMenu)[];
+  }[];
+}
+
+export interface CmsPage {
+  type: string;
+  id: number;
+  name: string;
+  slug: string;
+}
+
+export interface CmsSubMenu {
+  type: string;
+  name: string;
+  pages: CmsPage[];
+}
+
+export interface CmsNavRelated {
+  id: number;
+  title: string;
+  slug: string;
+  createdAt: string;
+  updatedAt: string;
+  publishedAt?: string | null;
+
+  /** Optional content‑type hint Strapi adds when `populate=*` */
+  __contentType?: string;
+
+  /**
+   * Any other attributes your model exposes (e.g., SEO fields,
+   * coverImage, etc.). Keep this open so the type stays valid
+   * if the Strapi model grows.
+   */
+  [key: string]: unknown;
+}
+
+export interface CmsNavItem {
+  title: string;
+  menuAttached: boolean;
+  path: string;
+  type: "INTERNAL" | "EXTERNAL";
+  uiRouterKey: string;
+  slug: string;
+  related: CmsNavRelated | null;
+  external: boolean;
+  items: CmsNavItem[];
+}