@kaena1/ecomm-contained-utils 1.0.3 → 1.0.4

package/README.md

@@ -25,14 +25,19 @@ packages/ecomm-contained-utils/
 │   │   └── RemoteRenderer.tsx      # Renders remote components ('use client')
 │   ├── hooks/               # React hooks
 │   │   └── useRemoteComponent.ts   # Hook for loading remote components ('use client')
+│   ├── lib/                 # Business logic
+│   │   ├── api/server/            # Server-side API functions
+│   │   │   └── getMintLayoutProps/ # Fetches MintLayout props from ecomm API
+│   │   └── mappers/               # Data mappers
+│   │       └── mapMintLayoutResponseToProps.ts
 │   ├── services/            # Core services
 │   │   ├── fetchManifest.ts        # Fetches component manifests
 │   │   ├── ImportMapService.ts     # Generates import map JSON
 │   │   └── moduleLoader.ts         # ES module loader service
 │   ├── types/               # TypeScript definitions
-│   ├── index.ts             # Main entry point (exports everything)
 │   ├── server.ts            # Server-safe exports for App Router
-│   └── client.ts            # Client-only exports for App Router
+│   ├── client.ts            # Client-only exports for App Router
+│   └── types.ts             # Type-only exports entry point
 ├── dist/                    # Built files (generated)
 ├── vite.config.ts          # Build configuration
 ├── package.json
@@ -44,16 +49,18 @@ packages/ecomm-contained-utils/
 
 The package provides three entry points for different use cases:
 
-| Entry Point | Import Path | Use Case |
-|-------------|-------------|----------|
-| Main | `ecomm-contained-utils` | Everything (Pages Router, or when you need all exports) |
-| Server | `ecomm-contained-utils/server` | Server Components (App Router RSC) |
-| Client | `ecomm-contained-utils/client` | Client Components (App Router) |
+| Entry Point | Import Path                            | Use Case                                             |
+| ----------- | -------------------------------------- | ---------------------------------------------------- |
+| Server      | `@kaena1/ecomm-contained-utils/server` | Server Components (App Router RSC, Pages Router SSR) |
+| Client      | `@kaena1/ecomm-contained-utils/client` | Client Components (App Router, Pages Router CSR)     |
+| Types       | `@kaena1/ecomm-contained-utils/types`  | Type-only imports                                    |
 
-**Server exports:** `fetchManifest`, `ImportMapScripts`, `RemoteLinks`, `generateImportMap`, `generateImportMapJson`, all types
+**Server exports:** `fetchManifest`, `getRemoteManifest`, `ImportMapScripts`, `RemoteLinks`, `generateImportMap`, `generateImportMapJson`, `getMintLayoutProps`, `mapMintLayoutResponseToProps`
 
 **Client exports:** `RemoteRenderer`, `useRemoteComponent`, `moduleLoader`, `ModuleLoader`
 
+**Types exports:** `ComponentManifest`, `RemoteManifest`, `MintLayoutProps`, `MintLayoutPropsAPIResponse`, WP REST API types
+
 ## Installation
 
 ### In Consumer Applications (e.g., mm-mf-features)
@@ -63,17 +70,17 @@ The package provides three entry points for different use cases:
 Always get the latest version from the POC branch:
 
 ```bash
-npm install ecomm-contained-utils@f-poc-EC-3301
+npm install @kaena1/ecomm-contained-utils@f-poc-EC-3570
 ```
 
-This installs the latest version tagged with `f-poc-EC-3301`. You don't need to track specific version numbers.
+This installs the latest version tagged with `f-poc-EC-3570`. You don't need to track specific version numbers.
 
 #### Option 2: Install Specific Version
 
 If you need a specific version:
 
 ```bash
-npm install ecomm-contained-utils@1.25.0-f-poc-EC-3301.5
+npm install @kaena1/ecomm-contained-utils@1.0.3
 ```
 
 #### Updating to Latest
