From 80c1ee2936b046ed7961c3e5b01ac2e8bda6a390 Mon Sep 17 00:00:00 2001 From: Dan Farrelly Date: Mon, 25 Nov 2024 04:01:10 -0500 Subject: [PATCH] Update links for Node guide (#998) --- components/Nav/Menu.tsx | 15 +- components/Nav/links.ts | 15 +- data/uses/serverless-node-background-jobs.tsx | 2 +- .../blog/_posts/announcing-pcxi-hackathon.mdx | 2 +- ...-auth-workflows-with-clerk-integration.mdx | 2 +- ...timizing-efficiency-in-async-workflows.mdx | 2 +- pages/docs/guides/user-defined-workflows.mdx | 2 +- pages/docs/index.mdx | 6 +- pages/docs/learn/glossary.mdx | 4 +- pages/docs/learn/inngest-functions.mdx | 2 +- pages/docs/learn/inngest-steps.mdx | 2 +- shared/Header/Dropdown/FeaturedLink.tsx | 27 ---- shared/Header/Dropdown/NavLink.tsx | 18 --- shared/Header/Dropdown/index.tsx | 36 ----- shared/Header/headerLinks.ts | 109 ------------- shared/Header/index.tsx | 151 ------------------ 16 files changed, 32 insertions(+), 363 deletions(-) delete mode 100644 shared/Header/Dropdown/FeaturedLink.tsx delete mode 100644 shared/Header/Dropdown/NavLink.tsx delete mode 100644 shared/Header/Dropdown/index.tsx delete mode 100644 shared/Header/headerLinks.ts diff --git a/components/Nav/Menu.tsx b/components/Nav/Menu.tsx index d07823d65..838e01a7b 100644 --- a/components/Nav/Menu.tsx +++ b/components/Nav/Menu.tsx @@ -1,4 +1,5 @@ import Link from "next/link"; +import { type RemixiconComponentType } from "@remixicon/react"; export type MenuProps = { title: string; @@ -6,18 +7,20 @@ export type MenuProps = { title: string; description: string; url: string; - icon: React.ComponentType<{ size: number }>; + icon: React.ComponentType<{ size: number }> | RemixiconComponentType; iconBg: string; }[]; secondaryTitle?: string; secondaryLinks?: { title: string; url: string; - icon: React.ComponentType<{ - size: number; - color?: string; - className?: string; - }>; + icon: + | React.ComponentType<{ + size: number; + color?: string; + className?: string; + }> + | RemixiconComponentType; iconClassName?: string; }[]; headerUrl?: string; diff --git a/components/Nav/links.ts b/components/Nav/links.ts index 149dc1c29..42f69ded8 100644 --- a/components/Nav/links.ts +++ b/components/Nav/links.ts @@ -14,8 +14,9 @@ import { IconPower, IconRetry, } from "src/shared/Icons/duotone"; +import { RiNextjsFill, RiNodejsFill } from "@remixicon/react"; import PythonIcon from "src/shared/Icons/Python"; -import TypeScriptIcon from "src/shared/Icons/TypeScript"; +// import TypeScriptIcon from "src/shared/Icons/TypeScript"; import { type MenuProps } from "./Menu"; @@ -108,9 +109,15 @@ export const resourcesLinks: MenuProps = { secondaryTitle: "Quick start guides", secondaryLinks: [ { - title: "TypeScript / JavaScript", - url: "/docs/quick-start?ref=nav", - icon: TypeScriptIcon, + title: "Next.js", + url: "/docs/getting-started/nextjs-quick-start?ref=nav", + icon: RiNextjsFill, + iconClassName: "w-4", + }, + { + title: "Node.js", + url: "/docs/getting-started/nodejs-quick-start?ref=nav", + icon: RiNodejsFill, iconClassName: "w-4", }, { diff --git a/data/uses/serverless-node-background-jobs.tsx b/data/uses/serverless-node-background-jobs.tsx index 759a11f86..6e3d31574 100644 --- a/data/uses/serverless-node-background-jobs.tsx +++ b/data/uses/serverless-node-background-jobs.tsx @@ -123,7 +123,7 @@ await inngest.send({ description: "A step-by-step guide to learn how to build with Inngest in less than 5 minutes.", type: "Tutorial", - href: "/docs/getting-started/nextjs-quick-start", + href: "/docs/getting-started/nodejs-quick-start", }, { title: "Running Background Jobs", diff --git a/pages/blog/_posts/announcing-pcxi-hackathon.mdx b/pages/blog/_posts/announcing-pcxi-hackathon.mdx index f0cd5823f..b5671a4a4 100644 --- a/pages/blog/_posts/announcing-pcxi-hackathon.mdx +++ b/pages/blog/_posts/announcing-pcxi-hackathon.mdx @@ -65,7 +65,7 @@ Moreover, here's a list of resources you may find useful: - [Xata Summer Hackathon resource hub](https://xata.notion.site/Summer-Hackathon-Resources-a612dffc333a41c2bf9f3f8ed7712750) - [Clerk Hackathon Resources](https://clerkdev.notion.site/Clerk-Hackathon-Resources-1993bf4a3b3841fb91b01b209b9258d1) -- [Inngest Quick Start](/docs/getting-started/nextjs-quick-start) +- [Inngest Quick Start](/docs/getting-started/nextjs-quick-start?ref=blog-pcxi-hackathon) - Inngest Blog: [AI in production: Managing capacity with flow control](/blog/ai-in-production-managing-capacity-with-flow-control) ## Questions? diff --git a/pages/blog/_posts/building-auth-workflows-with-clerk-integration.mdx b/pages/blog/_posts/building-auth-workflows-with-clerk-integration.mdx index b780781d3..9e6f5518d 100644 --- a/pages/blog/_posts/building-auth-workflows-with-clerk-integration.mdx +++ b/pages/blog/_posts/building-auth-workflows-with-clerk-integration.mdx @@ -132,7 +132,7 @@ As you might be able to see, there is a ton that you could do from here using al ## How do I get started? -Once you set up the Inngest webhook with Clerk, you can run through [this Inngest quick start](/docs/getting-started/nextjs-quick-start) or check out [example projects](https://github.com/inngest/inngest-js/tree/main/examples) for your framework of choice. If you want to learn more about Inngest webhooks, check out [the guide here](/docs/platform/webhooks). +Once you set up the Inngest webhook with Clerk, you can run through [this Inngest quick start](/docs/getting-started/nextjs-quick-start?ref=blog-clerk-integration) or check out [example projects](https://github.com/inngest/inngest-js/tree/main/examples) for your framework of choice. If you want to learn more about Inngest webhooks, check out [the guide here](/docs/platform/webhooks). ## Onward diff --git a/pages/blog/_posts/debouncing-in-queuing-systems-optimizing-efficiency-in-async-workflows.mdx b/pages/blog/_posts/debouncing-in-queuing-systems-optimizing-efficiency-in-async-workflows.mdx index 7d8336509..2fb550788 100644 --- a/pages/blog/_posts/debouncing-in-queuing-systems-optimizing-efficiency-in-async-workflows.mdx +++ b/pages/blog/_posts/debouncing-in-queuing-systems-optimizing-efficiency-in-async-workflows.mdx @@ -162,7 +162,7 @@ const generateIdeasFunction = inngest.createFunction( ); ``` -For more information on this, check out [our guide on debouncing](/docs/reference/functions/debounce) or check out [our quick start tutorial](/docs/getting-started/nextjs-quick-start) to learn the basics of Inngest. +For more information on this, check out [our guide on debouncing](/docs/reference/functions/debounce) or check out [our quick start tutorial](/docs/getting-started/nextjs-quick-start?ref=blog-debounce-in-queueing-systems) to learn the basics of Inngest. ## Conclusion diff --git a/pages/docs/guides/user-defined-workflows.mdx b/pages/docs/guides/user-defined-workflows.mdx index f335117d5..8f8b614b8 100644 --- a/pages/docs/guides/user-defined-workflows.mdx +++ b/pages/docs/guides/user-defined-workflows.mdx @@ -56,7 +56,7 @@ Our users will be able to combine those tasks to build their custom workflows. ### 1. Adding the tasks definition to the application -After [installing and setup Inngest](/docs/getting-started/nextjs-quick-start) in our Next.js application, we will create the following [Workflow Actions definition](/docs/reference/workflow-kit/actions) file: +After [installing and setup Inngest](/docs/getting-started/nextjs-quick-start?ref=docs-guide-user-defined-workflows) in our Next.js application, we will create the following [Workflow Actions definition](/docs/reference/workflow-kit/actions) file: ```ts {{ title: "lib/inngest/workflowActions.ts" }} import { type PublicEngineAction } from "@inngest/workflow-kit"; diff --git a/pages/docs/index.mdx b/pages/docs/index.mdx index 951936fd9..ddab44838 100644 --- a/pages/docs/index.mdx +++ b/pages/docs/index.mdx @@ -25,7 +25,7 @@ Write functions in TypeScript, Python or Go to power background and scheduled jo } iconPlacement="top" @@ -34,7 +34,7 @@ Write functions in TypeScript, Python or Go to power background and scheduled jo } iconPlacement="top" @@ -43,7 +43,7 @@ Write functions in TypeScript, Python or Go to power background and scheduled jo } iconPlacement="top" diff --git a/pages/docs/learn/glossary.mdx b/pages/docs/learn/glossary.mdx index 37c7b5bd8..cd9444106 100644 --- a/pages/docs/learn/glossary.mdx +++ b/pages/docs/learn/glossary.mdx @@ -60,7 +60,7 @@ An event is a trigger that initiates the execution of a [function](#inngest-func ## Inngest Function -Inngest functions are the fundamental building blocks of the Inngest platform, +Inngest functions are the fundamental building blocks of the Inngest platform, which enable developers to run reliable background logic, from background jobs to complex workflows. They provide robust tools for retrying, scheduling, and coordinating complex sequences of operations. They are composed of [steps](#inngest-step) that can run independently and be retried in case of failure. Inngest functions are powered by [Durable Execution](#durable-execution), ensuring reliability and fault tolerance, and can be deployed on any platform, including serverless environments. Read more about [Inngest Functions](/docs/learn/inngest-functions). ## Inngest Step @@ -95,7 +95,7 @@ Throttling is one of the methods offered by Inngest's [Flow Control](#flow-contr ## Next Steps -- Explore Inngest through our [Quick Start](/docs/getting-started/nextjs-quick-start). +- Explore Inngest through our [Quick Start](/docs/getting-started/nextjs-quick-start?ref=docs-glossary). - Learn about [Inngest Functions](/docs/learn/inngest-functions). - Learn about [Inngest Steps](/docs/learn/inngest-steps). - Understand how [Inngest functions are executed](/docs/learn/how-functions-are-executed). diff --git a/pages/docs/learn/inngest-functions.mdx b/pages/docs/learn/inngest-functions.mdx index fe088eb92..e128b17e9 100644 --- a/pages/docs/learn/inngest-functions.mdx +++ b/pages/docs/learn/inngest-functions.mdx @@ -121,7 +121,7 @@ This is useful when you need to break down complex workflows into simpler, manag ## Further reading -- [Quick Start guide](/docs/getting-started/nextjs-quick-start): learn how to build complex workflows. +- [Quick Start guide](/docs/getting-started/nextjs-quick-start?ref=docs-inngest-functions): learn how to build complex workflows. - ["How Inngest functions are executed"](/docs/learn/how-functions-are-executed): learn more about Inngest's execution model. - ["Inngest steps"](/docs/learn/inngest-steps): understand building Inngest's blocks. - ["Flow Control"](/docs/guides/flow-control): learn how to manage execution within Inngest functions. diff --git a/pages/docs/learn/inngest-steps.mdx b/pages/docs/learn/inngest-steps.mdx index 0e1134dba..7b525380f 100644 --- a/pages/docs/learn/inngest-steps.mdx +++ b/pages/docs/learn/inngest-steps.mdx @@ -175,6 +175,6 @@ export default inngest.createFunction( ## Further reading -- [Quick Start](/docs/getting-started/nextjs-quick-start): learn how to build complex workflows. +- [Quick Start](/docs/getting-started/nextjs-quick-start?ref=docs-inngest-steps): learn how to build complex workflows. - ["How Inngest functions are executed"](/docs/learn/how-functions-are-executed): Learn more about Inngest's execution model, including how steps are handled. - Docs guide: ["Multi-step functions"](/docs/guides/multi-step-functions). \ No newline at end of file diff --git a/shared/Header/Dropdown/FeaturedLink.tsx b/shared/Header/Dropdown/FeaturedLink.tsx deleted file mode 100644 index 67ecd06c1..000000000 --- a/shared/Header/Dropdown/FeaturedLink.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import ArrowRight from "../../Icons/ArrowRight"; - -export default function FeaturedLink({ link }) { - return ( - -
- -
-
-

- {link.title} - -

- {link.desc} -
- - ); -} diff --git a/shared/Header/Dropdown/NavLink.tsx b/shared/Header/Dropdown/NavLink.tsx deleted file mode 100644 index 5b69ae6d8..000000000 --- a/shared/Header/Dropdown/NavLink.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import ArrowRight from "../../Icons/ArrowRight"; -export default function NavLink({ theme, link, len }) { - const borderPattern = - len % 2 === 0 - ? "lg:[&:nth-last-child(-n+2)]:border-b-transparent" - : "lg:[&:last-child]:border-b-transparent"; - - return ( - - - {link.title} - - - ); -} diff --git a/shared/Header/Dropdown/index.tsx b/shared/Header/Dropdown/index.tsx deleted file mode 100644 index 577256518..000000000 --- a/shared/Header/Dropdown/index.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import FeaturedLink from "./FeaturedLink"; -import NavLink from "./NavLink"; - -export default function HeaderDropdown({ navLinks }) { - return ( -
-
- {!!navLinks.featured.length && ( -
-

- {navLinks.featuredTitle} -

- {navLinks.featured.map((link) => ( - - ))} -
- )} -
-

- {navLinks.linksTitle} -

-
- {navLinks.links.map((link, i) => ( - - ))} -
-
-
-
- ); -} diff --git a/shared/Header/headerLinks.ts b/shared/Header/headerLinks.ts deleted file mode 100644 index ae222054c..000000000 --- a/shared/Header/headerLinks.ts +++ /dev/null @@ -1,109 +0,0 @@ -import { - IconBackgroundTasks, - IconDeploying, - IconDocs, - IconSDK, - IconJourney, - IconPatterns, - IconScheduled, - IconSendEvents, - IconSteps, - IconTools, - IconWritingFns, - IconCompiling, - IconPower, - IconRetry, -} from "../Icons/duotone"; - -const productLinks = { - featuredTitle: "Product", - featured: [ - { - title: "Platform", - desc: "Learn about features, flow control, and more", - url: "/platform?ref=nav", - icon: IconSteps, - iconBg: "bg-indigo-500", - }, - ], - linksTitle: "Use Cases", - linksTheme: "indigo", - links: [ - { - title: "AI + LLMs", - url: "/ai?ref=nav", - icon: IconSDK, - }, - { - title: "Durable workflows", - url: "/uses/durable-workflows?ref=nav", - icon: IconRetry, - }, - { - title: "Workflow engines", - url: "/uses/workflow-engine?ref=nav", - icon: IconJourney, - }, - { - title: "Serverless queues", - url: "/uses/serverless-queues?ref=nav", - icon: IconSteps, - }, - { - title: "Background jobs", - url: "/uses/serverless-node-background-jobs?ref=nav", - icon: IconBackgroundTasks, - }, - { - title: "Scheduled & cron jobs", - url: "/uses/serverless-cron-jobs?ref=nav", - icon: IconScheduled, - }, - ], -}; - -const learnLinks = { - featuredTitle: "Documentation", - featured: [ - { - title: "Docs", - desc: "SDK and platform guides and references", - url: "/docs?ref=nav", - icon: IconDocs, - iconBg: "bg-blue-500", - }, - // { - // title: "Patterns: Async & event-driven", - // desc: "How to build asynchronous functionality by example", - // url: "/patterns?ref=nav", - // icon: IconPatterns, - // iconBg: "bg-sky-500", - // }, - ], - linksTitle: "Guides", - linksTheme: "blue", - links: [ - { - title: "Quick start tutorial", - url: "/docs/getting-started/nextjs-quick-start?ref=nav", - icon: IconCompiling, - }, - { - title: "Concurrency", - url: "/docs/guides/concurrency?ref=nav", - icon: IconWritingFns, - }, - { - title: "Handling Idempotency", - url: "/docs/guides/handling-idempotency?ref=nav", - icon: IconSendEvents, - }, - { - title: "Going to production", - url: "/docs/deploy?ref=nav", - icon: IconDeploying, - }, - ], -}; - -export { productLinks, learnLinks }; diff --git a/shared/Header/index.tsx b/shared/Header/index.tsx index 189deb2d3..48c6332d2 100644 --- a/shared/Header/index.tsx +++ b/shared/Header/index.tsx @@ -1,154 +1,3 @@ -"use client"; -import { useState, useEffect } from "react"; -import { - RiMenuLine, - RiCloseLine, - RiGithubFill, - RiDiscordFill, - RiTwitterXFill, - RiArrowRightLine, -} from "@remixicon/react"; -import Logo from "../Icons/Logo"; -import classNames from "src/utils/classNames"; -import Container from "../layout/Container"; -import HeaderDropdown from "./Dropdown"; -import { productLinks, learnLinks } from "./headerLinks"; - import { default as Nav } from "src/components/Nav"; export default Nav; -/* -export function Header() { - const [scroll, setScroll] = useState(false); - const [menuState, setMenuState] = useState(false); - - useEffect(() => { - window.addEventListener("scroll", () => { - setScroll(window.scrollY > 40); - }); - }, []); - - const toggleMenu = () => { - setMenuState(!menuState); - }; - - return ( -
- -
-
- - - - -
- -
- -
- ); -} -*/