Abstract checkout items to their own scope

.bitmap

@@ -16,19 +16,99 @@
         "mainFile": "index.ts",
         "rootDir": "ecommerce/blocks/page-header"
     },
+    "checkout-action-item": {
+        "name": "checkout-action-item",
+        "scope": "",
+        "version": "",
+        "defaultScope": "bit-nimble.checkout",
+        "mainFile": "index.ts",
+        "rootDir": "checkout/checkout-action-item",
+        "config": {
+            "bit-nimble.design/envs/mui-env@0.0.1": {},
+            "teambit.envs/envs": {
+                "env": "bit-nimble.design/envs/mui-env"
+            },
+            "teambit.dependencies/dependency-resolver": {
+                "policy": {
+                    "devDependencies": {
+                        "@types/testing-library__jest-dom": "^5.14.9"
+                    }
+                }
+            },
+            "teambit.component/dev-files": {},
+            "teambit.preview/preview": {},
+            "teambit.compositions/compositions": {},
+            "teambit.docs/docs": {},
+            "teambit.pipelines/builder": {},
+            "teambit.harmony/application": {},
+            "teambit.component/renaming": {
+                "renamedFrom": {
+                    "scope": "bit-nimble.ecommerce",
+                    "name": "checkout/checkout-action-item",
+                    "version": "0.0.6"
+                }
+            }
+        }
+    },
+    "checkout-nav-menu-content": {
+        "name": "checkout-nav-menu-content",
+        "scope": "",
+        "version": "",
+        "defaultScope": "bit-nimble.checkout",
+        "mainFile": "index.ts",
+        "rootDir": "checkout/checkout-nav-menu-content",
+        "config": {
+            "bit-nimble.design/envs/mui-env@0.0.1": {},
+            "teambit.envs/envs": {
+                "env": "bit-nimble.design/envs/mui-env"
+            },
+            "teambit.dependencies/dependency-resolver": {},
+            "teambit.component/dev-files": {},
+            "teambit.preview/preview": {},
+            "teambit.compositions/compositions": {},
+            "teambit.docs/docs": {},
+            "teambit.pipelines/builder": {},
+            "teambit.harmony/application": {},
+            "teambit.component/renaming": {
+                "renamedFrom": {
+                    "scope": "bit-nimble.ecommerce",
+                    "name": "checkout/checkout-nav-menu-content",
+                    "version": "0.0.1"
+                }
+            }
+        }
+    },
     "checkout/checkout-action-item": {
         "name": "checkout/checkout-action-item",
         "scope": "bit-nimble.ecommerce",
         "version": "0.0.6",
         "mainFile": "index.ts",
-        "rootDir": "ecommerce/checkout/checkout-action-item"
+        "rootDir": "ecommerce/checkout/checkout-action-item",
+        "config": {
+            "teambit.component/deprecation": {
+                "deprecate": true,
+                "newId": {
+                    "name": "checkout-action-item",
+                    "scope": "bit-nimble.checkout"
+                }
+            }
+        }
     },
     "checkout/checkout-nav-menu-content": {
         "name": "checkout/checkout-nav-menu-content",
         "scope": "bit-nimble.ecommerce",
         "version": "0.0.1",
         "mainFile": "index.ts",
-        "rootDir": "ecommerce/checkout/checkout-nav-menu-content"
+        "rootDir": "ecommerce/checkout/checkout-nav-menu-content",
+        "config": {
+            "teambit.component/deprecation": {
+                "deprecate": true,
+                "newId": {
+                    "name": "checkout-nav-menu-content",
+                    "scope": "bit-nimble.checkout"
+                }
+            }
+        }
     },
     "envs/mui-env": {
         "name": "envs/mui-env",

.github/workflow/pull-request.yml → .github/workflows/pull-request.yml

@@ -13,11 +13,11 @@ jobs:
       GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
       GIT_USER_NAME: ${{ secrets.GIT_USER_NAME }}
       GIT_USER_EMAIL: ${{ secrets.GIT_USER_EMAIL }}
-      BIT_CONFIG_USER_TOKEN: ${{ secrets.BIT_CONFIG_USER_TOKEN }}
+      BIT_CONFIG_USER_TOKEN: ${{ secrets.BIT_CLOUD_ACCESS_TOKEN }}
     steps:
       - name: Checkout repository
         uses: actions/checkout@v3
       - name: Initialize Bit
-        uses: bit-tasks/init@v1 
+        uses: bit-tasks/init@v1
       - name: Bit Pull Request
         uses: bit-tasks/pull-request@v1

checkout/checkout-action-item/checkout-action-item.tsx

@@ -0,0 +1,9 @@
+import { PageHeaderMenuItemObject } from '@bit-nimble/design.page-header-menu-item';
+import { CheckoutNavMenuContent } from '@bit-nimble/checkout.checkout-nav-menu-content';
+
+export const checkoutActionItem: PageHeaderMenuItemObject = {
+  id: 'checkout',
+  title: 'Checkout',
+  icon: '🛒',
+  menuContent: <CheckoutNavMenuContent />,
+};

checkout/checkout-action-item/index.ts

@@ -0,0 +1 @@
+export { checkoutActionItem } from './checkout-action-item';

checkout/checkout-nav-menu-content/checkout-nav-menu-content.composition.tsx

@@ -0,0 +1,6 @@
+import React from 'react';
+import { CheckoutNavMenuContent } from './checkout-nav-menu-content';
+
+export const BasicCheckoutNavMenuContent = () => {
+  return <CheckoutNavMenuContent />;
+};

checkout/checkout-nav-menu-content/checkout-nav-menu-content.docs.mdx

@@ -0,0 +1,16 @@
+---
+description: A CheckoutNavMenuContent component.
+---
+
+import { CheckoutNavMenuContent } from './checkout-nav-menu-content';
+
+### Component usage
+```js
+<CheckoutNavMenuContent>Hello world!</CheckoutNavMenuContent>
+```
+
+### Render hello world!
+
+```js live
+<CheckoutNavMenuContent>Hello world!</CheckoutNavMenuContent>
+```

checkout/checkout-nav-menu-content/checkout-nav-menu-content.spec.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { BasicCheckoutNavMenuContent } from './checkout-nav-menu-content.composition';
+
+it('renders with the correct text', () => {
+  const { getByText } = render(<BasicCheckoutNavMenuContent />);
+  const rendered = getByText('Add some products!');
+  expect(rendered).toBeTruthy();
+});

checkout/checkout-nav-menu-content/checkout-nav-menu-content.tsx

@@ -0,0 +1,36 @@
+import { Box, Typography } from '@mui/material';
+
+export type CheckoutNavMenuContentProps = {};
+
+export function CheckoutNavMenuContent() {
+  const cartItems = []; // Simulate cart items
+
+  return (
+    <Box>
+      {cartItems.length === 0 ? (
+        <Box
+          sx={{
+            p: 2,
+            textAlign: 'center',
+          }}
+        >
+          <Typography variant="subtitle1" component="div">
+            Your cart is empty
+          </Typography>
+          <Typography
+            variant="body2"
+            component="div"
+            sx={{
+              pt: 2,
+            }}
+          >
+            <span role="img" aria-label="Cart">
+              🛒
+            </span>{' '}
+            Add some products!
+          </Typography>
+        </Box>
+      ) : null}
+    </Box>
+  );
+}

checkout/checkout-nav-menu-content/index.ts

@@ -0,0 +1,2 @@
+export { CheckoutNavMenuContent } from './checkout-nav-menu-content';
+export type { CheckoutNavMenuContentProps } from './checkout-nav-menu-content';

ecommerce/shop-web/shop-web.tsx

@@ -4,7 +4,7 @@ import { Box, CssBaseline, GlobalStyles, MenuItem } from '@mui/material';
 import { PageHeader } from '@bit-nimble/ecommerce.blocks.page-header';
 import { NimbleProvider } from '@bit-nimble/design.themes.nimble';
 import { supportActionItem } from '@bit-nimble/support.header-action-item';
-import { checkoutActionItem } from '@bit-nimble/ecommerce.checkout.checkout-action-item';
+import { checkoutActionItem } from '@bit-nimble/checkout.checkout-action-item';
 import { createEmotionCache } from './emotion-cache.js';
 
 export function SupportNavMenuContent() {