Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Reorganize portal landing page sections #5745

Merged
merged 1 commit into from
Dec 18, 2024
Merged

feat: Reorganize portal landing page sections #5745

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
109 changes: 46 additions & 63 deletions apps/portal/src/app/connect/page.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,10 @@ import {
OpenSourceCard,
Stack,
ConnectCard,
SDKCard,
Callout
} from "@doc";
import { TypeScriptIcon, ReactIcon, DotNetIcon, UnityIcon, UnrealEngineIcon } from "@/icons";
import { cn } from "@/lib/utils";
import Link from "next/link";
import { Button } from "@/components/ui/button";
Expand Down Expand Up @@ -36,24 +38,51 @@ Connect is the complete toolkit for connecting every user to your application. I
title="Playground"
href="https://playground.thirdweb.com"
iconUrl="/icons/connect/intros/demo.svg"
isExternal={true}
/>
<ConnectCard
title="Quickstart"
href="https://portal.thirdweb.com/react/v5/getting-started"
title="Templates"
href="https://thirdweb.com/templates"
iconUrl="/icons/connect/intros/quickstart.svg"
/>
{/* <ConnectCard
title="Why Connect?"
href=""
iconUrl="/icons/connect/intros/why-connect.svg"
/>
<ConnectCard
title="Video Tutorial"
href=""
iconUrl="/icons/connect/intros/video-tutorial.svg"
/> */}
</div>
### With Connect, you can:

### Quick starts

<Grid>
<SDKCard
title="TypeScript"
href="/typescript/v5/getting-started"
icon={TypeScriptIcon}
/>
<SDKCard
title="React"
href="/react/v5/getting-started"
icon={ReactIcon}
/>
<SDKCard
title="React Native"
href="/react-native/v5/getting-started"
icon={ReactIcon}
/>
<SDKCard
title="DotNet"
href="/dotnet/getting-started"
icon={DotNetIcon}
/>
<SDKCard
title="Unity"
href="/unity/v5/getting-started"
icon={UnityIcon}
/>
<SDKCard
title="Unreal Engine"
href="/unreal-engine/getting-started"
icon={UnrealEngineIcon}
/>
</Grid>

### With Connect, you can

- **Connect to 350+ different wallet providers** with support for every EVM network
- **Log in and authenticate your users** with customizable and secure [email, phone, passkeys and social login](https://portal.thirdweb.com/connect/in-app-wallet/overview) flows.
Expand Down Expand Up @@ -82,59 +111,13 @@ Connect is the complete toolkit for connecting every user to your application. I

Connect is supported on every EVM compatible chain. To view the full list, visit [thirdweb chainlist](https://thirdweb.com/chainlist).

### Templates
### Starter Kits & demos

<ExpandableGrid>
View all available starter kits, demos and templates on Github.

<GithubTemplateCard
title="Next Starter"
href="https://github.com/thirdweb-example/next-starter"
tag="Starter"
/>
<GithubTemplateCard
title="Vite Starter"
href="https://github.com/thirdweb-example/vite-starter"
title="View all templates"
href="https://github.com/thirdweb-example"
tag="Starter"
/>
<GithubTemplateCard
title="Node Starter"
href="https://github.com/thirdweb-example/node-starter"
tag="Starter"
/>
<GithubTemplateCard
title="Expo Starter"
href="https://github.com/thirdweb-example/expo-starter"
tag="Starter"
/>

<GithubTemplateCard
title="NFT Marketplace"
href="https://github.com/thirdweb-example/marketplace-v3"
tag="Builds"
/>

<GithubTemplateCard
title="Auth - NextJS"
href="https://github.com/thirdweb-example/thirdweb-auth-next"
tag="Example"
/>

<GithubTemplateCard
title="Auth - Express"
href="https://github.com/thirdweb-example/thirdweb-auth-express"
tag="Example"
/>

<GithubTemplateCard
title="Account Abstraction"
href="https://github.com/thirdweb-example/account-abstraction"
tag="Example"
/>

<GithubTemplateCard
title="Sign in with Farcaster"
href="https://github.com/thirdweb-example/thirdweb-siwf"
tag="Example"
/>

</ExpandableGrid>
98 changes: 36 additions & 62 deletions apps/portal/src/app/connect/sidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import type { SideBar } from "@/components/Layouts/DocLayout";
import { DotNetIcon, ReactIcon, TypeScriptIcon, UnityIcon } from "@/icons";
import { ExternalLink, ZapIcon } from "lucide-react";
import { ExternalLink } from "lucide-react";
import { UnrealEngineIcon } from "../../icons/sdks/UnrealEngineIcon";

// TODO: move the following two slugs to walletSlug with updated docs
Expand All @@ -23,11 +23,6 @@ export const sidebar: SideBar = {
name: "Why thirdweb?",
href: "/connect/why-thirdweb",
},
{
name: "Quickstart",
href: "/connect/quickstart",
icon: <ZapIcon />,
},
{
name: "Playground",
href: "https://playground.thirdweb.com/",
Expand Down Expand Up @@ -188,29 +183,6 @@ export const sidebar: SideBar = {
name: "Sponsorship rules",
href: `${aAslug}/sponsorship-rules`,
},
// {
// name: "References",
// isCollapsible: true,
// expanded: true,
// links: [
// {
// name: "React",
// href: `/references/typescript/v5/smartWallet`,
// },
// {
// name: "React Native",
// href: `/react-native/v0/wallets/smartwallet`,
// },
// {
// name: "TypeScript",
// href: `/references/wallets/v2/SmartWallet`,
// },
// {
// name: "Unity",
// href: `/unity/wallets/providers/smart-wallet`,
// },
// ],
// },
{
name: "FAQs",
href: `${aAslug}/faq`,
Expand Down Expand Up @@ -375,40 +347,42 @@ export const sidebar: SideBar = {
},
],
},
],
},
{ separator: true },
{
name: "API References",
isCollapsible: false,
links: [
{
name: "API References",
links: [
{
name: "TypeScript",
href: "/typescript/v5",
icon: <TypeScriptIcon />,
},
{
name: "React",
href: "/react/v5",
icon: <ReactIcon />,
},
{
name: "React Native",
href: "/react-native/v5",
icon: <ReactIcon />,
},
{
name: "Dotnet",
href: "/dotnet",
icon: <DotNetIcon />,
},
{
name: "Unity",
href: "/unity",
icon: <UnityIcon />,
},
{
name: "Unreal Engine",
href: "/unreal-engine",
icon: <UnrealEngineIcon />,
},
],
name: "TypeScript",
href: "/typescript/v5",
icon: <TypeScriptIcon />,
},
{
name: "React",
href: "/react/v5",
icon: <ReactIcon />,
},
{
name: "React Native",
href: "/react-native/v5",
icon: <ReactIcon />,
},
{
name: "Dotnet",
href: "/dotnet",
icon: <DotNetIcon />,
},
{
name: "Unity",
href: "/unity",
icon: <UnityIcon />,
},
{
name: "Unreal Engine",
href: "/unreal-engine",
icon: <UnrealEngineIcon />,
},
],
},
Expand Down
Loading
Loading