-
-
-
-
-
-
-
- - Spork FAQ - FAQ -
-
-
- Back to Network
-
-
-
- {faqList.map((faq, i) => {
- const itemExpanded = expanded[i]
- const isAboveExpandedItem = expanded.at(i + 1)
- const isLast = i === expanded.length - 1
-
- const classes = clsx("cursor-pointer", {
- "md:p-8": variation === "large" && !itemExpanded,
- "md:py-4 md:pl-3": variation === "small" && !itemExpanded,
- "py-3 pr-3": !itemExpanded,
- "px-6 py-7 pt-6 my-1.5 rounded-lg bg-white dark:bg-primary-gray-dark":
- itemExpanded,
- "border-b border-gray-200 dark:border-primary-gray-400":
- !itemExpanded && !isLast && !isAboveExpandedItem,
- })
-
- return (
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/TutorialCard/PaginatedTutorialCardList.tsx b/src/ui/design-system/src/lib/Components/TutorialCard/PaginatedTutorialCardList.tsx
deleted file mode 100644
index 3aea232a60..0000000000
--- a/src/ui/design-system/src/lib/Components/TutorialCard/PaginatedTutorialCardList.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import React, { useEffect, useRef, useState } from "react"
-import TutorialCard, { TutorialCardProps } from "."
-import { useIsomorphicLayoutEffect } from "../../utils/useIsomorphicLayoutEffect"
-import Pagination from "../Pagination"
-
-export type PaginatedTutorialCardListProps = {
- className?: string
-
- /**
- * An optional identifier that, when changed, causes the pagination to
- * be reset to the first page.
- */
- listId?: unknown
-
- pageSize?: number
-
- tutorials: TutorialCardProps[]
-
- scrollOnPaginate?: boolean
-}
-
-export const PaginatedTutorialCardList = ({
- className,
- listId,
- pageSize = 4,
- tutorials,
- scrollOnPaginate = true,
-}: PaginatedTutorialCardListProps) => {
- const scrollRef = useRef toggleExpansion(i)}
- role="button"
- className={classes}
- key={i}
- >
-
- )
- })}
-
-
- {itemExpanded && (
-
- {faq.question}
-
-
- {itemExpanded ?
-
- {faq.answer}
-
- )}
-
- {
- if (page !== nextPage) {
- setResetScroll(resetScroll + 1)
- setPage(nextPage)
- }
- }}
- />
-
- )
-}
-
-export default TutorialCard
diff --git a/src/ui/design-system/src/lib/Components/VideoCard/LargeVideoCard.tsx b/src/ui/design-system/src/lib/Components/VideoCard/LargeVideoCard.tsx
deleted file mode 100644
index 9fd3c5819a..0000000000
--- a/src/ui/design-system/src/lib/Components/VideoCard/LargeVideoCard.tsx
+++ /dev/null
@@ -1,91 +0,0 @@
-import clsx from "clsx"
-import React, { useState } from "react"
-
-import PlayCircle from "../../../../images/action/play-circle.svg"
-import Time from "../../../../images/content/date.svg"
-import { useExtractYoutubeVideoId } from "./useExtractYoutubeVideoId"
-import { VideoCardError, VideoCardErrorProps } from "./VideoCardError"
-
-export interface LargeVideoCardProps {
- link: string // NOTE: link should be in the format that youtubes site uses ie: https://www.youtube.com/watch?v=...
- title: string
- length: number // seconds
- className?: string
- errorBehavior?: VideoCardErrorProps["behavior"]
-}
-
-export function LargeVideoCard({
- link,
- title,
- length,
- className,
- errorBehavior = "render-comment",
-}: LargeVideoCardProps) {
- const extractResult = useExtractYoutubeVideoId(link)
- const [showOverlay, setShowOverlay] = useState(true)
-
- const minutes = String(Math.floor(length / 60)).padStart(2, "0")
- const seconds = length % 60
-
- if ("error" in extractResult) {
- return (
-
- {tutorials
- .slice((page - 1) * pageSize, page * pageSize)
- .map((tutorialProps, index) => (
-
-
- {showOverlay ? (
- <>
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/VideoCard/SmallVideoCard.tsx b/src/ui/design-system/src/lib/Components/VideoCard/SmallVideoCard.tsx
deleted file mode 100644
index eb57f62570..0000000000
--- a/src/ui/design-system/src/lib/Components/VideoCard/SmallVideoCard.tsx
+++ /dev/null
@@ -1,68 +0,0 @@
-import React from 'react'
-import PlayCircle from "../../../../images/action/play-circle.svg"
-import TimeIcon from "../../../../images/content/date.svg"
-import ExternalLinkIcon from "../../../../images/content/external-link.svg"
-import AppLink from "../AppLink"
-import Tag from "../Tag"
-import { LargeVideoCardProps } from "./LargeVideoCard"
-import { useExtractYoutubeVideoId } from "./useExtractYoutubeVideoId"
-import { VideoCardError } from "./VideoCardError"
-
-export interface SmallVideoCardProps extends LargeVideoCardProps {
- tags: string[]
-}
-
-export function SmallVideoCard({
- title,
- length,
- tags,
- link,
- errorBehavior = "render-comment",
-}: SmallVideoCardProps) {
- const extractResult = useExtractYoutubeVideoId(link)
- const minutes = String(Math.floor(length / 60)).padStart(2, "0")
- const seconds = length % 60
-
- if ("error" in extractResult) {
- return (
- setShowOverlay(false)}
- >
- 
-
-
-
-
-
-
-
-
-
-
- ) : null}
-
-
- {title}
-
-
-
-
-
- {minutes}:{seconds}
-
-
-
-
-
-
-
- - {title} -
-
-
-
- {tags.map((tag, i) => (
-
-
-
- ))}
-
-
-
- {minutes}:{seconds}
-
-
- {children}
-
-)
-
-export function Attribution({
- updatedDate,
- authorName,
- authorIcon,
- otherAuthorsCount,
- commitUrl,
- readMinutes,
- difficulty,
-}: AttributionProps) {
- const authorUrl = `https://www.github.com/${authorName}`
- return (
-
-
-
- Updated: {dateYYYYMMDD(updatedDate)} {" "}
- by
-
- {!!authorIcon && (
-
- 
-
- )}
-
- {authorName}
- {" "}
- {otherAuthorsCount
- ? `(+${otherAuthorsCount} other${otherAuthorsCount > 1 ? "s" : ""})`
- : ""}
-
-
- {!!readMinutes && (
-
-
- )}
- {!!difficulty && (
-
-
- )}
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Attribution/CalendarIcon.tsx b/src/ui/design-system/src/lib/Components/Attribution/CalendarIcon.tsx
deleted file mode 100644
index b22a583088..0000000000
--- a/src/ui/design-system/src/lib/Components/Attribution/CalendarIcon.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-function CalendarIcon() {
- return (
-
- )
-}
-
-export default CalendarIcon
diff --git a/src/ui/design-system/src/lib/Components/Attribution/ClockIcon.tsx b/src/ui/design-system/src/lib/Components/Attribution/ClockIcon.tsx
deleted file mode 100644
index 350cb732a6..0000000000
--- a/src/ui/design-system/src/lib/Components/Attribution/ClockIcon.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-function ClockIcon() {
- return (
-
- )
-}
-
-export default ClockIcon
diff --git a/src/ui/design-system/src/lib/Components/Attribution/DifficultyIcon.tsx b/src/ui/design-system/src/lib/Components/Attribution/DifficultyIcon.tsx
deleted file mode 100644
index aa1bffba6c..0000000000
--- a/src/ui/design-system/src/lib/Components/Attribution/DifficultyIcon.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-function DifficultyIcon() {
- return (
-
- )
-}
-
-export default DifficultyIcon
diff --git a/src/ui/design-system/src/lib/Components/Breadcrumbs/Breadcrumbs.stories.tsx b/src/ui/design-system/src/lib/Components/Breadcrumbs/Breadcrumbs.stories.tsx
deleted file mode 100644
index adc9cae387..0000000000
--- a/src/ui/design-system/src/lib/Components/Breadcrumbs/Breadcrumbs.stories.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { Breadcrumbs, BreadcrumbsProps } from "."
-
-export default {
- component: Breadcrumbs,
- title: "Components/Breadcrumbs",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
- {items.map((item, index) => (
-
- {index > 0 &&
- ))}
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/CommunityMembers/CommunityMembers.stories.tsx b/src/ui/design-system/src/lib/Components/CommunityMembers/CommunityMembers.stories.tsx
deleted file mode 100644
index 644bc27a50..0000000000
--- a/src/ui/design-system/src/lib/Components/CommunityMembers/CommunityMembers.stories.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import CommunityMembers, { CommunityMembersProps } from "."
-
-export default {
- component: CommunityMembers,
- title: "Components/CommunityMembers",
-} as Meta
-
-const Template: Story
-
- )
-}
-
-const args = {
- authors: Array(3).fill({
- name: "Luke Skywalker",
- title: "Jedi Master",
- profileImage:
- "https://www.slashfilm.com/img/gallery/heres-what-the-new-luke-skywalker-looks-like-under-his-digital-mask/l-intro-1644193087.jpg",
- }),
- contributors: Array(27).fill({
- name: "Luke Skywalker",
- profileImage:
- "https://www.slashfilm.com/img/gallery/heres-what-the-new-luke-skywalker-looks-like-under-his-digital-mask/l-intro-1644193087.jpg",
- }),
-}
-
-export const Default = Template.bind({})
-Default.args = args
-
-export const mobile = Template.bind({})
-mobile.args = args
-mobile.parameters = {
- viewport: {
- defaultViewport: "xs",
- },
-}
diff --git a/src/ui/design-system/src/lib/Components/CommunityMembers/index.tsx b/src/ui/design-system/src/lib/Components/CommunityMembers/index.tsx
deleted file mode 100644
index 7ef9c8d319..0000000000
--- a/src/ui/design-system/src/lib/Components/CommunityMembers/index.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import { RoundImage } from ".."
-
-export type CommunityMembersProps = {
- authors: any
- contributors: any
-}
-
-const CommunityMembers = ({ authors, contributors }: CommunityMembersProps) => {
- return (
-
-
- )
-}
-
-export default CommunityMembers
diff --git a/src/ui/design-system/src/lib/Components/ForumCell/ForumCell.stories.tsx b/src/ui/design-system/src/lib/Components/ForumCell/ForumCell.stories.tsx
deleted file mode 100644
index eb41ee3133..0000000000
--- a/src/ui/design-system/src/lib/Components/ForumCell/ForumCell.stories.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import ForumCell, { ForumCellProps } from "."
-
-export default {
- component: ForumCell,
- title: "Components/ForumCell",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
-
-
-
- Meet the authors
-
- {authors.map(
- (
- {
- profileImage,
- name,
- title,
- }: { profileImage: string; name: string; title: string },
- index: number
- ) => (
-
-
-
- )
- )}
-
-
- {name}
-{title}
-
-
-
- Community contributors
-
-
- {contributors.map(
- (
- { profileImage, name }: { profileImage: string; name: string },
- index: number
- ) => (
-
-
-
- {heading}
- {subheading} -
- {/* TODO: API is returning incorrect images, hiding for now */}
- {/*
-
- {participants.map((participant, index) => (
-
*/}
-
-
- ))}
-
-
- -- )} -- {tokens.map((line, i) => ( ---- ))} -- {i + 1} --- {line.map((token, key) => ( - - ))} --
-
-
-
-
-
-
-
- )
-}
-
-export const Default = Template.bind({})
-Default.args = {
- rawText: "Raw code",
- autoHeight: true,
-}
-
-export const DefaultDark = Template.bind({})
-DefaultDark.args = { ...Default.args, theme: "dark" }
-DefaultDark.parameters = {
- backgrounds: {
- default: "dark",
- },
-}
-
-export const DefaultMobile = Template.bind({})
-DefaultMobile.parameters = {
- viewport: {
- defaultViewport: "xs",
- },
-}
-
-export const Tall = Template.bind({})
-Tall.args = {
- ...Default.args,
-}
diff --git a/src/ui/design-system/src/lib/Components/InternalCodeblock/index.tsx b/src/ui/design-system/src/lib/Components/InternalCodeblock/index.tsx
deleted file mode 100644
index 50e10f8f2b..0000000000
--- a/src/ui/design-system/src/lib/Components/InternalCodeblock/index.tsx
+++ /dev/null
@@ -1,116 +0,0 @@
-import clsx from "clsx"
-import { useState } from "react"
-import { Theme } from "~/cms/utils/theme.provider"
-import CollapseIcon from "../../../../images/content/collapse.svg"
-import FileCopyIcon from "../../../../images/content/file-copy.svg"
-import HashIcon from "../../../../images/content/hash.svg"
-import ScreenFullIcon from "../../../../images/content/screen-full.svg"
-import { Dialog } from "../Dialog"
-import { NAV_HEIGHT } from "../NavigationBar"
-import { Code } from "./Code"
-
-const DEFAULT_MAX_HEIGHT = 280
-
-function Header({
- open,
- openDialog,
- closeDialog,
- onCopy,
-}: {
- open: boolean
- openDialog: () => void
- closeDialog: () => void
- onCopy: () => void
-}) {
- return (
-
- // Valid: title-case
-
- //
-
- PersonID
-
-
-
- // Valid: with underscore
-
-
- //
-
- token_name
-
-
-
- // Valid: leading underscore and characters
-
-
- //
-
- _balance
-
-
-
- // Valid: leading underscore and numbers
-
-
- _8264
-
-
-
- // Valid: characters and number
-
-
- //
-
- account2
-
-
-
- // Invalid: leading number
-
-
- //
-
- 1something
-
-
-
- // Invalid: invalid character #
-
-
- _#
- 1
-
-
-
- // Invalid: various invalid characters, Invalid: various invalid
- characters, Invalid: various invalid characters, Invalid: various
- invalid characters
-
-
- //
-
- !@#$%^&*
-
-
- -
- // Valid: title-case
-
- //
-
- PersonID
-
- -
Inline code
-
-
- )
-}
-
-export type InternalCodeblockProps = {
- theme: Theme | null
- children: JSX.Element
- autoHeight?: boolean
- className?: string
-}
-
-export function InternalCodeblock({
- theme,
- children,
- autoHeight,
- className,
-}: InternalCodeblockProps) {
- const [open, setOpen] = useState(false)
- const openDialog = () => setOpen(true)
- const closeDialog = () => setOpen(false)
- const codeString = children?.props?.children?.trim()
- const onCopy = () => navigator.clipboard.writeText(codeString)
-
- return (
- <>
-
-
-
-
-
-
-
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/InternalCodeblock/prism.js b/src/ui/design-system/src/lib/Components/InternalCodeblock/prism.js
deleted file mode 100644
index 2edec4778a..0000000000
--- a/src/ui/design-system/src/lib/Components/InternalCodeblock/prism.js
+++ /dev/null
@@ -1,94 +0,0 @@
-/* eslint-disable */
-export const prismSwiftLang = {
- comment: {
- pattern:
- /(^|[^\\:])(?:\/\/.*|\/\*(?:[^/*]|\/(?!\*)|\*(?!\/)|\/\*(?:[^*]|\*(?!\/))*\*\/)*\*\/)/,
- lookbehind: !0,
- greedy: !0,
- },
- "string-literal": [
- {
- pattern: RegExp(
- '(^|[^"#])(?:"(?:\\\\(?:\\((?:[^()]|\\([^()]*\\))*\\)|\r\n|[^(])|[^\\\\\r\n"])*"|"""(?:\\\\(?:\\((?:[^()]|\\([^()]*\\))*\\)|[^(])|[^\\\\"]|"(?!""))*""")(?!["#])'
- ),
- lookbehind: !0,
- greedy: !0,
- inside: {
- interpolation: {
- pattern: /(\\\()(?:[^()]|\([^()]*\))*(?=\))/,
- lookbehind: !0,
- inside: null,
- },
- "interpolation-punctuation": {
- pattern: /^\)|\\\($/,
- alias: "punctuation",
- },
- punctuation: /\\(?=[\r\n])/,
- string: /[\s\S]+/,
- },
- },
- {
- pattern: RegExp(
- '(^|[^"#])(#+)(?:"(?:\\\\(?:#+\\((?:[^()]|\\([^()]*\\))*\\)|\r\n|[^#])|[^\\\\\r\n])*?"|"""(?:\\\\(?:#+\\((?:[^()]|\\([^()]*\\))*\\)|[^#])|[^\\\\])*?""")\\2'
- ),
- lookbehind: !0,
- greedy: !0,
- inside: {
- interpolation: {
- pattern: /(\\#+\()(?:[^()]|\([^()]*\))*(?=\))/,
- lookbehind: !0,
- inside: null,
- },
- "interpolation-punctuation": {
- pattern: /^\)|\\#+\($/,
- alias: "punctuation",
- },
- string: /[\s\S]+/,
- },
- },
- ],
- directive: {
- pattern: RegExp(
- "#(?:(?:elseif|if)\\b(?:[ \t]*(?:![ \t]*)?(?:\\b\\w+\\b(?:[ \t]*\\((?:[^()]|\\([^()]*\\))*\\))?|\\((?:[^()]|\\([^()]*\\))*\\))(?:[ \t]*(?:&&|\\|\\|))?)+|(?:else|endif)\\b)"
- ),
- alias: "property",
- inside: {
- "directive-name": /^#\w+/,
- boolean: /\b(?:false|true)\b/,
- number: /\b\d+(?:\.\d+)*\b/,
- operator: /!|&&|\|\||[<>]=?/,
- punctuation: /[(),]/,
- },
- },
- literal: {
- pattern:
- /#(?:colorLiteral|column|dsohandle|file(?:ID|Literal|Path)?|function|imageLiteral|line)\b/,
- alias: "constant",
- },
- "other-directive": { pattern: /#\w+\b/, alias: "property" },
- attribute: { pattern: /@\w+/, alias: "atrule" },
- "function-definition": {
- pattern: /(\bfunc\s+)\w+/,
- lookbehind: !0,
- alias: "function",
- },
- label: {
- pattern:
- /\b(break|continue)\s+\w+|\b[a-zA-Z_]\w*(?=\s*:\s*(?:for|repeat|while)\b)/,
- lookbehind: !0,
- alias: "important",
- },
- keyword:
- /\b(?:Any|Protocol|Self|Type|actor|as|assignment|associatedtype|associativity|async|await|break|case|catch|class|continue|convenience|default|defer|deinit|didSet|do|dynamic|else|enum|extension|fallthrough|fileprivate|final|for|func|get|guard|higherThan|if|import|in|indirect|infix|init|inout|internal|is|isolated|lazy|left|let|lowerThan|mutating|none|nonisolated|nonmutating|open|operator|optional|override|postfix|precedencegroup|prefix|private|protocol|public|repeat|required|rethrows|return|right|safe|self|set|some|static|struct|subscript|super|switch|throw|throws|try|typealias|unowned|unsafe|var|weak|where|while|willSet)\b/,
- boolean: /\b(?:false|true)\b/,
- nil: { pattern: /\bnil\b/, alias: "constant" },
- "short-argument": /\$\d+\b/,
- omit: { pattern: /\b_\b/, alias: "keyword" },
- number:
- /\b(?:[\d_]+(?:\.[\de_]+)?|0x[a-f0-9_]+(?:\.[a-f0-9p_]+)?|0b[01_]+|0o[0-7_]+)\b/i,
- "class-name": /\b[A-Z](?:[A-Z_\d]*[a-z]\w*)?\b/,
- function: /\b[a-z_]\w*(?=\s*\()/i,
- constant: /\b(?:[A-Z_]{2,}|k[A-Z][A-Za-z_]+)\b/,
- operator: /[-+*/%=!<>&|^~?]+|\.[.\-+*/%=!<>&|^~?]+/,
- punctuation: /[{}[\]();,.:\\]/,
-}
diff --git a/src/ui/design-system/src/lib/Components/InternalImg/InternalImg.tsx b/src/ui/design-system/src/lib/Components/InternalImg/InternalImg.tsx
deleted file mode 100644
index 3753686c0a..0000000000
--- a/src/ui/design-system/src/lib/Components/InternalImg/InternalImg.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import clsx from "clsx"
-import { forwardRef } from "react"
-import { useInternalAssetUrl } from "../InternalUrlContext"
-
-export type InternalImgProps = React.ComponentPropsWithRef<"img">
-
-/**
- * Renders an
-
-
- {isPrimary ? (
- 
- ) : (
- 
- )}
-
-
-
-
-
- {title}
-
-
- {description}
-
-
-
-
-
-
-
-
- {tags.map((tag) => (
-
-
- {title}
-
-
- {description}
-
-
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/InternalSubnav/InternalSubnav.stories.tsx b/src/ui/design-system/src/lib/Components/InternalSubnav/InternalSubnav.stories.tsx
deleted file mode 100644
index 27c5b49e14..0000000000
--- a/src/ui/design-system/src/lib/Components/InternalSubnav/InternalSubnav.stories.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { InternalSubnav, InternalSubnavProps } from "."
-
-const VERSIONS = [
- { name: "9.3", href: "#" },
- { name: "9.2", href: "#" },
- { name: "9.1", href: "#" },
- { name: "9.0", href: "#" },
- { name: "8.9", href: "#" },
- { name: "8.8", href: "#" },
-]
-
-export default {
- component: InternalSubnav,
- title: "Components/InternalSubnav",
-} as Meta
-
-const Template: Story
-
-
-
-
- {title}
- {description} -
-
-
-
-
- Getting Started
-
-
- {headerCards.map((headerCard, index) => (
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/InternalVersionSelect/InternalVersionSelect.stories.tsx b/src/ui/design-system/src/lib/Components/InternalVersionSelect/InternalVersionSelect.stories.tsx
deleted file mode 100644
index af14ac3a9f..0000000000
--- a/src/ui/design-system/src/lib/Components/InternalVersionSelect/InternalVersionSelect.stories.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { InternalVersionSelect, InternalVersionSelectProps } from "."
-
-export default {
- component: InternalVersionSelect,
- title: "Components/InternalVersionSelect",
-} as Meta
-
-const VERSIONS = [
- { name: "9.3", href: "#" },
- { name: "9.2", href: "#" },
- { name: "9.1", href: "#" },
- { name: "9.0", href: "#" },
- { name: "8.9", href: "#" },
- { name: "8.8", href: "#" },
-]
-
-const Template: Story
- {isSidebarOpen !== undefined && onSidebarToggle !== undefined && (
- onSidebarToggle()}
- />
- )}
-
-
-
- {!!selectedVersionName && !!versions && (
-
-
- )}
-
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/LandingPageSecondaryNav/LandingPageSecondaryNav.stories.tsx b/src/ui/design-system/src/lib/Components/LandingPageSecondaryNav/LandingPageSecondaryNav.stories.tsx
deleted file mode 100644
index 624631e11b..0000000000
--- a/src/ui/design-system/src/lib/Components/LandingPageSecondaryNav/LandingPageSecondaryNav.stories.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { LandingPageSecondaryNav, LandingPageSecondaryNavProps } from "."
-
-export default {
- component: LandingPageSecondaryNav,
- title: "Components/LandingPageSecondaryNav",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
- {sections.map(({ elementId, title }, i) => (
-
- {title}
-
- ))}
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/LowerPageNav/LowerPageNavLink.stories.tsx b/src/ui/design-system/src/lib/Components/LowerPageNav/LowerPageNavLink.stories.tsx
deleted file mode 100644
index 3a775c672d..0000000000
--- a/src/ui/design-system/src/lib/Components/LowerPageNav/LowerPageNavLink.stories.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { LowerPageNav, LowerPageNavProps } from "."
-
-export default {
- component: LowerPageNav,
- title: "Components/LowerPageNav",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
-
- )}
-
-
- {next && (
-
- {next ? "Next" : "Prev"}
-
-
- {link.title}
-
-
-
- )}
-
- {prev ?
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Search/Autocomplete.tsx b/src/ui/design-system/src/lib/Components/Search/Autocomplete.tsx
deleted file mode 100644
index b9d4b54aa0..0000000000
--- a/src/ui/design-system/src/lib/Components/Search/Autocomplete.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import {
- AutocompleteState,
- BaseItem,
- createAutocomplete,
-} from "@algolia/autocomplete-core"
-import { getAlgoliaResults } from "@algolia/autocomplete-js"
-import { SearchClient } from "algoliasearch/lite"
-import clsx from "clsx"
-import { KeyboardEvent, useMemo, useRef, useState } from "react"
-import SearchIcon from "../../../../images/action/search.svg"
-import { Panel } from "./Panel"
-
-export type SearchProps = {
- appId: string
- apiKey: string
- indexName: string
-}
-
-export type HitType = BaseItem & {
- url: string
- title: string
- headers: string[]
- depth: number
-}
-
-export function Autocomplete({
- searchClient,
- indexName,
- closeDialog,
-}: {
- searchClient: SearchClient
- indexName: string
- closeDialog: () => void
-}) {
- const [autocompleteState, setAutocompleteState] =
- useState
- {/* @ts-expect-error */}
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Search/Item.tsx b/src/ui/design-system/src/lib/Components/Search/Item.tsx
deleted file mode 100644
index 6dadee4ae3..0000000000
--- a/src/ui/design-system/src/lib/Components/Search/Item.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import clsx from "clsx"
-import { Highlight, Snippet } from "react-instantsearch-hooks-web"
-import ChevronRightIcon from "../../../../images/arrows/chevron-right.svg"
-import DocumentIcon from "../../../../images/content/document.svg"
-import ExternalIcon from "../../../../images/content/external-link-square.svg"
-import { HitType } from "./Autocomplete"
-
-export function Item({ item, selected }: { item: HitType; selected: boolean }) {
- return (
-
-
- {item.depth > 1 ?
-
-
-
- {/* @ts-expect-error */}
-
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Search/KbdShortcut.tsx b/src/ui/design-system/src/lib/Components/Search/KbdShortcut.tsx
deleted file mode 100644
index 5a1189049d..0000000000
--- a/src/ui/design-system/src/lib/Components/Search/KbdShortcut.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React from "react"
-
-export type SearchProps = {
- appId: string
- apiKey: string
- indexName: string
-}
-
-export default function KbdShortcut({
- children,
-}: {
- children: React.ReactNode
-}) {
- return (
-
-
- {children}
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Search/Panel.tsx b/src/ui/design-system/src/lib/Components/Search/Panel.tsx
deleted file mode 100644
index 8fe4149b28..0000000000
--- a/src/ui/design-system/src/lib/Components/Search/Panel.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import { AutocompleteApi, AutocompleteState } from "@algolia/autocomplete-core"
-import clsx from "clsx"
-import React from "react"
-import { HitType } from "./Autocomplete"
-import { Item } from "./Item"
-import PanelShortcuts from "./PanelShortcuts"
-
-function CenteredMessage({ children }: { children: React.ReactNode }) {
- return (
-
- {children}
-
- )
-}
-
-export function Panel({
- autocomplete,
- autocompleteState,
-}: {
- autocomplete: AutocompleteApi<
- HitType,
- Event,
- MouseEvent,
- globalThis.KeyboardEvent
- >
- autocompleteState?: AutocompleteState
- {/* @ts-expect-error */}
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Search/PanelShortcuts.tsx b/src/ui/design-system/src/lib/Components/Search/PanelShortcuts.tsx
deleted file mode 100644
index 7bc2772a54..0000000000
--- a/src/ui/design-system/src/lib/Components/Search/PanelShortcuts.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react"
-import KbdDown from "../../../../images/misc/kbd-down.svg"
-import KbdEnter from "../../../../images/misc/kbd-enter.svg"
-import KbdEsc from "../../../../images/misc/kbd-esc.svg"
-import KbdUp from "../../../../images/misc/kbd-up.svg"
-import KbdShortcut from "./KbdShortcut"
-
-function ShortcutSection({
- text,
- children,
-}: {
- text: string
- children: React.ReactNode
-}) {
- return (
-
- {query && query?.length > 0 ? (
- <>
- {items.length > 0 && (
- 0 results }
-
- ) : (
- Search the docs
- )}
-
- -
- {items.map((item: HitType, index: number) => {
- const itemProps = autocomplete.getItemProps({
- item,
- source: collection!.source, // defined because `items` is defined
- })
- const selected = itemProps["aria-selected"]
- return (
- // @ts-expect-error
-
-
-
- -
- )
- })}
-
- {children}
-
- )
-}
-
-export default function PanelShortcuts() {
- return (
- {text}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Search/Search.stories.tsx b/src/ui/design-system/src/lib/Components/Search/Search.stories.tsx
deleted file mode 100644
index c8ec37f72f..0000000000
--- a/src/ui/design-system/src/lib/Components/Search/Search.stories.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import { Story, Meta } from "@storybook/react"
-import { Search, SearchProps } from "."
-
-export default {
- component: Search,
- title: "Components/Search",
-} as Meta
-
-const Template: Story
-
-
- ⌘
-
-
-
-
- K
-
-
-
- )
-}
-
-export function Search({ appId, apiKey, indexName }: SearchProps) {
- const [open, setOpen] = useState(false)
- const closeDialog = () => setOpen(false)
- const searchClient = useMemo(
- () => algoliasearch(appId, apiKey),
- [apiKey, appId]
- )
-
- const onKeyDown = useCallback(({ repeat, metaKey, ctrlKey, key }) => {
- if (repeat) return
- // Open search dialog with cmd+k or ctrl+k
- if ((metaKey || ctrlKey) && key === "k") setOpen((prev) => !prev)
- }, [])
-
- useEffect(() => {
- document.addEventListener("keydown", onKeyDown)
- return () => {
- document.removeEventListener("keydown", onKeyDown)
- }
- }, [onKeyDown])
-
- return (
- <>
-
-
-
-
-
-
-
- {header}
-{description}
-
-
- )
-}
-
-export default SocialLinksSignup
diff --git a/src/ui/design-system/src/lib/Components/StaticCheckbox/StaticCheckbox.stories.tsx b/src/ui/design-system/src/lib/Components/StaticCheckbox/StaticCheckbox.stories.tsx
deleted file mode 100644
index 775d42099f..0000000000
--- a/src/ui/design-system/src/lib/Components/StaticCheckbox/StaticCheckbox.stories.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { InputProps, StaticCheckbox } from "."
-
-export default {
- component: StaticCheckbox,
- title: "Components/StaticCheckbox",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
-
-
-
- {/** Temporarily disabling email capture */}
- {/*
-
- */}
- - Subscribe to our newsletter -
-
-
-
- Subscribe
-
-
-
- {checked ?
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/TabMenu/TabMenu.stories.tsx b/src/ui/design-system/src/lib/Components/TabMenu/TabMenu.stories.tsx
deleted file mode 100644
index 6b71554358..0000000000
--- a/src/ui/design-system/src/lib/Components/TabMenu/TabMenu.stories.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import TabMenu, { TabMenuProps } from "."
-
-export default {
- component: TabMenu,
- title: "Components/TabMenu",
-} as Meta
-
-const Template: Story
- {tabs.map(({ name, link }: Tab, index) => {
- const isCurrentIndex = link
- ? location.pathname === link
- : activeIndex === index
-
- const indicatorClasses = clsx(
- 'absolute bottom-0 w-full bg-black rounded-tr-lg rounded-tl-lg h-[6px] dark:bg-white',
- { block: isCurrentIndex, hidden: !isCurrentIndex }
- )
-
- if (link) {
- return (
-
-
- {name}
-
-
-
- )
- }
-
- return (
-
- )
-}
-
-export default TabMenu
diff --git a/src/ui/design-system/src/lib/Components/ToggleButton/ToggleButton.stories.tsx b/src/ui/design-system/src/lib/Components/ToggleButton/ToggleButton.stories.tsx
deleted file mode 100644
index 17fe84d425..0000000000
--- a/src/ui/design-system/src/lib/Components/ToggleButton/ToggleButton.stories.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { ToggleButton, ToggleButtonProps } from "."
-
-export default {
- component: ToggleButton,
- title: "Components/ToggleButton",
- args: {
- variant: "primary",
- },
- argTypes: {
- variant: {
- options: ["primary", "secondary"],
- control: { type: "select" },
- },
- },
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story {
- setActiveIndex(index)
- onTabChange(index, name)
- }}
- className={tabClasses}
- >
-
- {name}
-
-
-
- )
- })}
-
- Not selected
- Selected
-
- )
-}
-
-export const Default = Template.bind({})
-Default.args = {
- children: "ToggleButton",
-}
-export const defaultDark = Template.bind({})
-defaultDark.args = Default.args
-defaultDark.parameters = {
- backgrounds: {
- default: "dark",
- },
-}
diff --git a/src/ui/design-system/src/lib/Components/ToggleButton/index.tsx b/src/ui/design-system/src/lib/Components/ToggleButton/index.tsx
deleted file mode 100644
index 159c61ba82..0000000000
--- a/src/ui/design-system/src/lib/Components/ToggleButton/index.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react'
-import clsx from "clsx"
-import Close from "../../../../images/action/close.svg"
-
-export type ToggleButtonProps = React.ComponentPropsWithoutRef<"button"> & {
- isSelected?: boolean
-}
-
-export function ToggleButton({
- className,
- children,
- isSelected = false,
- ...props
-}: ToggleButtonProps) {
- return (
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/index.tsx b/src/ui/design-system/src/lib/Components/index.tsx
index c806ce6f75..fed5f6a0ce 100644
--- a/src/ui/design-system/src/lib/Components/index.tsx
+++ b/src/ui/design-system/src/lib/Components/index.tsx
@@ -9,9 +9,7 @@ export { default as NetworkDetailsCard } from './NetworkDetailsCard';
export { default as NetworkDiscordCard } from './NetworkDiscordCard';
export { default as Pagination } from './Pagination';
export { default as RoundImage } from './RoundImage';
-export { default as SocialLinksSignup } from './SocialLinksSignup';
export { default as SporksCard } from './SporksCard';
-export { default as TabMenu } from './TabMenu';
export { default as Tag } from './Tag';
export { UpcomingEvents } from './UpcomingEvents';
export { HomepageStartList } from './HomepageStartList';
diff --git a/src/ui/design-system/src/lib/Components/shared/DropdownArrow.tsx b/src/ui/design-system/src/lib/Components/shared/DropdownArrow.tsx
deleted file mode 100644
index be55e13ac1..0000000000
--- a/src/ui/design-system/src/lib/Components/shared/DropdownArrow.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import clsx from "clsx"
-import { MutableRefObject } from "react"
-import DropdownArrowIcon from "../../../../images/misc/dropdown-arrow.svg"
-import DropdownTransition from "./DropdownTransition"
-
-export default function DropdownArrow({
- x,
- y,
- arrowRef,
- open,
-}: {
- x?: number
- y?: number
- arrowRef: MutableRefObject
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/shared/DropdownTransition.tsx b/src/ui/design-system/src/lib/Components/shared/DropdownTransition.tsx
deleted file mode 100644
index 316850b3f2..0000000000
--- a/src/ui/design-system/src/lib/Components/shared/DropdownTransition.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Transition } from "@headlessui/react"
-import React from "react"
-
-export default function DropdownTransition({
- children,
-}: {
- children: React.ReactNode
-}) {
- return (
-
-
-
- )}
-
-
-
- setMobileSidebarOpen(!isMobileSidebarOpen)}
- items={breadcrumbs}
- editPageUrl={editPageUrl}
- />
-
- {header &&
- setMobileSidebarOpen(false)}
- />
-
-
-
-
- {sidebarItems && (
- <>
-
-
- )}
- {children}
-
-
-
- )}
-
-
-
- {toc && (
-
-
-
- )}
- {children}
-
-
-
- )}
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Pages/InternalPage/useInternalBreadcrumbs.ts b/src/ui/design-system/src/lib/Pages/InternalPage/useInternalBreadcrumbs.ts
deleted file mode 100644
index 7ce9b0fc1a..0000000000
--- a/src/ui/design-system/src/lib/Pages/InternalPage/useInternalBreadcrumbs.ts
+++ /dev/null
@@ -1,63 +0,0 @@
-import { useMemo } from "react"
-
-export type UseInternalBreadcrumbsOptions = {
- /**
- * The currently active item taken from the sidebar configuration object.
- */
- activeItem?: {
- href: string
- title: string
- }
-
- /**
- * An array of additional possible breadcrumnbs. If any match the
- * `activeItem` they will be included.
- */
- additionalitems?: Array<{
- href: string
- title: string
- }>
-
- /**
- * THe name to display in the breadcrumbs for the current collection
- */
- collectionDisplayName: string
-
- /**
- * The root path for the current collection
- */
- collectionRootPath: string
-}
-
-/**
- * Returns a list of breadcrumbs to display based on the current `activeItem`
- * and doc collection.
- */
-export const useInternalBreadcrumbs = ({
- activeItem,
- additionalitems,
- collectionDisplayName,
- collectionRootPath,
-}: UseInternalBreadcrumbsOptions) =>
- useMemo(() => {
- const breadcrumbs = [
- { href: "/", title: "Home" },
- { href: collectionRootPath, title: collectionDisplayName },
- ]
-
- // Add any additional items that match the active item.
- additionalitems?.forEach((item) => {
- if (activeItem?.href?.startsWith(item.href)) {
- breadcrumbs.push(item)
- }
- })
-
- // Make sure items are sorted from least-specific to most-specific
- breadcrumbs.sort((a, b) => a.href.length - b.href.length)
-
- if (activeItem) {
- breadcrumbs.push(activeItem)
- }
-
- return breadcrumbs
- }, [activeItem, additionalitems, collectionDisplayName, collectionRootPath])
diff --git a/src/ui/design-system/src/lib/Pages/NetworkDetailPage/index.tsx b/src/ui/design-system/src/lib/Pages/NetworkDetailPage/index.tsx
index 82e0e574bc..f20381618e 100644
--- a/src/ui/design-system/src/lib/Pages/NetworkDetailPage/index.tsx
+++ b/src/ui/design-system/src/lib/Pages/NetworkDetailPage/index.tsx
@@ -6,7 +6,6 @@ import {
Pagination,
SocialLinksSignup,
SporksCard,
- // TabMenu,
} from '../../Components'
import AppLink from '../../Components/AppLink'
import { FeaturedArticle } from '../../Components/FeaturedArticleSlider'
@@ -53,7 +52,6 @@ const NetworkDetailPage = ({
- setMobileSidebarOpen(!isMobileSidebarOpen)}
- items={breadcrumbs}
- editPageUrl={editPageUrl}
- />
-
- {header &&
- setMobileSidebarOpen(false)}
- />
-
-
-
-
- {sidebarItems && (
- <>
-
-
- )}
-
- {toc && (
-
-
-
-
- )}
-
-
-
- {toc && (
-
-
-
- )}
- {children}
-
{networkName}
diff --git a/src/utils/fetch-discourse-api.ts b/src/utils/fetch-discourse-api.ts
deleted file mode 100644
index 70577623d8..0000000000
--- a/src/utils/fetch-discourse-api.ts
+++ /dev/null
@@ -1,223 +0,0 @@
-import {
- type ForumCellProps,
- type User,
-} from '../ui/design-system/src/lib/Components/ForumCell';
-import {
- DISCOURSE_API_URL,
- DISCOURSE_BREAKING_CHANGES_URL,
- DISCOURSE_LATEST_TOPICS_URL,
- DISCOURSE_MAINNET_SPORK_URL,
-} from './constants';
-
-export interface TopicsUser {
- id: number;
- username: string;
- name: string;
- avatar_template: string;
-}
-
-export interface DiscourseTopicsResponse {
- users: TopicsUser[];
- primary_groups: any[];
- topic_list: TopicList;
-}
-
-export interface TopicList {
- can_create_topic: boolean;
- per_page: number;
- top_tags: any[];
- topics: Topic[];
-}
-
-export interface Topic {
- id: number;
- title: string;
- fancy_title: string;
- slug: string;
- posts_count: number;
- reply_count: number;
- highest_post_number: number;
- image_url: string;
- created_at: string;
- last_posted_at: string;
- bumped: boolean;
- bumped_at: string;
- archetype: string;
- unseen: boolean;
- pinned: boolean;
- unpinned: string;
- excerpt: string;
- visible: boolean;
- closed: boolean;
- archived: boolean;
- bookmarked: string;
- liked: string;
- views: number;
- like_count: number;
- has_summary: boolean;
- last_poster_username: string;
- category_id: number;
- pinned_globally: boolean;
- featured_link: string;
- posters: any;
-}
-
-interface CategoryResponse {
- category: Category;
-}
-
-interface Category {
- id: number;
- name: string;
- color: string;
- text_color: string;
- slug: string;
- topic_count: number;
- post_count: number;
- position: number;
- description: string;
- description_text: string;
- description_excerpt: string;
- topic_url: string;
- read_restricted: boolean;
- permission: number;
- notification_level: number;
- can_edit: boolean;
- topic_template: string;
- has_children: string;
- sort_order: string;
- sort_ascending: string;
- show_subcategory_list: boolean;
- num_featured_topics: number;
- default_view: string;
- subcategory_list_style: string;
- default_top_period: string;
- default_list_filter: string;
- minimum_required_tags: number;
- navigate_to_first_post_after_read: boolean;
- custom_fields: any;
- allowed_tags: any[];
- allowed_tag_groups: any[];
- allow_global_tags: boolean;
- required_tag_groups: any;
- read_only_banner: string;
- available_groups: any[];
- auto_close_hours: string;
- auto_close_based_on_last_post: boolean;
- allow_unlimited_owner_edits_on_first_post: boolean;
- default_slow_mode_seconds: string;
- group_permissions: any;
- email_in: string;
- email_in_allow_strangers: boolean;
- mailinglist_mirror: boolean;
- all_topics_wiki: boolean;
- can_delete: boolean;
- allow_badges: boolean;
- topic_featured_link_allowed: boolean;
- search_priority: number;
- uploaded_logo: string;
- uploaded_background: string;
-}
-
-const createForumLink = (
- topicSlug: string,
- topicId: number,
- highestPostNumber: number,
-): string =>
- [
- DISCOURSE_API_URL,
- 't',
- topicSlug,
- topicId.toString(),
- highestPostNumber.toString(),
- ].join('/');
-
-const convertToUser = (username: string, displayUrl: string) =>
- ({
- profileImage:
- displayUrl ??
- 'https://github.githubassets.com/images/modules/logos_page/GitHub-Mark.png',
- name: username,
- } as User);
-
-const convertTopicToForumCellProps = async (topic: Topic) =>
- ({
- numComments: topic.highest_post_number - 1,
- heading: topic.fancy_title,
- subheading: await fetchCategoryById(topic.category_id),
- participants: [convertToUser(topic.last_poster_username, topic.image_url)],
- lastUpdatedDate: topic.last_posted_at, // "YYYY-MM-DDTHH:MM:SS.XXXZ"
- forumLink: createForumLink(topic.slug, topic.id, topic.highest_post_number),
- } as ForumCellProps);
-
-const formatLatestFiveTopics = async (topics: Topic[]) => {
- const fiveTopics = topics.slice(0, 5);
- const formattedTopics = fiveTopics.map(async (topic) => {
- const props = convertTopicToForumCellProps(topic);
- return await props;
- });
-
- const props = await Promise.all(formattedTopics);
- return props;
-};
-const fetchDiscourse = async
- Permissionless deployment is coming to Flow! Read more{" "}
-
- here
-
-
-
- {children}
-
- )
-}
From ac922a8256375fdf31ac8946f7e161da44087cad Mon Sep 17 00:00:00 2001
From: Alex Ni <12097569+nialexsan@users.noreply.github.com>
Date: Mon, 30 Oct 2023 15:38:03 -0400
Subject: [PATCH 04/11] clean up
---
.../src/lib/Components/Dialog/index.tsx | 40 -------------------
1 file changed, 40 deletions(-)
delete mode 100644 src/ui/design-system/src/lib/Components/Dialog/index.tsx
diff --git a/src/ui/design-system/src/lib/Components/Dialog/index.tsx b/src/ui/design-system/src/lib/Components/Dialog/index.tsx
deleted file mode 100644
index 9a3d358910..0000000000
--- a/src/ui/design-system/src/lib/Components/Dialog/index.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { Dialog as HeadlessDialog } from "@headlessui/react"
-import React from "react"
-
-export function Dialog({
- open,
- closeDialog,
- maxWidth,
- children,
-}: {
- open: boolean
- closeDialog: () => void
- maxWidth?: string
- children: React.ReactNode
-}) {
- return (
-
- {children}
-
-
+
+
+
+
+
+ {header}
+{description}
+
+
+ )
+}
+
+export default SocialLinksSignup
diff --git a/src/ui/design-system/src/lib/Components/index.tsx b/src/ui/design-system/src/lib/Components/index.tsx
index fed5f6a0ce..6c42beac9f 100644
--- a/src/ui/design-system/src/lib/Components/index.tsx
+++ b/src/ui/design-system/src/lib/Components/index.tsx
@@ -9,6 +9,7 @@ export { default as NetworkDetailsCard } from './NetworkDetailsCard';
export { default as NetworkDiscordCard } from './NetworkDiscordCard';
export { default as Pagination } from './Pagination';
export { default as RoundImage } from './RoundImage';
+export { default as SocialLinksSignup } from './SocialLinksSignup';
export { default as SporksCard } from './SporksCard';
export { default as Tag } from './Tag';
export { UpcomingEvents } from './UpcomingEvents';
diff --git a/src/ui/design-system/src/lib/Pages/HomePage/index.tsx b/src/ui/design-system/src/lib/Pages/HomePage/index.tsx
index 1a4cdd6f3c..b8577729df 100644
--- a/src/ui/design-system/src/lib/Pages/HomePage/index.tsx
+++ b/src/ui/design-system/src/lib/Pages/HomePage/index.tsx
@@ -44,7 +44,6 @@ const HomePage = ({
upcomingEvents,
}: HomePageProps): JSX.Element => {
- console.log({homepageStartProjectData})
return (
+
+
+
+ {/** Temporarily disabling email capture */}
+ {/*
+
+ */}
+ + Subscribe to our newsletter +
+
+
+
+ Subscribe
+
+
+
- 
-
-
-
- {heading}
-
-
-
-
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/FeatureLinkBlock/FeatureLinkBlock.stories.tsx b/src/ui/design-system/src/lib/Components/FeatureLinkBlock/FeatureLinkBlock.stories.tsx
deleted file mode 100644
index 0efe1bd3bd..0000000000
--- a/src/ui/design-system/src/lib/Components/FeatureLinkBlock/FeatureLinkBlock.stories.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { FeatureLinkBlock, FeatureLinkBlockProps } from "."
-import FclIconSrc from "../../../../images/tools/tool-fcl.svg"
-
-export default {
- component: FeatureLinkBlock,
- title: "Components/FeatureLinkBlock",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
-
-
-
- {title}
- {subtitle}
- {actions}
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/FlipCell/index.tsx b/src/ui/design-system/src/lib/Components/FlipCell/index.tsx
deleted file mode 100644
index 4962f69781..0000000000
--- a/src/ui/design-system/src/lib/Components/FlipCell/index.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import CalendarIcon from "../../../../images/action/date-calendar.svg"
-import CommentIcon from "../../../../images/arrows/message-circle.svg"
-import AppLink from "../AppLink"
-import RoundImage from "../RoundImage"
-import Tag from "../Tag"
-
-export type User = {
- profileImage: string
- name: string
-}
-
-export type FlipCellProps = {
- numComments: number
- heading: string
- tags: string[]
- repository: string
- participant: User
- date: string
- forumLink: string
-}
-
-const FlipCell = ({
- heading,
- tags,
- participant,
- repository,
- numComments,
- date,
- forumLink,
-}: FlipCellProps) => {
- return (
-
-
- {ctaText}
-
-
-
- 
-
- {title}
-- {description} -
-
- {links.map(({ title, href }, index) => (
-
- {title}
- {isLinkExternal(href) ?
- ))}
-
-
-
-
-
-
- {heading}
- - {tags.map((tag) => ( -
-
-
-
-
-
-
-
-
-
-
-)
-
-const FlipCell = ({
- heading,
- tags,
- repository,
- participant,
- numComments,
- date,
- forumLink,
-}: FlipCellProps) => {
- return (
- Topic
-
-
- Submitted by
- Repository
- Date submitted
- Comments
-
-
-
-
-
- - {heading} -
-
- {tags.map((tag) => (
-
-
-
-
-
-
-
-
- {repository}
-
-
-
-
-
-
- 
-
-)
-
-export default RoundImage
diff --git a/src/ui/design-system/src/lib/Components/Flips/index.tsx b/src/ui/design-system/src/lib/Components/Flips/index.tsx
deleted file mode 100644
index 4283a1b8ce..0000000000
--- a/src/ui/design-system/src/lib/Components/Flips/index.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import React, { useState } from 'react';
-import { ButtonLink } from '../Button';
-import { HeaderWithLink } from '../HeaderWithLink';
-import FlipCell, { FlipCellHeader, type FlipCellProps } from './FlipCell';
-
-export interface FlipsProps {
- goodPlacesToStartFlips: FlipCellProps[];
- headerLink?: string;
- openFlips: FlipCellProps[];
-}
-
-export default function Flips({
- goodPlacesToStartFlips,
- headerLink = '',
- openFlips,
-}: FlipsProps): JSX.Element {
- const [selectedTab] = useState(0);
- const flips: [FlipCellProps[], FlipCellProps[]] = [
- openFlips,
- goodPlacesToStartFlips,
- ];
-
- return (
-
-
-
- {imageCaption}
-
-
-
- );
-}
diff --git a/src/ui/design-system/src/lib/Components/LinkCard3Column/LinkCard3Column.stories.tsx b/src/ui/design-system/src/lib/Components/LinkCard3Column/LinkCard3Column.stories.tsx
deleted file mode 100644
index cbf4ac800c..0000000000
--- a/src/ui/design-system/src/lib/Components/LinkCard3Column/LinkCard3Column.stories.tsx
+++ /dev/null
@@ -1,111 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { LinkCard3Column, LinkCard3ColumnProps } from "."
-import EcosystemIcon from "../../../../images/content/ecosystem.svg"
-import SDKIcon from "../../../../images/content/sdk.svg"
-import UseCaseIcon from "../../../../images/content/use-cases.svg"
-
-export default {
- component: LinkCard3Column,
- title: "Components/LinkCard3Column",
- parameters: {
- layout: "centered",
- },
-} as Meta
-
-const Template: Story
-
- FLIPs
-
-
- Go to GitHub
-
-
- - Flow improvement proposals can be submitted through a PR and are - intended to propose changes to Flow's network and standards -
-
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Pagination/Pagination.stories.tsx b/src/ui/design-system/src/lib/Components/Pagination/Pagination.stories.tsx
deleted file mode 100644
index 60c59d6a8d..0000000000
--- a/src/ui/design-system/src/lib/Components/Pagination/Pagination.stories.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import Pagination, { PaginationProps } from "."
-
-export default {
- component: Pagination,
- title: "Components/Pagination",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
- {items.map((item, index) => (
-
-
-
- ))}
- {items.map((item, index) => (
- - {item.icon && ( - - {item.icon} - - )} - {item.title} -
-- {item.description} -
-
- {item.links?.map((link) => (
-
- ))}
-
-
-
-
-
- ))}
-
- {link.title}
-
-
- {isLinkExternal(link.href) ? (
- // "artificial" centering due to viewbox adding padding
-
-
-
- ) : (
-
- {link.tags?.map((tag) => (
-
-
-
-
- {
- const value = +e.target.value
-
- if (!Number.isFinite(value) || value < 1 || value > pageCount) {
- return
- }
-
- setPage(value)
- }}
- />
- of {pageCount}
-
-
- )
-}
-
-export default Pagination
diff --git a/src/ui/design-system/src/lib/Components/ProjectCard/ProjectCard.stories.tsx b/src/ui/design-system/src/lib/Components/ProjectCard/ProjectCard.stories.tsx
deleted file mode 100644
index 90c8c33277..0000000000
--- a/src/ui/design-system/src/lib/Components/ProjectCard/ProjectCard.stories.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import ProjectCard, { ProjectCardProps } from "."
-
-export default {
- component: ProjectCard,
- title: "Components/ProjectCard",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
- 
-
- )
-}
-
-export default ProjectCard
diff --git a/src/ui/design-system/src/lib/Components/ProjectCards/ProjectCards.stories.tsx b/src/ui/design-system/src/lib/Components/ProjectCards/ProjectCards.stories.tsx
deleted file mode 100644
index 4df1eb6c72..0000000000
--- a/src/ui/design-system/src/lib/Components/ProjectCards/ProjectCards.stories.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import ProjectCards, { ProjectCardsProps } from "."
-import { ProjectCardProps } from "../ProjectCard"
-// import { Default as DefaultProjectCard } from "../ProjectCard/ProjectCard.stories"
-
-export default {
- component: ProjectCards,
- title: "Components/ProjectCards",
- parameters: {
- layout: "centered",
- },
-} as Meta
-
-const Template: Story
-
- Learn More
-
-
- {heading}
-
- {tags.map((tag) => (
-
-
-
-
-
-
- 
- {author.name}
-
-
-
-
-
- {numStars}
- {description}
-
-
- Featured Initiatives
-
-
- )
-}
-
-export default ProjectCards
diff --git a/src/ui/design-system/src/lib/Components/RoundImage/RoundImage.stories.tsx b/src/ui/design-system/src/lib/Components/RoundImage/RoundImage.stories.tsx
deleted file mode 100644
index 2170975d24..0000000000
--- a/src/ui/design-system/src/lib/Components/RoundImage/RoundImage.stories.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import RoundImage, { RoundImageProps } from "."
-
-export default {
- component: RoundImage,
- title: "Components/RoundImage",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
- {projects.map((project, index) => (
-
- Submit a Project
-
-
- Go to Github
-
-
-
- 
- 
-
-
-
- {title}
-
-
-
- {authorIcon && (
-
- {stars !== undefined && (
-
-
-
- )}
- {authorName && (
-
- {authorName}
-
- )}
-
-
- )}
-
- {stars}
-
-
- {tags?.map((tag, i) => (
-
- {description ? (
-
- {description}
-
- ) : (
-
- {lastRelease && (
-
- )}
-
-
- )}
- {lastCommit && (
- {lastRelease} days ago
-
-
- )}
-
-
- View All SDKs
- */}
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/Time/index.tsx b/src/ui/design-system/src/lib/Components/Time/index.tsx
deleted file mode 100644
index 7e8df3b0c0..0000000000
--- a/src/ui/design-system/src/lib/Components/Time/index.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import { format as formatDate, parseISO } from "date-fns"
-import { ReactNode } from "react"
-
-export interface TimeProps {
- /**
- * The date value as an ISO 8601 string.
- */
- value: string
-
- /**
- * The output format.
- * @see {@link https://date-fns.org/v2.29.2/docs/format}
- */
- format?: string
-
- /**
- * A fallback component to render if parsing fails.
- */
- fallback?: ReactNode | undefined
-}
-
-export function Time({ value, format = "P", fallback = null }: TimeProps) {
- let date: Date | undefined = undefined
-
- try {
- date = parseISO(value)
- } catch (error) {
- return <>{fallback}
- }
-
- // TODO: rendering formatting strings on the server and then hydrating
- // on the client can cause "prop mismatch" warnings from react due to
- // the server possibly being in a different timezone/locale. Is there a
- // good way to mitigate these?
-
- return (
-
- )
-}
diff --git a/src/ui/design-system/src/lib/Components/ToolCard/ToolCard.stories.tsx b/src/ui/design-system/src/lib/Components/ToolCard/ToolCard.stories.tsx
deleted file mode 100644
index 7313f4dded..0000000000
--- a/src/ui/design-system/src/lib/Components/ToolCard/ToolCard.stories.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { Meta, Story } from "@storybook/react"
-import { ToolCard, ToolCardProps } from "."
-
-export default {
- component: ToolCard,
- title: "Components/ToolCard",
- parameters: {
- layout: "padded",
- },
-} as Meta
-
-const Template: Story
-
- View All SDKs
-
- )}
-
-
- {header && (
-
- {header}
-
- )}
- {description && (
-
- {showViewAll && (
- - {description} -
- )} -
- {cards.map((sdkCard, i) => (
-
- {/* hidden for now */}
- {/*
-
-
-
-
-
- {title}
-
-
-
- {Boolean(authorIcon) && (
-
- {stars !== undefined && (
-
-
-
- )}
- {Boolean(authorName) && (
-
- {authorName}
-
- )}
-
-
- )}
-
- {stars}
-
-
- {tags?.map((tag, i) => (
-
-
- {description}
-
-
-
-
- )
- }
-)
-
-TutorialCard.displayName = "TutorialCard"
-
-export default TutorialCard
diff --git a/src/ui/design-system/src/lib/Components/index.tsx b/src/ui/design-system/src/lib/Components/index.tsx
index 6c42beac9f..fb44ef0b41 100644
--- a/src/ui/design-system/src/lib/Components/index.tsx
+++ b/src/ui/design-system/src/lib/Components/index.tsx
@@ -1,14 +1,9 @@
-export { default as AnnouncementCard } from './AnnouncementCard';
export { default as FeaturedArticleSlider } from './FeaturedArticleSlider';
-export { default as Flips } from './Flips';
export { LandingHeaderHome } from './LandingHeaderHome';
export { LinkCard2Column } from './LinkCard2Column';
-export { LinkCard3Column } from './LinkCard3Column';
export { default as NetworkCard } from './NetworkCard';
export { default as NetworkDetailsCard } from './NetworkDetailsCard';
export { default as NetworkDiscordCard } from './NetworkDiscordCard';
-export { default as Pagination } from './Pagination';
-export { default as RoundImage } from './RoundImage';
export { default as SocialLinksSignup } from './SocialLinksSignup';
export { default as SporksCard } from './SporksCard';
export { default as Tag } from './Tag';
diff --git a/src/ui/design-system/src/lib/Pages/GettingStartedPage/GettingStartedPage.stories.tsx b/src/ui/design-system/src/lib/Pages/GettingStartedPage/GettingStartedPage.stories.tsx
deleted file mode 100644
index 0b78227f2d..0000000000
--- a/src/ui/design-system/src/lib/Pages/GettingStartedPage/GettingStartedPage.stories.tsx
+++ /dev/null
@@ -1,402 +0,0 @@
-import React from 'react'
-import { type Meta, type Story } from '@storybook/react'
-import { GettingStartedPage, type GettingStartedPageProps } from '.'
-
-export const Icon1 = () => (
-
-)
-
-export const Icon2 = () => (
-
-)
-
-export const Icon3 = () => (
-
-)
-
-const gettingStartedPageData = {
- discordUrl: 'https://onflow.org/discord',
- discourseUrl: 'https://forum.onflow.org/',
- githubUrl: 'https://github.com/onflow',
- twitterUrl: 'https://twitter.com/flow_blockchain',
- landingHeaderItems: {
- buttonText: 'Button Text',
- buttonUrl: '#changeme',
- callout: 'Featured callout here two lines',
- discordUrl: 'https://onflow.org/discord',
- githubUrl: 'https://github.com/onflow',
- description:
- 'Lorem ipsum dolor sit amet proin gravida lorem ipsum dolor sit.',
- title: 'Getting Started',
- },
- linkCard3ColumnItems: {
- items: [
- {
- title: 'Try Flow',
- description:
- 'A package used to interact with user wallets and the Flow blockchain.',
- icon:
-
- {heading}
-
- {tags.map((tag) => (
-
-
-
- {description}
-
-
-
-
- {lastUpdated && (
-
- {author && (
-
-
- )}
- {level && (
-
-
- )}
-
-
- )}
-
-
-
-
- First Steps
-
-
-
-
-
-
- Recent Articles
-
-
-
-
- Recent Tools
-
-
- View All Tools
-
-
-
-
- {recentArticleItems.map((recentArticleItem, index) => (
-
-
-
- {recentToolItems.map((toolProps, i) => (
-
- View All Tools
-
-
-
-
- Live updates
-
-
-
- {discordNetworkCards.map((discordNetworkCards) => (
-
-
-
- ))}
-
-
- Announcements
-
-
-
- {announcementCards.map((announcementCardProps) => (
-
-
-
- ))}
-
{items.map((itemData: HomepageStartItemProps, index: number) => (