[blog][xs]: rm links from headings

packages/core/.storybook/main.ts

@@ -5,7 +5,6 @@ const config: StorybookConfig = {
   addons: [
     '@storybook/addon-essentials',
     '@storybook/addon-interactions',
-    '@storybook/addon-a11y',
     '@nrwl/react/plugins/storybook',
     'storybook-tailwind-dark-mode'
   ],
@@ -13,9 +12,6 @@ const config: StorybookConfig = {
     name: '@storybook/react-webpack5',
     options: {},
   },
-  docs: {
-    autodocs: 'tag',
-  },
 };
 
 export default config;

packages/core/.storybook/preview.ts

@@ -1,9 +1,6 @@
 import './tailwind-imports.css';
 
 const preview = {
-    parameters: {
-        actions: { argTypesRegex: "^on[A-Z].*" },
-    },
     globalTypes: {
         darkMode: {
             defaultValue: false, // Enable dark mode by default on all stories

packages/core/CHANGELOG.md

@@ -1,11 +1,5 @@
 # @portaljs/core
 
-## 1.0.7
-
-### Patch Changes
-
-- [`8d74fd98`](https://github.com/datopian/portaljs/commit/8d74fd98443bb3c0a28325be27b41281b59f3581) Thanks [@olayway](https://github.com/olayway)! - Minor footer style fixes.
-
 ## 1.0.6
 
 ### Patch Changes

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portaljs/core",
-  "version": "1.0.7",
+  "version": "1.0.6",
   "description": "Core Portal.JS components, configs and utils.",
   "repository": {
     "type": "git",
@@ -46,13 +46,10 @@
     "prop-types": "^15.8.1"
   },
   "peerDependencies": {
-    "mdx-mermaid": "2.0.0-rc7",
     "next": "^13.2.1",
     "next-themes": "^0.2.1",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
-  },
+    "mdx-mermaid": "2.0.0-rc7"
-  "devDependencies": {
-    "@storybook/addon-a11y": "^7.4.6"
   }
 }

packages/core/src/ui/Layout/Footer.stories.tsx

@@ -1,47 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-
-import { Footer } from './Footer';
-
-const meta: Meta<typeof Footer> = {
-    component: Footer,
-    tags: ['autodocs'],
-};
-
-export default meta;
-
-type Story = StoryObj<typeof Footer>;
-
-export const Basic: Story = {
-    args: {
-        author: {
-            name: "John Doe",
-        }
-    },
-};
-
-
-export const Links: Story = {
-    args: {
-        links: [
-            { name: "Link A", href: "#" },
-            { name: "Link B", href: "#" }
-        ],
-        author: {
-            name: "John Doe",
-        }
-    },
-};
-
-
-export const Logo: Story = {
-    args: {
-        links: [
-            { name: "Link A", href: "#" },
-            { name: "Link B", href: "#" }
-        ],
-        author: {
-            name: "John Doe",
-            logo: "https://via.placeholder.com/150"
-        }
-    },
-};

packages/core/src/ui/Layout/Footer.tsx

@@ -3,75 +3,57 @@ import Link from "next/link.js";
 import { AuthorConfig, NavLink } from "../types";
 
 interface Props {
+  links: Array<NavLink>;
   author: AuthorConfig;
-    links?: Array<NavLink>;
 }
 
-// TODO replace this with some nice tailwindui footer
 export const Footer: React.FC<Props> = ({ links, author }) => {
   return (
-        <footer className="bg-background dark:bg-background-dark text-primary dark:text-primary-dark pt-16 pb-20 px-14 flex flex-col items-center justify-center gap-3">
+    <footer className="bg-background dark:bg-background-dark prose dark:prose-invert max-w-none flex flex-col items-center justify-center w-full h-auto pt-10 pb-20">
-            {links && (
+      <div className="flex w-full flex-wrap justify-center">
-                <div className="flex w-full flex-wrap justify-center mb-2">
         {links.map((item) => (
           <Link
             key={item.href}
             href={item.href}
-                            className="inline-flex items-center mx-4 px-1 py-1 text-black hover:text-primary dark:text-white hover:dark:text-primary-dark no-underline font-semibold"
+            className="inline-flex items-center mx-4 px-1 pt-1 font-regular hover:text-slate-300 no-underline"
           >
             {/* TODO aria-current={item.current ? "page" : undefined} */}
             {item.name}
           </Link>
         ))}
       </div>
-            )}
+      <p className="flex items-center justify-center">
-            <p className="flex items-center justify-center gap-2">
+        Created by
-                <span>Created by</span>
-                {author.url ? (
         <a
           href={author.url}
           target="_blank"
           rel="noopener noreferrer"
-                        className="flex items-center gap-1 no-underline font-semibold text-black dark:text-white"
+          className="flex items-center no-underline"
-                    >
-                        {author.logo && (
-                            <img
-                                src={author.logo}
-                                alt="Logo"
-                                className="h-6 block"
-                            />
-                        )}
-                        <span>{author.name}</span>
-                    </a>
-                ) : (
-                    <span
-                        className="flex items-center gap-1 no-underline font-semibold text-black dark:text-white"
         >
           {author.logo && (
             <img
               src={author.logo}
               alt={author.name}
-                                className="h-6 block"
+              className="my-0 mx-1 h-6 block"
             />
           )}
-                        <span>{author.name}</span>
+          {author.name}
-                    </span>
+        </a>
-                )}
       </p>
-            <p className="flex items-center justify-center gap-1">
+      <p className="flex items-center justify-center">
-                <span>Made with</span>
+        Made with
         <a
           href="https://flowershow.app/"
           target="_blank"
           rel="noopener noreferrer"
-                    className="flex items-center gap-1 no-underline font-semibold text-black dark:text-white"
+          className="flex items-center no-underline"
         >
           <img
             src="https://flowershow.app/images/logo.svg"
-                        alt="Logo"
+            alt="Flowershow"
-                        className="h-6 block"
+            className="my-0 mx-1 h-6 block"
           />
-                    <span>Flowershow</span>
+          Flowershow
         </a>
       </p>
     </footer>

packages/core/src/ui/index.ts

@@ -7,7 +7,6 @@ export {
   TocSection,
   EditThisPage,
   useTableOfContents,
-  Footer
 } from "./Layout";
 export { Pre } from "./Pre";
 export { CustomLink } from "./Base/CustomLink";

packages/core/src/ui/types.ts

@@ -9,8 +9,8 @@ export interface NavLink {
 
 export interface AuthorConfig {
   name: string;
-  url?: string;
+  url: string;
-  logo?: string;
+  logo: string;
 }
 
 // social

packages/remark-embed/CHANGELOG.md

@@ -1,11 +1,5 @@
 # @portaljs/remark-embed
 
-## 1.0.5
-
-### Patch Changes
-
-- [`71716ab0`](https://github.com/datopian/portaljs/commit/71716ab01875f04f51bc23ba551c7a6a9a24a335) Thanks [@olayway](https://github.com/olayway)! - Add support for shortened yt links (https://youtu.be).
-
 ## 1.0.4
 
 ### Patch Changes

packages/remark-embed/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portaljs/remark-embed",
-  "version": "1.0.5",
+  "version": "1.0.4",
   "description": "Converts youtube link in mdx to an iframe embed",
   "repository": {
     "type": "git",

packages/remark-embed/src/lib/remark-embed.ts

@@ -1,29 +1,14 @@
 import { visit } from "unist-util-visit";
 
-// https://youtu.be/vDuh7vDgGIg
-
-// TODO write tests!
 function transformer(tree) {
   visit(tree, "paragraph", (node) => {
     visit(node, "text", (textNode) => {
       if (
-        (textNode.value.includes("https://www.youtube.com") ||
+        textNode.value.includes("https://www.youtube.com") &&
-          textNode.value.includes("https://youtu.be")
-        ) &&
         !textNode.value.includes("\n")
       ) {
-        let videoId: string;
-
-        if (textNode.value.includes("https://youtu.be")) {
-          // Extract video ID for short YT URLs
-          videoId = textNode.value.split("/").pop();
-        } else {
-          // Extract video ID for full YT URLs
         const urlSplit = textNode.value.split(/[=&]+/);
-          videoId = urlSplit[1];
+        const iframeUrl = `https://www.youtube.com/embed/${urlSplit[1]}`;
-        }
-
-        const iframeUrl = `https://www.youtube.com/embed/${videoId}`;
         Object.assign(node, {
           ...node,
           type: "element",