@@ -82,10 +89,10 @@ To update to the latest POC version:
 
 ```bash
 # Update and save to package.json
-npm install ecomm-contained-utils@f-poc-EC-3301 --save
+npm install @kaena1/ecomm-contained-utils@f-poc-EC-3570 --save
 
 # Or use npm update (if version is already in package.json with the tag)
-npm update ecomm-contained-utils
+npm update @kaena1/ecomm-contained-utils
 ```
 
 #### For Local Development
@@ -99,10 +106,10 @@ Due to React's requirement of a single instance, `npm link` causes "Invalid hook
 cd packages/ecomm-contained-utils
 npm run build
 npm pack
-# This generates: ecomm-contained-utils-X.X.X.tgz
+# This generates: kaena1-ecomm-contained-utils-X.X.X.tgz
 
 # In the consumer application (mm-mf-features)
-npm install /absolute/path/to/ecomm-contained-utils-X.X.X.tgz
+npm install /absolute/path/to/kaena1-ecomm-contained-utils-X.X.X.tgz
 ```
 
 ## Usage
@@ -117,7 +124,7 @@ The setup differs slightly between Next.js Pages Router and App Router.
 
 ```typescript
 import { Html, Head, Main, NextScript } from 'next/document';
-import { ImportMapScripts } from 'ecomm-contained-utils';
+import { ImportMapScripts } from '@kaena1/ecomm-contained-utils/server';
 
 export default function Document() {
   return (
@@ -139,18 +146,13 @@ export default function Document() {
 
 ```typescript
 import type { AppProps, AppContext } from 'next/app';
-import {
-  RemoteRenderer,
-  RemoteLinks,
-  fetchManifest,
-} from 'ecomm-contained-utils';
+import { RemoteLinks, getRemoteManifest } from '@kaena1/ecomm-contained-utils/server';
+import { RemoteRenderer } from '@kaena1/ecomm-contained-utils/client';
 
 App.getInitialProps = async (ctx: AppContext) => {
-  const manifestUrl = `https://assets-qa.mintmobile.com/contained-components/manifest-poc/f-poc-live-update/manifest.json?_ts=${Date.now()}`;
-
   let remoteManifest;
   try {
-    remoteManifest = await fetchManifest(manifestUrl);
+    remoteManifest = await getRemoteManifest(process.env.MANIFEST_URL);
   } catch (e) {
     console.error('Failed to fetch manifest:', e);
     remoteManifest = null;
@@ -200,8 +202,10 @@ export default function App({ Component, pageProps }: AppProps) {
 #### App Router Setup
 
 > **Note:** App Router is fully supported. The package provides separate entry points for server and client code:
-> - `ecomm-contained-utils/server` - Server-safe exports (fetchManifest, ImportMapScripts, RemoteLinks, types)
-> - `ecomm-contained-utils/client` - Client-only exports (RemoteRenderer, useRemoteComponent, moduleLoader)
+>
+> - `@kaena1/ecomm-contained-utils/server` - Server-safe exports (fetchManifest, getRemoteManifest, ImportMapScripts, RemoteLinks, getMintLayoutProps, mapMintLayoutResponseToProps)
+> - `@kaena1/ecomm-contained-utils/client` - Client-only exports (RemoteRenderer, useRemoteComponent, moduleLoader)
+> - `@kaena1/ecomm-contained-utils/types` - Type-only exports
 
 ##### Add Import Map Scripts to `app/layout.tsx`
 
@@ -210,29 +214,18 @@ export default function App({ Component, pageProps }: AppProps) {
 import {
   ImportMapScripts,
   RemoteLinks,
-  fetchManifest
-} from 'ecomm-contained-utils/server';
+  getRemoteManifest,
+} from '@kaena1/ecomm-contained-utils/server';
 
 // Use /client for client components (in separate 'use client' files)
-// import { RemoteRenderer } from 'ecomm-contained-utils/client';
-
-// Fetch manifest at build time
-async function getRemoteManifest() {
-  try {
-    const manifestUrl = `https://assets-qa.mintmobile.com/contained-components/manifest-poc/f-poc-live-update/manifest.json?_ts=${Date.now()}`;
-    return await fetchManifest(manifestUrl);
-  } catch (e) {
-    console.error('Failed to fetch manifest:', e);
-    return null;
-  }
-}
+// import { RemoteRenderer } from '@kaena1/ecomm-contained-utils/client';
 
 export default async function RootLayout({
   children,
 }: {
   children: React.ReactNode;
 }) {
-  const remoteManifest = await getRemoteManifest();
+  const remoteManifest = await getRemoteManifest(process.env.MANIFEST_URL);
   const layoutManifest = remoteManifest?.components?.MintLayout;
 
   return (
@@ -268,7 +261,7 @@ export default async function RootLayout({
 ### 2. Using Remote Components in Pages
 
 ```typescript
-import { RemoteRenderer } from 'ecomm-contained-utils';
+import { RemoteRenderer } from '@kaena1/ecomm-contained-utils/client';
 
 export default function MyPage({ remoteManifest }) {
   const pocComponentManifest = remoteManifest?.components?.PocComponent;
@@ -433,6 +426,65 @@ const manifest = await fetchManifest(
 
 ---
 
+#### `getRemoteManifest(manifestUrl): Promise<RemoteManifest>`
+
+Server-side function that fetches the remote component manifest. Encapsulates URL construction (cache-busting timestamp) and the fetch call.
+
+**Parameters:**
+
+- `manifestUrl`: `string` - Base URL to the manifest JSON file (without query params)
+
+**Returns:** `Promise<RemoteManifest>`
+
+**Usage:**
+
+```typescript
+import { getRemoteManifest } from '@kaena1/ecomm-contained-utils/server';
+
+const remoteManifest = await getRemoteManifest(process.env.MANIFEST_URL);
+```
+
+---
+
+#### `getMintLayoutProps(NEXT_PUBLIC_SITE_URL, ECOMM_API_URL, ECOMM_API_STANDALONE_DEVICE_CREDS): Promise<MintLayoutProps>`
+
+Server-side function that fetches MintLayout props from the ecomm API and maps them to the expected format.
+
+**Parameters:**
+
+- `NEXT_PUBLIC_SITE_URL`: `string` - The public site URL
+- `ECOMM_API_URL`: `string` - The ecomm API base URL
+- `ECOMM_API_STANDALONE_DEVICE_CREDS`: `string` - Credentials in `username|password` format
+
+**Returns:** `Promise<MintLayoutProps>`
+
+**Usage:**
+
+```typescript
+import { getMintLayoutProps } from '@kaena1/ecomm-contained-utils/server';
+
+const mintLayoutProps = await getMintLayoutProps(
+  process.env.NEXT_PUBLIC_SITE_URL,
+  process.env.ECOMM_API_URL,
+  process.env.ECOMM_API_STANDALONE_DEVICE_CREDS,
+);
+```
+
+---
+
+#### `mapMintLayoutResponseToProps(NEXT_PUBLIC_SITE_URL, data): MintLayoutProps`
+
+Maps the raw API response to `MintLayoutProps` format. Used internally by `getMintLayoutProps`, but exported for custom usage.
+
+**Parameters:**
+
+- `NEXT_PUBLIC_SITE_URL`: `string` - The public site URL
+- `data`: `MintLayoutPropsAPIResponse` - Raw API response
+
+**Returns:** `MintLayoutProps`
+
+---
+
 ## Build & Development
 
 ### Build the Package
@@ -470,7 +522,7 @@ npm run lint
 
    ```json
    {
-     "version": "1.25.0-f-poc-EC-3301.5"
+     "version": "1.0.3"
    }
    ```
 
@@ -483,17 +535,17 @@ npm run lint
 3. **Publish to npm:**
 
    ```bash
-   npm publish --tag f-poc-live-update
+   npm publish --tag f-poc-EC-3570 --access public
    ```
 
 4. **Install in consumer apps:**
 
    ```bash
    # Specific version
-   npm install ecomm-contained-utils@1.25.0-f-poc-EC-3301.5
+   npm install @kaena1/ecomm-contained-utils@1.0.3
 
    # Or use the tag for latest POC version
-   npm install ecomm-contained-utils@f-poc-live-update
+   npm install @kaena1/ecomm-contained-utils@f-poc-EC-3570
    ```
 
 ### Enabling Automatic Publishing (Future)
@@ -546,12 +598,12 @@ docs: update README with usage examples
 
 #### Release Rules
 
-| Commit Type | Scope          | Release Type  |
-| ----------- | -------------- | ------------- |
+| Commit Type | Scope                   | Release Type  |
+| ----------- | ----------------------- | ------------- |
 | `feat`      | `ecomm-contained-utils` | Minor (1.x.0) |
 | `fix`       | `ecomm-contained-utils` | Patch (1.0.x) |
-| `feat`      | Any            | Minor         |
-| `fix`       | Any            | Patch         |
+| `feat`      | Any                     | Minor         |
+| `fix`       | Any                     | Patch         |
 
 ### POC Branch Strategy
 
@@ -568,8 +620,8 @@ For the POC, we use the branch pattern `f-poc-*` with a specific prerelease iden
 
 This means:
 
-- Branch `f-poc-EC-3301` → publishes as `1.25.0-f-poc-EC-3301.1`
-- Branch `f-poc-live-update` → publishes as `1.25.0-f-poc-live-update.1`
+- Branch `f-poc-EC-3570` → publishes as `1.0.3-f-poc-EC-3570.1`
+- Branch `f-poc-live-update` → publishes as `1.0.3-f-poc-live-update.1`
 
 ## How It Works
 

package/dist/lib/api/server/getRemoteManifest/getRemoteManifest.js

@@ -0,0 +1,9 @@
+"use server";
+import { fetchManifest as n } from "../../../../services/fetchManifest.js";
+async function s(t) {
+  const e = `${t}?_ts=${Date.now()}`;
+  return n(e);
+}
+export {
+  s as getRemoteManifest
+};

package/dist/server.d.ts

@@ -26,6 +26,8 @@ export declare const generateImportMapJson: (config?: ImportMapConfig) => string
 
 export declare function getMintLayoutProps(NEXT_PUBLIC_SITE_URL: string, ECOMM_API_URL: string, ECOMM_API_STANDALONE_DEVICE_CREDS: string): Promise<MintLayoutProps>;
 
+export declare function getRemoteManifest(manifestUrl: string): Promise<RemoteManifest>;
+
 declare interface ImportMapConfig {
     reactVersion?: string;
     reactDomVersion?: string;

package/dist/server.js

@@ -3,7 +3,8 @@ import { generateImportMap as p, generateImportMapJson as m } from "./services/I
 import { ImportMapScripts as f } from "./components/ImportMapScripts.js";
 import { RemoteLinks as s } from "./components/RemoteLinks.js";
 import { getMintLayoutProps as M } from "./lib/api/server/getMintLayoutProps/getMintLayoutProps.js";
-import { mapMintLayoutResponseToProps as g } from "./lib/mappers/mapMintLayoutResponseToProps.js";
+import { getRemoteManifest as g } from "./lib/api/server/getRemoteManifest/getRemoteManifest.js";
+import { mapMintLayoutResponseToProps as L } from "./lib/mappers/mapMintLayoutResponseToProps.js";
 export {
   f as ImportMapScripts,
   s as RemoteLinks,
@@ -11,5 +12,6 @@ export {
   p as generateImportMap,
   m as generateImportMapJson,
   M as getMintLayoutProps,
-  g as mapMintLayoutResponseToProps
+  g as getRemoteManifest,
+  L as mapMintLayoutResponseToProps
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kaena1/ecomm-contained-utils",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Shared utilities for loading remote React components in Mint Mobile microfrontends",
   "type": "module",
   "exports": {