Merge pull request #47 from storybookjs/update-components-marketing

Update components-marketing
storybookjs · May 16, 2024 · 28c6472 · 28c6472
2 parents 62354bc + 8d924b2
commit 28c6472
Show file tree

Hide file tree

Showing 8 changed files with 321 additions and 192 deletions.
diff --git a/components/layout/AppLayout.tsx b/components/layout/AppLayout.tsx
@@ -30,16 +30,11 @@ const Footer = styled(MarketingFooter)`
   margin-top: 80px;
 `;
 
-export const AppLayout: React.FC<AppLayoutProps> = ({
-  children,
-  pageProps: { githubStars, latestPost, latestVersion, subscriberCount, npmTag },
-}) => (
+export const AppLayout: React.FC<AppLayoutProps> = ({ children, pageProps: { githubStars, latestVersion, subscriberCount, npmTag } }) => (
   <>
     <GlobalStyles />
     <LinksContextProvider value={navLinks}>
-      {githubStars && latestPost && latestVersion && (
-        <Header githubStars={githubStars} latestPost={latestPost} latestVersion={latestVersion} pageType="status" npmTag={npmTag} />
-      )}
+      {githubStars && latestVersion && <Header githubStars={githubStars} latestVersion={latestVersion} pageType="status" npmTag={npmTag} />}
       <Main>{children}</Main>
       {subscriberCount && <Footer subscriberCount={subscriberCount} />}
     </LinksContextProvider>

diff --git a/components/layout/Header.tsx b/components/layout/Header.tsx
@@ -1,21 +1,16 @@
 import * as React from 'react';
-import { Eyebrow, Nav } from '@storybook/components-marketing';
+import { Nav } from '@storybook/components-marketing';
 import { styles } from '@storybook/design-system';
 import { styled } from '@storybook/theming';
 
 import { SubNav, SubNavProps } from './SubNav';
 import { StorybookNpmTag } from '~/model/types';
 
-type EyebrowProps = React.ComponentProps<typeof Eyebrow>;
 type NavProps = React.ComponentProps<typeof Nav>;
 
 export interface HeaderProps {
-  githubStars: EyebrowProps['githubStarCount'];
-  inverse?: EyebrowProps['inverse'];
-  latestPost: {
-    title: EyebrowProps['label'];
-    url: EyebrowProps['link'];
-  };
+  githubStars: NavProps['githubStarCount'];
+  inverse?: NavProps['inverse'];
   latestVersion: NavProps['version'];
   pageType: SubNavProps['pageType'];
   npmTag: StorybookNpmTag;
@@ -29,16 +24,15 @@ const HeaderWrapper = styled.header`
   }
 `;
 
-export const Header: React.FC<HeaderProps> = ({ githubStars, inverse, latestPost, latestVersion, pageType, npmTag }) => {
+export const Header: React.FC<HeaderProps> = ({ githubStars, inverse, latestVersion, pageType, npmTag }) => {
   return (
     <HeaderWrapper>
-      <Eyebrow githubStarCount={githubStars} label={latestPost.title} link={latestPost.url} inverse={inverse} />
       <Nav
         apiKey={process.env.ALGOLIA_API_KEY as string}
-        framework="react"
         inverse={inverse}
         version={latestVersion}
         activeSection="docs"
+        githubStarCount={githubStars}
       />
       <SubNav pageType={pageType} npmTag={npmTag} />
     </HeaderWrapper>

diff --git a/components/layout/SubNav.tsx b/components/layout/SubNav.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/ban-ts-comment */
 import {
   SubNav as MarketingSubNav,
   SubNavRight,
@@ -52,7 +53,9 @@ export const SubNav: React.FC<SubNavProps> = ({ pageType, npmTag }) => {
   return pageType !== PAGE_TYPES.NOT_FOUND ? (
     <MarketingSubNav>
       <SubNavTabs label="Status page nav" items={subNavItems(pageType)} />
+      {/* @ts-ignore-error - TODO */}
       <SubNavDivider />
+      {/* @ts-ignore-error - TODO */}
       <SubNavMenus>
         <Menu
           label={npmTag}
@@ -68,6 +71,7 @@ export const SubNav: React.FC<SubNavProps> = ({ pageType, npmTag }) => {
           primary
         ></Menu>
       </SubNavMenus>
+      {/* @ts-ignore-error - TODO */}
       <SubNavRight>
         <SubNavLinkList label="Get support:" items={supportItems} />
       </SubNavRight>

diff --git a/mock/layout.json b/mock/layout.json
@@ -264,10 +264,6 @@
   "discordMemberCount": 15861,
   "githubContributorCount": 1867,
   "githubStars": 75256,
-  "latestPost": {
-    "title": "Storybook for full-stack developers",
-    "url": "https: //storybook.js.org/blog/storybook-for-full-stack-developers"
-  },
   "latestVersion": "6.5",
   "npmDownloads": 16719157,
   "sponsors": [

diff --git a/package.json b/package.json
@@ -20,8 +20,9 @@
   },
   "dependencies": {
     "@next/env": "^13.0.4",
-    "@storybook/components-marketing": "2.1.3--canary.57.c65b675.0",
+    "@storybook/components-marketing": "^3.1.0",
     "@storybook/design-system": "^7.15.15",
+    "@storybook/manager-api": "7.5.3",
     "@storybook/theming": "latest",
     "@types/node": "18.11.9",
     "@types/react": "18.0.25",
@@ -31,7 +32,7 @@
     "eslint": "8.28.0",
     "eslint-config-next": "13.0.4",
     "framer-motion": "^7.6.12",
-    "next": "13.0.4",
+    "next": "^13.1.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "superjson": "^1.12.1",
@@ -75,5 +76,10 @@
     "node": ">=18"
   },
   "readme": "ERROR: No README data found!",
-  "_id": "[email protected]"
+  "_id": "[email protected]",
+  "pnpm": {
+    "patchedDependencies": {
+      "@storybook/[email protected]": "patches/@[email protected]"
+    }
+  }
 }
diff --git a/patches/@[email protected] b/patches/@[email protected]
@@ -0,0 +1,16 @@
+diff --git a/CHANGELOG.md b/CHANGELOG.md
+deleted file mode 100644
+index be0caefba5e50a06da67a53b07e098236c8efa6f..0000000000000000000000000000000000000000
+diff --git a/dist/components/Search.js b/dist/components/Search.js
+index 536045254d32b683a855bfbc1b55ef01eca3544f..399b8ad2c8b636b2fbaab9ed5018927e2c7f2898 100644
+--- a/dist/components/Search.js
++++ b/dist/components/Search.js
+@@ -11,7 +11,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
+
+ var _react = _interopRequireDefault(require("react"));
+
+-var _shortcut = require("@storybook/api/shortcut");
++var _shortcut = require("@storybook/manager-api");
+
+ var _theming = require("@storybook/theming");
+