chore(pages): use Constants.gateways.ipfs for hardcoded ipfs links

This commit is contained in:
Aminejv 2023-01-16 11:58:53 +01:00
parent bb5d770c1e
commit adc369ec3e
13 changed files with 1071 additions and 89 deletions

View File

@ -1,11 +1,11 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import Head from "next/head";
export default class WebsitePrototypeWrapper extends React.Component {
static defaultProps = {
image:
"https://slate.textile.io/ipfs/bafybeihtmqpx2lnlvaerfhq5imi2y3jzuf4jqspmmqbth3ebim4ebc2lqy",
image: `${Constants.gateways.ipfs}/bafybeihtmqpx2lnlvaerfhq5imi2y3jzuf4jqspmmqbth3ebim4ebc2lqy`,
title: "Slate",
url: "https://slate.host/_",
description:

View File

@ -12,9 +12,6 @@ import { RadioGroup } from "~/components/system/components/RadioGroup";
import { css } from "@emotion/react";
import { ConfirmationModal } from "~/components/core/ConfirmationModal";
const DEFAULT_IMAGE =
"https://slate.textile.io/ipfs/bafkreiaow45dlq5xaydaeqocdxvffudibrzh2c6qandpqkb6t3ahbvh6re";
const STYLES_HEADER = css`
font-family: ${Constants.font.semiBold};
`;

View File

@ -12,8 +12,7 @@ import WebsitePrototypeHeader from "~/components/core/WebsitePrototypeHeader";
import WebsitePrototypeFooter from "~/components/core/WebsitePrototypeFooter";
import CTATransition from "~/components/core/CTATransition";
const DEFAULT_IMAGE =
"https://slate.textile.io/ipfs/bafkreiaow45dlq5xaydaeqocdxvffudibrzh2c6qandpqkb6t3ahbvh6re";
const DEFAULT_IMAGE = `${Constants.gateways.ipfs}/bafkreiaow45dlq5xaydaeqocdxvffudibrzh2c6qandpqkb6t3ahbvh6re`;
export const getServerSideProps = async (context) => {
return {

121
pages/about.js Normal file
View File

@ -0,0 +1,121 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as SVGLogo from "~/common/logo";
import * as SVG from "~/common/svg";
import * as System from "~/components/system";
import * as Validations from "~/common/validations";
import * as Strings from "~/common/strings";
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
import WebsiteHeader from "~/components/core/WebsiteHeader";
import WebsiteFooter from "~/components/core/WebsiteFooter";
import { css } from "@emotion/react";
const STYLES_ROOT = css`
width: 100%;
height: 100%;
min-height: calc(100vh - 61px);
background-color: ${Constants.semantic.bgLight};
color: ${Constants.semantic.textBlack};
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@media (max-width: ${Constants.sizes.mobile}px) {
min-height: calc(100vh - 112px);
}
`;
const STYLES_CONTAINER = css`
max-width: 700px;
margin: 0 auto;
padding: 24px 0 96px 0;
@media (max-width: ${Constants.sizes.mobile}px) {
max-width: 480px;
padding: 16px 16px 32px 16px;
}
`;
const STYLES_HEADING = css`
flex-shrink: 0;
color: ${Constants.semantic.textBlack};
flex-shrink: 0;
min-width: 50%;
max-width: 100%;
`;
const STYLES_HEADING1 = css`
${STYLES_HEADING};
font-family: ${Constants.font.bold};
font-size: 88px;
line-height: 88px;
letter-spacing: -0.05em;
margin-bottom: 25px;
@media (max-width: ${Constants.sizes.tablet}px) {
font-size: 64px;
line-height: 68px;
letter-spacing: -0.04em;
}
@media (max-width: ${Constants.sizes.mobile}px) {
font-size: 48px;
line-height: 52px;
letter-spacing: -0.04em;
}
`;
const STYLES_HEADING2 = css`
${STYLES_HEADING};
font-family: ${Constants.font.semiBold};
font-size: 40px;
line-height: 40px;
letter-spacing: -0.035em;
margin: 40px 0;
@media (max-width: ${Constants.sizes.tablet}px) {
font-size: 48px;
line-height: 56px;
}
@media (max-width: ${Constants.sizes.mobile}px) {
font-size: 40px;
line-height: 48px;
margin-bottom: 32px;
}
`;
const STYLES_BODY = css`
font-family: ${Constants.font.text};
font-size: 20px;
line-height: 28px;
letter-spacing: -0.01em;
margin-bottom: 16px;
`;
export default function AboutUsPage() {
const title = `About Us - Slate`;
const description = "Your personal search engine";
const url = "https://slate.host/about";
const image = `${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`;
return (
<WebsitePrototypeWrapper title={title} description={description} url={url} image={image}>
<div css={STYLES_ROOT}>
<WebsiteHeader />
<div css={STYLES_CONTAINER}>
<div css={STYLES_HEADING1}>About Us</div>
<div css={STYLES_BODY}>
Slate is a Chrome extension that helps you save, organize and search stuff you care
about on the web. Its a lightweight tool designed to make the internet feel a little
more personal.
</div>
<div css={STYLES_HEADING2}>The team</div>
<div css={STYLES_HEADING2}>Special thanks to</div>
</div>
</div>
<WebsiteFooter />
</WebsitePrototypeWrapper>
);
}

111
pages/faqs.js Normal file
View File

@ -0,0 +1,111 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as SVGLogo from "~/common/logo";
import * as SVG from "~/common/svg";
import * as System from "~/components/system";
import * as Validations from "~/common/validations";
import * as Strings from "~/common/strings";
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
import WebsiteHeader from "~/components/core/WebsiteHeader";
import WebsiteFooter from "~/components/core/WebsiteFooter";
import { css } from "@emotion/react";
const STYLES_ROOT = css`
width: 100%;
height: 100%;
min-height: calc(100vh - 61px);
background-color: ${Constants.semantic.bgLight};
color: ${Constants.semantic.textBlack};
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@media (max-width: ${Constants.sizes.mobile}px) {
min-height: calc(100vh - 112px);
}
`;
const STYLES_CONTAINER = css`
max-width: 700px;
margin: 0 auto;
padding: 24px 0 96px 0;
@media (max-width: ${Constants.sizes.mobile}px) {
max-width: 480px;
padding: 16px 16px 32px 16px;
}
`;
const STYLES_HEADING = css`
flex-shrink: 0;
color: ${Constants.semantic.textBlack};
flex-shrink: 0;
min-width: 50%;
max-width: 100%;
`;
const STYLES_HEADING1 = css`
${STYLES_HEADING};
font-family: ${Constants.font.bold};
font-size: 88px;
line-height: 88px;
letter-spacing: -0.05em;
margin-bottom: 25px;
@media (max-width: ${Constants.sizes.tablet}px) {
font-size: 64px;
line-height: 68px;
letter-spacing: -0.04em;
}
@media (max-width: ${Constants.sizes.mobile}px) {
font-size: 48px;
line-height: 52px;
letter-spacing: -0.04em;
}
`;
const STYLES_HEADING2 = css`
${STYLES_HEADING};
font-family: ${Constants.font.medium};
font-size: 20px;
line-height: 28px;
letter-spacing: -0.02em;
margin: 40px 0 4px 0;
`;
const STYLES_BODY = css`
font-family: ${Constants.font.text};
font-size: 18px;
line-height: 28px;
letter-spacing: -0.01em;
margin-bottom: 16px;
`;
export default function FAQPage() {
const title = `FAQs - Slate`;
const description = "Your personal search engine";
const url = "https://slate.host/faqs";
const image = `${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`;
return (
<WebsitePrototypeWrapper title={title} description={description} url={url} image={image}>
<div css={STYLES_ROOT}>
<WebsiteHeader />
<div css={STYLES_CONTAINER}>
<div css={STYLES_HEADING1}>FAQs</div>
<div css={STYLES_HEADING2}>What is a personal search engine?</div>
<div css={STYLES_BODY}>
Slate is a Chrome extension that helps you save, organize and search stuff you care
about on the web. Its a lightweight tool designed to make the internet feel a little
more personal.
</div>
<div css={STYLES_HEADING2}>How will Slate protect my privacy?</div>
<div css={STYLES_HEADING2}>How much does Slate cost?</div>
</div>
</div>
<WebsiteFooter />
</WebsitePrototypeWrapper>
);
}

232
pages/get-slate.js Normal file
View File

@ -0,0 +1,232 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as SVG from "~/common/svg";
import WebsitePrototypeWrapper from "~/components/core/WebsitePrototypeWrapper";
import WebsiteHeader from "~/components/core/WebsiteHeader";
import WebsiteFooter from "~/components/core/WebsiteFooter";
import Link from "next/link";
import { css } from "@emotion/react";
import { useGuideKeyCommands } from "./guide/guide";
const STYLES_ROOT = css`
width: 100%;
height: 100%;
min-height: calc(100vh - 61px);
background-color: ${Constants.semantic.bgLight};
color: ${Constants.semantic.textBlack};
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@media (max-width: ${Constants.sizes.mobile}px) {
min-height: calc(100vh - 112px);
}
`;
const STYLES_CONTAINER = css`
max-width: 700px;
margin: 0 auto;
padding: min(2.5vw, 120px) 0 24px 0;
@media (max-width: ${Constants.sizes.mobile}px) {
max-width: 480px;
padding: 16px 16px 24px 16px;
}
`;
const STYLES_IMG = css`
width: 88%;
height: auto;
margin-bottom: 8px;
@media (max-width: ${Constants.sizes.mobile}px) {
width: 100%;
}
@keyframes hero-fade-in {
0% {
opacity: 0%;
transform: translateY(5%);
}
100% {
opacity: 100%;
transform: translateY(0%);
}
}
animation: hero-fade-in 300ms ease-in-out;
`;
const STYLES_HEADING = css`
font-family: ${Constants.font.bold};
flex-shrink: 0;
flex-shrink: 0;
min-width: 50%;
max-width: 100%;
line-height: min(100px, 6vw);
font-size: min(100px, 6vw);
letter-spacing: -0.05em;
margin-bottom: 21px;
@media (max-width: ${Constants.sizes.tablet}px) {
font-size: 64px;
line-height: 68px;
letter-spacing: -0.04em;
}
@media (max-width: ${Constants.sizes.mobile}px) {
font-size: 48px;
line-height: 52px;
letter-spacing: -0.04em;
margin-bottom: 13px;
}
@keyframes heading-fade-in {
0% {
opacity: 0%;
transform: translateY(25%);
}
50% {
opacity: 0%;
transform: translateY(25%);
}
100% {
opacity: 100%;
transform: translateY(0%);
}
}
animation: heading-fade-in 400ms ease-in-out;
`;
const STYLES_BODY = css`
font-family: ${Constants.font.medium};
font-size: 20px;
line-height: 28px;
letter-spacing: -0.015em;
margin-bottom: 20px;
@keyframes body-fade-in {
0% {
opacity: 0%;
transform: translateY(50%);
}
50% {
opacity: 0%;
transform: translateY(50%);
}
100% {
opacity: 100%;
transform: translateY(0%);
}
}
animation: body-fade-in 600ms ease-in-out;
@media (max-width: ${Constants.sizes.mobile}px) {
font-size: 18px;
line-height: 28px;
letter-spacing: -0.01em;
margin-bottom: 16px;
}
`;
const STYLES_BUTTON = css`
cursor: poitner;
display: inline-flex;
flex-grow: 0;
justify-content: center;
align-items: center;
padding: 18px 32px;
border-radius: 20px;
font-family: ${Constants.font.medium};
font-size: 18px;
line-height: 20px;
letter-spacing: -0.015em;
text-decoration: none;
cursor: pointer;
margin-right: 16px;
margin-bottom: 16px;
@keyframes button-fade-in {
0% {
opacity: 0%;
transform: translateY(50%);
}
50% {
opacity: 0%;
transform: translateY(50%);
}
100% {
opacity: 100%;
transform: translateY(0%);
}
}
animation: button-fade-in 700ms ease-in-out;
@media (max-width: ${Constants.sizes.mobile}px) {
font-size: 18px;
line-height: 24px;
letter-spacing: -0.01em;
padding: 14px 20px;
}
`;
const STYLES_PRIMARY_BUTTON = css`
${STYLES_BUTTON}
background-color: ${Constants.system.highlighter};
color: ${Constants.semantic.textBlack};
`;
const STYLES_SECONDARY_BUTTON = css`
${STYLES_BUTTON}
background-color: none;
border: 2px solid ${Constants.semantic.borderGray};
color: ${Constants.semantic.textBlack};
`;
export default function InstallPage() {
const title = `Install Slate for Chrome - Slate`;
const description = "Install Slate from Chrome web store";
const url = "https://slate.host/get-slate";
const image = `${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`;
const next = "/_/data";
const prev = "../guide/new-tab";
useGuideKeyCommands(next, prev);
return (
<WebsitePrototypeWrapper title={title} description={description} url={url} image={image}>
<div css={STYLES_ROOT}>
<WebsiteHeader />
<div css={STYLES_CONTAINER}>
<div style={{ width: "100%" }}>
<img
css={STYLES_IMG}
src="../public/static/slate-jumper.png"
alt="extension jumper"
width="616"
height="278"
/>
</div>
<h1 css={STYLES_HEADING}>
Get started <br />
its free.
</h1>
<p css={STYLES_BODY}>
Slate is currently free to use, well add premium features later on for you to use.
</p>
<a href="/_/data" css={STYLES_PRIMARY_BUTTON}>
Get started <SVG.RightArrow height={20} width={20} style={{ marginLeft: 8 }} />
</a>
<a
css={STYLES_SECONDARY_BUTTON}
target="_blank"
rel="noreferrer"
href={Constants.extensionLink.chrome}
>
Get Slate from Chrome store
</a>
</div>
</div>
<WebsiteFooter />
</WebsitePrototypeWrapper>
);
}

View File

@ -0,0 +1,88 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as JumperPrototype from "~/components/landing/jumperPrototype";
import * as SVG from "~/common/svg";
import Guide from "~/pages/guide/guide.js";
import { css } from "@emotion/react";
const VIEWS_ACTIONS = [{ label: "Current Window" }, { label: "All Open" }, { label: "Recent" }];
const OBJECTS = [
{
title: "Concrete Architecture (@architeg) / Twitter",
Favicon: SVG.TwitterFavicon,
},
{
title: "Fitzcarraldo 1982 Werner Herzog Klaus Kinski Full Movie HD",
Favicon: SVG.YoutubeFavicon,
},
{
title: "Amazon.com: Whole Foods Market",
Favicon: SVG.AmazonFavicon,
},
{
title: "NASA Is Working With Startups to Harvest the Moons Resources",
Favicon: SVG.WSJFavicon,
},
{
title: "SyntheticEvent - React",
Favicon: SVG.ReactFavicon,
},
{
title: "slate-engineering/slate-web-extension at @aminejv/history",
Favicon: SVG.GithubFavicon,
},
{
title: "Verticle ⋅ Mount Kimbie",
Favicon: SVG.SpotifyFavicon,
},
{
title: "tokyo travel restrictions 2022 - Google Search",
Favicon: SVG.GoogleFavicon,
},
];
export default function BrowserControlGuidePage() {
return (
<Guide
title="Browser Control Guide - Slate"
description="Your personal search engine"
url="https://slate.host/guide/browser-control"
image={`${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`}
heading="Built for your browser"
body="Our Chrome extension gives you seamless control of your tabs with powerful tools to help you manage and keep track of things."
next="save"
prev="../"
jumper={
<React.Fragment>
<JumperPrototype.TopPanel>
{VIEWS_ACTIONS.map((action, i) => (
<JumperPrototype.ViewAction isSelected={i === 0} key={action.label}>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.ViewAddButton style={{ marginLeft: "auto" }} />
</JumperPrototype.TopPanel>
<JumperPrototype.Root style={{ marginTop: 16, boxShadow: "none", opacity: 0.5 }}>
<JumperPrototype.Header />
<JumperPrototype.Divider />
<JumperPrototype.Body>
{OBJECTS.map((object) => (
<JumperPrototype.Object
key={object.title}
title={object.title}
Favicon={object.Favicon}
isSelected={object.isSelected}
isSaved={object.isSaved}
/>
))}
</JumperPrototype.Body>
</JumperPrototype.Root>
</React.Fragment>
}
mobileguide="../public/static/browser-control.png"
/>
);
}

116
pages/guide/file.js Normal file
View File

@ -0,0 +1,116 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as SVG from "~/common/svg";
import * as JumperPrototype from "~/components/landing/jumperPrototype";
import Guide from "~/pages/guide/guide.js";
const VIEWS_ACTIONS = [{ label: "Current Window" }, { label: "All Open" }, { label: "Recent" }];
const CUSTOM_VIEWS_ACTIONS = [{ label: "Files" }];
const OBJECTS = [
{
title: "Alexander, C., Notes on the Synthesis of Form",
Favicon: SVG.Book,
isSaved: true,
tag: "computer-architecture",
},
{
title: "Graphical database interface",
Favicon: SVG.Image,
isSaved: true,
},
{
title: "Landscape in the Mist",
Favicon: SVG.Video,
isSaved: true,
tag: "theo-angelopoulos",
},
{
title: "Shannon, C., “A Theory of Communications”",
Favicon: SVG.Document,
isSaved: true,
tag: "computer-architecture",
},
{
title: "Retro computer fonts",
Favicon: SVG.TextDocument,
isSaved: true,
},
{
title: "Prime number ASMR",
Favicon: SVG.Sound,
isSaved: true,
},
{
title: "Hesse, H., Demian",
Favicon: SVG.Book,
isSaved: true,
tag: "reading",
},
{
title: "Pask, G., “The Architectural Relevance of Cybernetics”",
Favicon: SVG.TextDocument,
isSaved: true,
tag: "computer-architecture",
},
];
export default function FileGuidePage() {
return (
<Guide
title="File Guide - Slate"
description="Your personal search engine"
url="https://slate.host/guide/file"
image={`${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`}
heading="Integrated storage for your files"
body="Save text, images, and files from the web or upload them directly to Slate to create your personal archive."
next="space"
prev="save"
jumper={
<div>
<JumperPrototype.TopPanel>
{VIEWS_ACTIONS.map((action) => (
<JumperPrototype.ViewAction key={action.label}>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.Divider
height="none"
width="1px"
style={{ margin: "0px 4px", flexShrink: 0 }}
/>
{CUSTOM_VIEWS_ACTIONS.map((action, i) => (
<JumperPrototype.ViewAction
isSelected={i === 0}
key={action.label}
Favicon={action.Favicon}
>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.ViewAddButton style={{ marginLeft: "auto" }} />
</JumperPrototype.TopPanel>
<JumperPrototype.Root style={{ marginTop: 16 }}>
<JumperPrototype.Header />
<JumperPrototype.Divider />
<JumperPrototype.Body>
{OBJECTS.map((object) => (
<JumperPrototype.Object
key={object.title}
title={object.title}
Favicon={object.Favicon}
isSelected={object.isSelected}
isSaved={object.isSaved}
tag={object.tag}
/>
))}
</JumperPrototype.Body>
</JumperPrototype.Root>
</div>
}
mobileguide="../public/static/file.png"
/>
);
}

20
pages/guide/new-tab.js Normal file
View File

@ -0,0 +1,20 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import Guide from "~/pages/guide/guide.js";
export default function NewTabGuidePage() {
return (
<Guide
title="New Tab Guide - Slate"
description="Your personal search engine"
url="https://slate.host/guide/new-tab"
image={`${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`}
heading="Refresh your memory with every tab"
body="You can even use Slate as your new tab experience to refresh your memory as you browse."
next="/get-slate"
prev="search"
imageguide="../public/static/new-tab.png"
/>
);
}

98
pages/guide/save.js Normal file
View File

@ -0,0 +1,98 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as SVG from "~/common/svg";
import * as JumperPrototype from "~/components/landing/jumperPrototype";
import Guide from "~/pages/guide/guide.js";
import { css } from "@emotion/react";
const VIEWS_ACTIONS = [{ label: "Current Window" }, { label: "All Open" }, { label: "Recent" }];
const OBJECTS = [
{
title: "Concrete Architecture (@architeg) / Twitter",
Favicon: SVG.TwitterFavicon,
isSaved: true,
tag: "architecture",
},
{
title: "Fitzcarraldo 1982 Werner Herzog Klaus Kinski Full Movie HD",
Favicon: SVG.YoutubeFavicon,
isSelected: true,
},
{
title: "Amazon.com: Whole Foods Market",
Favicon: SVG.AmazonFavicon,
},
{
title: "NASA Is Working With Startups to Harvest the Moons Resources",
Favicon: SVG.WSJFavicon,
},
{
title: "SyntheticEvent - React",
Favicon: SVG.ReactFavicon,
isSaved: true,
tag: "code",
},
{
title: "slate-engineering/slate-web-extension at @aminejv/history",
Favicon: SVG.GithubFavicon,
isSaved: true,
tag: "slate",
},
{
title: "Verticle ⋅ Mount Kimbie",
Favicon: SVG.SpotifyFavicon,
isSaved: true,
tag: "work-music",
},
{
title: "tokyo travel restrictions 2022 - Google Search",
Favicon: SVG.GoogleFavicon,
},
];
export default function SaveGuidePage() {
return (
<Guide
title="Save Guide - Slate"
description="Your personal search engine"
url="https://slate.host/guide/save"
image={`${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`}
heading="Always at your fingertips"
body="Save links, take notes, and add tags with keyboard shortcuts to capture things on the fly."
next="file"
prev="browser-control"
jumper={
<div>
<JumperPrototype.TopPanel style={{ boxShadow: "none", opacity: "0.5" }}>
{VIEWS_ACTIONS.map((action, i) => (
<JumperPrototype.ViewAction isSelected={i === 0} key={action.label}>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.ViewAddButton style={{ marginLeft: "auto" }} />
</JumperPrototype.TopPanel>
<JumperPrototype.Root style={{ marginTop: 16 }}>
<JumperPrototype.Header />
<JumperPrototype.Divider />
<JumperPrototype.Body>
{OBJECTS.map((object) => (
<JumperPrototype.Object
key={object.title}
title={object.title}
Favicon={object.Favicon}
isSelected={object.isSelected}
isSaved={object.isSaved}
tag={object.tag}
/>
))}
</JumperPrototype.Body>
</JumperPrototype.Root>
</div>
}
mobileguide="../public/static/save.png"
/>
);
}

123
pages/guide/search.js Normal file
View File

@ -0,0 +1,123 @@
import * as React from "react";
import * as Constants from "~/common/constants";
import * as SVG from "~/common/svg";
import * as JumperPrototype from "~/components/landing/jumperPrototype";
import Guide from "~/pages/guide/guide.js";
import { css } from "@emotion/react";
const VIEWS_ACTIONS = [{ label: "Current Window" }, { label: "All Open" }, { label: "Recent" }];
const CUSTOM_VIEWS_ACTIONS = [
{ label: "Files" },
{ label: "Twitter", Favicon: SVG.TwitterFavicon },
{ label: "Reading", Favicon: SVG.Hash },
];
const OBJECTS = [
{
title: "Nicholas Negroponte Architecture Machine",
Favicon: SVG.InternetArchiveFavicon,
},
{
title: "Alexander, C., Notes on the Synthesis of Form",
Favicon: SVG.Book,
isSaved: true,
tag: "computer-architecture",
},
{
title: "Von Neumann Architecture - Computerphile",
Favicon: SVG.YoutubeFavicon,
},
{
title: "Shannon, C., “A Theory of Communications”",
Favicon: SVG.Document,
isSaved: true,
tag: "computer-architecture",
},
{
title: "Pask, G., “The Architectural Relevance of Cybernetics”",
Favicon: SVG.TextDocument,
isSaved: true,
tag: "computer-architecture",
},
{
title: "Michael Porter, “How Smart, Connected Products Are Transforming Competition”",
Favicon: SVG.HBRFavicon,
},
{
title: "Morozov, Evgeny (2014), “The Planning Machine: Project Cybersyn… Big Data…”",
Favicon: SVG.NewYorkerFavicon,
},
{
title:
"no on Twitter: “An Introduction to Cybernetics (1956) : Ashby, W. Ross DOI: https://doi.org/10.2307/3006723”",
Favicon: SVG.TwitterFavicon,
},
{
title: "Capra, F., and Luisi, P. L., The Systems View of Life: A Unifying Vision",
Favicon: SVG.Document,
isSaved: true,
tag: "computer-architecture",
},
{
title:
"Nimbu on Twitter: “📷 spaceintruderdetector: CYBERNETICS AND ITS DEVELOPMENT IN THE SOVIET UNION 1964 https://archive.org/details/DTIC_AD0602705/mode/2up The report is an introduction to the subject of cybernetics, with special reference to its origins and...”",
Favicon: SVG.TwitterFavicon,
},
];
export default function SearchGuidePage() {
return (
<Guide
title="Search Guide - Slate"
description="Your personal search engine"
url="https://slate.host/guide/search"
image={`${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`}
heading="Find things instantly with search"
body="Search allows you to easily find things by either keyword or tag (weve got some filters on the way too)."
next="new-tab"
prev="space"
jumper={
<React.Fragment>
<JumperPrototype.TopPanel style={{ boxShadow: "none", opacity: "0.5" }}>
{VIEWS_ACTIONS.map((action, i) => (
<JumperPrototype.ViewAction isSelected={i === 2} key={action.label}>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.Divider
height="none"
width="1px"
style={{ margin: "0px 4px", flexShrink: 0 }}
/>
{CUSTOM_VIEWS_ACTIONS.map((action) => (
<JumperPrototype.ViewAction key={action.label} Favicon={action.Favicon}>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.ViewAddButton style={{ marginLeft: "auto" }} />
</JumperPrototype.TopPanel>
<JumperPrototype.Root style={{ marginTop: 16 }}>
<JumperPrototype.Header search="Computer architecture" />
<JumperPrototype.Divider />
<JumperPrototype.Body>
{OBJECTS.map((object) => (
<JumperPrototype.Object
key={object.title}
title={object.title}
Favicon={object.Favicon}
isSelected={object.isSelected}
isSaved={object.isSaved}
tag={object.tag}
/>
))}
</JumperPrototype.Body>
</JumperPrototype.Root>
</React.Fragment>
}
mobileguide="../public/static/search.png"
/>
);
}

118
pages/guide/space.js Normal file
View File

@ -0,0 +1,118 @@
import * as React from "react";
import * as SVG from "~/common/svg";
import * as JumperPrototype from "~/components/landing/jumperPrototype";
import * as Constants from "~/common/constants";
import Guide from "~/pages/guide/guide.js";
const VIEWS_ACTIONS = [{ label: "Current Window" }, { label: "All Open" }, { label: "Recent" }];
const CUSTOM_VIEWS_ACTIONS = [
{ label: "Files" },
{ label: "Twitter", Favicon: SVG.TwitterFavicon },
{ label: "Reading", Favicon: SVG.Hash },
];
const OBJECTS = [
{
title: "Paul Prudence on Twitter: “Computers and Automation [August-12-2022]",
Favicon: SVG.TwitterFavicon,
},
{
title:
"Massimo on Twitter: “This is how you cut a high voltage power line [source, full video by Joe Chenoweth: https://buff.ly/2lYgk5V]”",
Favicon: SVG.TwitterFavicon,
isSaved: true,
},
{
title: "qubibi on Twitter: “stardust https://t.co/3Uu6nOmsJyafq...”",
Favicon: SVG.TwitterFavicon,
},
{
title: "pictures of the end on Twitter: “https://t.co/A2k7vZdIF7 / Twitter”",
Favicon: SVG.TwitterFavicon,
},
{
title: "Internal Tech Emails on Twitter: “https://t.co/2uOQawmsvJ..”",
Favicon: SVG.TwitterFavicon,
},
{
title: "𝗺𝗮𝗺𝗲 on Twitter: “京都でかわいい建物を発見しました🤖”",
Favicon: SVG.TwitterFavicon,
},
{
title:
"Letterform Archive on Twitter: “La Carte surréaliste: La première série, 1937. (1) André Breton, Poème-Objet, (2) Georges Hugnet, Au pied de la Lettre, (3) René Magritte, La solution du rébus, (4) Joan Miró, Horaire.”",
Favicon: SVG.TwitterFavicon,
isSaved: true,
},
{
title:
"karatekid on Twitter: “Doubling down. Second @qubibien = art². And delight multiplied...”",
Favicon: SVG.TwitterFavicon,
isSaved: true,
},
{
title: "Concrete Architecture (@architeg) / Twitter",
Favicon: SVG.TwitterFavicon,
isSaved: true,
},
];
export default function SpaceGuidePage() {
return (
<Guide
title="Space Guide - Slate"
description="Your personal search engine"
url="https://slate.host/guide/space"
image={`${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`}
heading="Make space for everything"
body="Set up spaces to automatically revisit things from your favorite sites or create your own using tags."
next="search"
prev="file"
jumper={
<React.Fragment>
<JumperPrototype.TopPanel>
{VIEWS_ACTIONS.map((action) => (
<JumperPrototype.ViewAction key={action.label}>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.Divider
height="none"
width="1px"
style={{ margin: "0px 4px", flexShrink: 0 }}
/>
{CUSTOM_VIEWS_ACTIONS.map((action, i) => (
<JumperPrototype.ViewAction
isSelected={i === 1}
key={action.label}
Favicon={action.Favicon}
>
{action.label}
</JumperPrototype.ViewAction>
))}
<JumperPrototype.ViewAddButton style={{ marginLeft: "auto" }} />
</JumperPrototype.TopPanel>
<JumperPrototype.Root style={{ marginTop: 16 }}>
<JumperPrototype.Header />
<JumperPrototype.Divider />
<JumperPrototype.Body>
{OBJECTS.map((object) => (
<JumperPrototype.Object
key={object.title}
title={object.title}
Favicon={object.Favicon}
isSelected={object.isSelected}
isSaved={object.isSaved}
/>
))}
</JumperPrototype.Body>
</JumperPrototype.Root>
</React.Fragment>
}
mobileguide="../public/static/space.png"
/>
);
}

View File

@ -19,20 +19,17 @@ const INTEGRATION = [
{
title: "Chrome",
body: "Connect to your browser history and bookmarks.",
logo:
"https://slate.textile.io/ipfs/bafkreiamdcnqxcga7dj4fur7nqd57pbey7s6znnj4o2zpbkmsydp6rspdy",
logo: "https://slate.textile.io/ipfs/bafkreiamdcnqxcga7dj4fur7nqd57pbey7s6znnj4o2zpbkmsydp6rspdy",
},
{
title: "Twitter",
body: "Search your twitter bookmarks.",
logo:
"https://slate.textile.io/ipfs/bafkreihtujowfnffw5jxvdo7gqazo4oy3q3q4u4z2jflx5ygmpaj7pgtnu",
logo: "https://slate.textile.io/ipfs/bafkreihtujowfnffw5jxvdo7gqazo4oy3q3q4u4z2jflx5ygmpaj7pgtnu",
},
{
title: "MetaMask",
body: "Keep all of your NFTs in one place.",
logo:
"https://slate.textile.io/ipfs/bafkreiecbn5pjuebdelsehul6sqmxs5kk74mijmo6ybts3hfg5tr2p4rti",
logo: "https://slate.textile.io/ipfs/bafkreiecbn5pjuebdelsehul6sqmxs5kk74mijmo6ybts3hfg5tr2p4rti",
},
{
title: "And more later",
@ -43,121 +40,90 @@ const INTEGRATION = [
const FAQ = [
{
title: "What makes Slate different from other bookmarking / storage tools?",
text:
"Slate is designed to automatically save and organize things for you to help you remember things and explore things you care about in an entirely new way.",
text: "Slate is designed to automatically save and organize things for you to help you remember things and explore things you care about in an entirely new way.",
},
{
title: "Is my data safe / private?",
text:
"Short answer — yes. We use all the industry standards to protect your data and ensure that you have complete control over who is able to see anything in your account. We do not sell and never will sell your data to any third-party.",
text: "Short answer — yes. We use all the industry standards to protect your data and ensure that you have complete control over who is able to see anything in your account. We do not sell and never will sell your data to any third-party.",
},
{
title: "How much does Slate cost?",
text:
"Slate is free for everyone to use. We plan on adding premium tools and functionality to enhance your internet experience some time in 2022. ",
text: "Slate is free for everyone to use. We plan on adding premium tools and functionality to enhance your internet experience some time in 2022. ",
},
];
const BANNER = [
{
link:
"https://slate.host/tara/neon-genesis-evangelion?cid=bafybeib2zzeknjmih25wivzogzupd7atrdbaxpvmsxfgutrqymlyfc2dvi",
link: "https://slate.host/tara/neon-genesis-evangelion?cid=bafybeib2zzeknjmih25wivzogzupd7atrdbaxpvmsxfgutrqymlyfc2dvi",
name: "@tara",
img:
"https://slate.textile.io/ipfs/bafybeib2zzeknjmih25wivzogzupd7atrdbaxpvmsxfgutrqymlyfc2dvi",
img: "https://slate.textile.io/ipfs/bafybeib2zzeknjmih25wivzogzupd7atrdbaxpvmsxfgutrqymlyfc2dvi",
},
{
link:
"https://slate.host/biodivlibrary/the-mushroom-book?cid=bafybeigph7tfup3wb3truahl7sycaywx3unwa365jk4assrjjlzv6d7x3a",
link: "https://slate.host/biodivlibrary/the-mushroom-book?cid=bafybeigph7tfup3wb3truahl7sycaywx3unwa365jk4assrjjlzv6d7x3a",
name: "@biodivlibrary",
img:
"https://slate.textile.io/ipfs/bafybeigph7tfup3wb3truahl7sycaywx3unwa365jk4assrjjlzv6d7x3a",
img: "https://slate.textile.io/ipfs/bafybeigph7tfup3wb3truahl7sycaywx3unwa365jk4assrjjlzv6d7x3a",
},
{
link:
"https://slate.host/jin/cryptovoxels-history?cid=bafybeiafrj3erh3rfqux4zqc7u2px3veqdppbtizq26p443utxunrkgonu",
link: "https://slate.host/jin/cryptovoxels-history?cid=bafybeiafrj3erh3rfqux4zqc7u2px3veqdppbtizq26p443utxunrkgonu",
name: "@jin",
img:
"https://slate.textile.io/ipfs/bafybeiafrj3erh3rfqux4zqc7u2px3veqdppbtizq26p443utxunrkgonu",
img: "https://slate.textile.io/ipfs/bafybeiafrj3erh3rfqux4zqc7u2px3veqdppbtizq26p443utxunrkgonu",
},
{
link:
"https://slate.host/ng/numero?cid=bafybeibhhfgc4amvymoblaxcoe6glyyvaxhylzisl4ib2itcbhn3mrviou",
link: "https://slate.host/ng/numero?cid=bafybeibhhfgc4amvymoblaxcoe6glyyvaxhylzisl4ib2itcbhn3mrviou",
name: "@ng",
img:
"https://slate.textile.io/ipfs/bafybeibhhfgc4amvymoblaxcoe6glyyvaxhylzisl4ib2itcbhn3mrviou",
img: "https://slate.textile.io/ipfs/bafybeibhhfgc4amvymoblaxcoe6glyyvaxhylzisl4ib2itcbhn3mrviou",
},
{
link:
"https://slate.host/thesimpsons/clips?cid=bafybeigce5klzr3vgzmlathvepuzhzhmwjc6bbvmsmcvu5eyisy6mnkx34",
link: "https://slate.host/thesimpsons/clips?cid=bafybeigce5klzr3vgzmlathvepuzhzhmwjc6bbvmsmcvu5eyisy6mnkx34",
name: "@thesimpsons",
img:
"https://slate.textile.io/ipfs/bafybeigce5klzr3vgzmlathvepuzhzhmwjc6bbvmsmcvu5eyisy6mnkx34",
img: "https://slate.textile.io/ipfs/bafybeigce5klzr3vgzmlathvepuzhzhmwjc6bbvmsmcvu5eyisy6mnkx34",
},
{
link:
"https://slate.host/bitgraves/september?cid=bafybeiclkru6hwzw2ghvsyrbnaf67taxxhq2hbpcia2oqj5ufdggwhcbti",
link: "https://slate.host/bitgraves/september?cid=bafybeiclkru6hwzw2ghvsyrbnaf67taxxhq2hbpcia2oqj5ufdggwhcbti",
name: "@bitgraves",
img:
"https://slate.textile.io/ipfs/bafybeiclkru6hwzw2ghvsyrbnaf67taxxhq2hbpcia2oqj5ufdggwhcbti",
img: "https://slate.textile.io/ipfs/bafybeiclkru6hwzw2ghvsyrbnaf67taxxhq2hbpcia2oqj5ufdggwhcbti",
},
{
link:
"https://slate.host/nypl/japan-kimbei-kusakabe?cid=bafkreidqz6imwffq5hpkacmxnrffagzxx5usybpitt42yuzthe6uf4idlm",
link: "https://slate.host/nypl/japan-kimbei-kusakabe?cid=bafkreidqz6imwffq5hpkacmxnrffagzxx5usybpitt42yuzthe6uf4idlm",
name: "@nypl",
img:
"https://slate.textile.io/ipfs/bafkreidqz6imwffq5hpkacmxnrffagzxx5usybpitt42yuzthe6uf4idlm",
img: "https://slate.textile.io/ipfs/bafkreidqz6imwffq5hpkacmxnrffagzxx5usybpitt42yuzthe6uf4idlm",
},
{
link:
"https://slate.host/atlas/cartography?cid=bafybeid2n55qb4thosrxlszhzi3nwiorswv7xi2d5ykbudp3ph5hc54baa",
link: "https://slate.host/atlas/cartography?cid=bafybeid2n55qb4thosrxlszhzi3nwiorswv7xi2d5ykbudp3ph5hc54baa",
name: "@atlas",
img:
"https://slate.textile.io/ipfs/bafybeid2n55qb4thosrxlszhzi3nwiorswv7xi2d5ykbudp3ph5hc54baa",
img: "https://slate.textile.io/ipfs/bafybeid2n55qb4thosrxlszhzi3nwiorswv7xi2d5ykbudp3ph5hc54baa",
},
{
link:
"https://slate.host/museosabiertos/palais-de-glace-fotografia?cid=bafybeigrznzuqymmfligf6mhc7adh6r7iw5gotbrzstcqeyyybaklfguki",
link: "https://slate.host/museosabiertos/palais-de-glace-fotografia?cid=bafybeigrznzuqymmfligf6mhc7adh6r7iw5gotbrzstcqeyyybaklfguki",
name: "@museosabiertos",
img:
"https://slate.textile.io/ipfs/bafybeigrznzuqymmfligf6mhc7adh6r7iw5gotbrzstcqeyyybaklfguki",
img: "https://slate.textile.io/ipfs/bafybeigrznzuqymmfligf6mhc7adh6r7iw5gotbrzstcqeyyybaklfguki",
},
{
link:
"https://slate.host/gndclouds/animation?cid=bafybeigh44l3uzsgv4hslpruxrr5s43olpj5llptmsafkemxbwlu4fbdc4",
link: "https://slate.host/gndclouds/animation?cid=bafybeigh44l3uzsgv4hslpruxrr5s43olpj5llptmsafkemxbwlu4fbdc4",
name: "@gndclouds",
img:
"https://slate.textile.io/ipfs/bafybeigh44l3uzsgv4hslpruxrr5s43olpj5llptmsafkemxbwlu4fbdc4",
img: "https://slate.textile.io/ipfs/bafybeigh44l3uzsgv4hslpruxrr5s43olpj5llptmsafkemxbwlu4fbdc4",
},
{
link:
"https://slate.host/cindy/sw-sans?cid=bafkreihazsjq7hlho6ab6k7tise6ufv2ccat5gv5f3fz7yy4cluz3e356e",
link: "https://slate.host/cindy/sw-sans?cid=bafkreihazsjq7hlho6ab6k7tise6ufv2ccat5gv5f3fz7yy4cluz3e356e",
name: "@cindy",
img:
"https://slate.textile.io/ipfs/bafkreihazsjq7hlho6ab6k7tise6ufv2ccat5gv5f3fz7yy4cluz3e356e",
img: "https://slate.textile.io/ipfs/bafkreihazsjq7hlho6ab6k7tise6ufv2ccat5gv5f3fz7yy4cluz3e356e",
},
{
link:
"https://slate.host/haris/archive?cid=bafkreigcdnhxnh4fp7g2xy2gp43umhjrqyzz2a2t3ovnmcabepwusx5ldi",
link: "https://slate.host/haris/archive?cid=bafkreigcdnhxnh4fp7g2xy2gp43umhjrqyzz2a2t3ovnmcabepwusx5ldi",
name: "@haris",
img:
"https://slate.textile.io/ipfs/bafkreigcdnhxnh4fp7g2xy2gp43umhjrqyzz2a2t3ovnmcabepwusx5ldi",
img: "https://slate.textile.io/ipfs/bafkreigcdnhxnh4fp7g2xy2gp43umhjrqyzz2a2t3ovnmcabepwusx5ldi",
},
{
link:
"https://slate.host/guji/%E5%8C%97%E4%BA%AC%E7%9A%87%E5%9F%8E%E5%BB%BA%E7%AD%91%E8%A3%85%E9%A5%B0?cid=bafybeiceh32ka3l6nlxniziefaxqs44ib4i47pohdftjzvlbsoem3qk6ly",
link: "https://slate.host/guji/%E5%8C%97%E4%BA%AC%E7%9A%87%E5%9F%8E%E5%BB%BA%E7%AD%91%E8%A3%85%E9%A5%B0?cid=bafybeiceh32ka3l6nlxniziefaxqs44ib4i47pohdftjzvlbsoem3qk6ly",
name: "@guji",
img:
"https://slate.textile.io/ipfs/bafybeiceh32ka3l6nlxniziefaxqs44ib4i47pohdftjzvlbsoem3qk6ly",
img: "https://slate.textile.io/ipfs/bafybeiceh32ka3l6nlxniziefaxqs44ib4i47pohdftjzvlbsoem3qk6ly",
},
{
link:
"https://slate.host/martina/reaction-gifs?cid=bafybeif344hukksxizwk2dhmp6xjybnbw6x62r23m6wju2btxpsk4yluki",
link: "https://slate.host/martina/reaction-gifs?cid=bafybeif344hukksxizwk2dhmp6xjybnbw6x62r23m6wju2btxpsk4yluki",
name: "@martina",
img:
"https://slate.textile.io/ipfs/bafybeif344hukksxizwk2dhmp6xjybnbw6x62r23m6wju2btxpsk4yluki",
img: "https://slate.textile.io/ipfs/bafybeif344hukksxizwk2dhmp6xjybnbw6x62r23m6wju2btxpsk4yluki",
},
];
@ -173,8 +139,7 @@ const OBJECTPREVIEWS = [
type: "Soundcloud",
preview:
"https://slate.textile.io/ipfs/bafkreic5z2j6kz4qn4zgcv2wakvgok7bgn2tdsrirrcbmcngbty3m4n7fi",
URL:
"https://slate.host/slate/objects?cid=bafybeicdrezbs4xtdgwmhef52fwu5dkw2bv3m6sbfbd7wikleszezufeci",
URL: "https://slate.host/slate/objects?cid=bafybeicdrezbs4xtdgwmhef52fwu5dkw2bv3m6sbfbd7wikleszezufeci",
},
{
title: "zancan - Lushtemples",
@ -187,8 +152,7 @@ const OBJECTPREVIEWS = [
type: "hicetnunc.art",
preview:
"https://slate.textile.io/ipfs/bafkreia7ir22cbomueh6amuypurqyggqnxsbdirapljxgeoju7m656cvve",
URL:
"https://slate.host/slate/objects?cid=bafybeig5mukv6kzfcwphudok6wksjxkglfb2akvt3yzhnqcooj2juwegiu",
URL: "https://slate.host/slate/objects?cid=bafybeig5mukv6kzfcwphudok6wksjxkglfb2akvt3yzhnqcooj2juwegiu",
},
{
title: "OP-Z Synthesizer",
@ -196,8 +160,7 @@ const OBJECTPREVIEWS = [
type: "JPEG",
preview:
"https://slate.textile.io/ipfs/bafkreiagkyoslopcxar5pt4vum4ngkbqnqzspa4kbeyltlxpsh7a6xb3mm",
URL:
"https://slate.host/slate/objects?cid=bafybeiaaqrbqdgytuk362qe7oezw5vvkue5yhmp5oxdxw76clvnvp7w2yu",
URL: "https://slate.host/slate/objects?cid=bafybeiaaqrbqdgytuk362qe7oezw5vvkue5yhmp5oxdxw76clvnvp7w2yu",
},
{
title: "Hermann Hesse - Demian",
@ -205,8 +168,7 @@ const OBJECTPREVIEWS = [
type: "PDF",
preview:
"https://slate.textile.io/ipfs/bafkreierp2ddmptriabymjse2mu772hftl7zrl63akbthl42cl6yvsiddu",
URL:
"https://slate.host/slate/objects?cid=bafybeietqtoktbmkxlsfrhhcdodbjd7bixkjvrxxxjsy6s7tdqwuicxhw4",
URL: "https://slate.host/slate/objects?cid=bafybeietqtoktbmkxlsfrhhcdodbjd7bixkjvrxxxjsy6s7tdqwuicxhw4",
},
{
title: "ASMR prime numbers",
@ -219,8 +181,7 @@ const OBJECTPREVIEWS = [
type: "Youtube",
preview:
"https://slate.textile.io/ipfs/bafkreiaars3ztdupanomdsy2o3ok6xr6gcjmwc2situnquggiz5x2xokgy",
URL:
"https://slate.host/slate/objects?cid=bafybeigaet3w3yvpchwup33tr3oyhpu3ckjnrbqq7a7kxoqwp3drzxsmvm",
URL: "https://slate.host/slate/objects?cid=bafybeigaet3w3yvpchwup33tr3oyhpu3ckjnrbqq7a7kxoqwp3drzxsmvm",
},
{
title: "r/dostoevsky - Fyodor Dostoevsky",
@ -233,8 +194,7 @@ const OBJECTPREVIEWS = [
type: "Reddit",
preview:
"https://slate.textile.io/ipfs/bafybeiafyuacznehtudad5hxzhbri4snjucrsnna2nzjifocebazy6xkt4",
URL:
"https://slate.host/slate/objects?cid=bafybeidmxr5vebmqthxsxdy7w5laxb45y6rdg27vjhf5pauu2iyjng7b6e",
URL: "https://slate.host/slate/objects?cid=bafybeidmxr5vebmqthxsxdy7w5laxb45y6rdg27vjhf5pauu2iyjng7b6e",
},
];
@ -830,8 +790,7 @@ export default function IndexPage() {
const title = `Slate`;
const description = "Your personal search engine";
const url = "https://slate.host/";
const image =
"https://slate.textile.io/ipfs/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4";
const image = `${Constants.gateways.ipfs}/bafkreifww37ypduoi5pvj2cuikz7iycp7l5h7czke6lcboukkaqkoab3t4`;
const signInURL = "/_/auth";
const discordURL = "https://discord.gg/NRsUjpCypr";
const {