kopia lustrzana https://github.com/bugout-dev/moonstream
Neeraj Kashyap
GitHub
commit
35b6aac82d
|
|
@ -0,0 +1,236 @@
|
|||
import React, { useEffect, useState, useLayoutEffect, useContext } from "react";
|
||||
import {
|
||||
Heading,
|
||||
Text,
|
||||
Flex,
|
||||
Link,
|
||||
Stack,
|
||||
chakra,
|
||||
useMediaQuery,
|
||||
UnorderedList,
|
||||
ListItem,
|
||||
} from "@chakra-ui/react";
|
||||
import { DEFAULT_METATAGS } from "../../src/core/constants";
|
||||
import UIContext from "../../src/core/providers/UIProvider/context";
|
||||
|
||||
export async function getStaticProps() {
|
||||
return {
|
||||
props: { metaTags: { ...DEFAULT_METATAGS } },
|
||||
};
|
||||
}
|
||||
|
||||
const AWS_PATH =
|
||||
"https://s3.amazonaws.com/static.simiotics.com/moonstream/assets";
|
||||
|
||||
const assets = {
|
||||
background720: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
background1920: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
background2880: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
background3840: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
};
|
||||
|
||||
const Product = () => {
|
||||
const ui = useContext(UIContext);
|
||||
const [background, setBackground] = useState("background720");
|
||||
const [backgroundLoaded720, setBackgroundLoaded720] = useState(false);
|
||||
const [backgroundLoaded1920, setBackgroundLoaded1920] = useState(false);
|
||||
const [backgroundLoaded2880, setBackgroundLoaded2880] = useState(false);
|
||||
const [backgroundLoaded3840, setBackgroundLoaded3840] = useState(false);
|
||||
|
||||
const [
|
||||
isLargerThan720px,
|
||||
isLargerThan1920px,
|
||||
isLargerThan2880px,
|
||||
isLargerThan3840px,
|
||||
] = useMediaQuery([
|
||||
"(min-width: 720px)",
|
||||
"(min-width: 1920px)",
|
||||
"(min-width: 2880px)",
|
||||
"(min-width: 3840px)",
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
assets["background720"] = `${AWS_PATH}/blog-background-720x405.png`;
|
||||
assets["background1920"] = `${AWS_PATH}/blog-background-1920x1080.png`;
|
||||
assets["background2880"] = `${AWS_PATH}/blog-background-2880x1620.png`;
|
||||
assets["background3840"] = `${AWS_PATH}/blog-background-3840x2160.png`;
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
if (backgroundLoaded3840) {
|
||||
setBackground("background3840");
|
||||
} else if (backgroundLoaded2880) {
|
||||
setBackground("background2880");
|
||||
} else if (backgroundLoaded1920) {
|
||||
setBackground("background1920");
|
||||
} else {
|
||||
setBackground("background720");
|
||||
}
|
||||
}, [
|
||||
isLargerThan720px,
|
||||
isLargerThan1920px,
|
||||
isLargerThan2880px,
|
||||
isLargerThan3840px,
|
||||
backgroundLoaded720,
|
||||
backgroundLoaded1920,
|
||||
backgroundLoaded2880,
|
||||
backgroundLoaded3840,
|
||||
]);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader720 = new Image();
|
||||
imageLoader720.src = `${AWS_PATH}/blog-background-720x405.png`;
|
||||
imageLoader720.onload = () => {
|
||||
setBackgroundLoaded720(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader1920 = new Image();
|
||||
imageLoader1920.src = `${AWS_PATH}/blog-background-1920x1080.png`;
|
||||
imageLoader1920.onload = () => {
|
||||
setBackgroundLoaded1920(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader2880 = new Image();
|
||||
imageLoader2880.src = `${AWS_PATH}/blog-background-2880x1620.png`;
|
||||
imageLoader2880.onload = () => {
|
||||
setBackgroundLoaded2880(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader3840 = new Image();
|
||||
imageLoader3840.src = `${AWS_PATH}/blog-background-3840x2160.png`;
|
||||
imageLoader3840.onload = () => {
|
||||
setBackgroundLoaded3840(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
const margin = ui.isMobileView ? "7%" : "25%";
|
||||
|
||||
return (
|
||||
<Flex
|
||||
bgPos="bottom"
|
||||
bgColor="transparent"
|
||||
backgroundImage={`url(${assets[`${background}`]})`}
|
||||
bgSize="cover"
|
||||
// boxSize="full"
|
||||
minH="100vh"
|
||||
direction="column"
|
||||
alignItems="center"
|
||||
>
|
||||
<Stack mx={margin} my={12} maxW="1700px">
|
||||
<Heading as="h2" size="md" w="100%" px={12} py={2} borderTopRadius="xl">
|
||||
Vision
|
||||
</Heading>
|
||||
<chakra.span pl={2} px={12} py={2}>
|
||||
<Text mb={2}>
|
||||
Our goal is to provide a live view of the transactions taking place
|
||||
on <b>every</b> public blockchain.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
We aim to go far beyond raw transaction information, enriching our
|
||||
view with context from centralized exchanges, the news, social
|
||||
media, and smart contract analysis.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
Data is only as good as the decisions it informs. We are building
|
||||
Moonstream to be much more than a database. We are building
|
||||
Moonstream to be an execution engine, where anyone can set up
|
||||
triggers based on Moonstream events. Triggers can submit
|
||||
transactions to any blockchain or they can call external APIs via
|
||||
webhooks.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
Moonstream will be accessible to humans through our dashboard and
|
||||
notification system.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
Moonstream will be accessible to software through our API and
|
||||
webhooks.
|
||||
</Text>
|
||||
</chakra.span>
|
||||
</Stack>
|
||||
<Stack mx={margin} mb={12} maxW="1700px" bgTra>
|
||||
<Heading as="h2" size="md" w="100%" px={12} py={2} borderTopRadius="xl">
|
||||
Product
|
||||
</Heading>
|
||||
<chakra.span pl={2} px={12} py={2}>
|
||||
<Text mb={2}>
|
||||
Moonstream is a product which helps anyone participate in
|
||||
decentralized finance. From the most sophisticated flash
|
||||
arbitrageurs to people looking for yield from currency that would
|
||||
otherwise lie dormant in their exchange accounts.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
We aim to go far beyond raw transaction information, enriching our
|
||||
view with context from centralized exchanges, the news, social
|
||||
media, and smart contract analysis.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
Moonstream users can subscribe to events from any blockchain - from
|
||||
the activity of specific accounts or smart contracts to updates
|
||||
about general market movements. This information comes from the
|
||||
blockchains themselves, from their mempools/transaction pools, and
|
||||
from centralized exchanges, social media, and the news. This forms a
|
||||
stream of information tailored to their specific needs.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
They can use this information to execute transactions directly from
|
||||
the Moonstream frontend or they can set up programs which execute
|
||||
(on- or off-chain) when their stream meets certain conditions.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
Moonstream will be accessible to software through our API and
|
||||
webhooks.
|
||||
</Text>
|
||||
<chakra.span>
|
||||
<Text>Moonstream customers are:</Text>
|
||||
<UnorderedList w="75%" pl={4}>
|
||||
<ListItem>
|
||||
<b>Development teams deploying decentralized applications -</b>
|
||||
They use Moonstream to analyze how users are calling their
|
||||
dapps, and set up alerts for suspicious activity.{" "}
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>Algorithmic funds - </b> They use Moonstream to execute
|
||||
transactions directly on-chain under prespecified conditions.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>Crypto traders -</b> They use Moonstream to evaluate trading
|
||||
strategies based on data from centralized exchanges, the
|
||||
blockchain, and the transaction pool.
|
||||
</ListItem>
|
||||
</UnorderedList>
|
||||
</chakra.span>
|
||||
<Text my={2}>
|
||||
Moonstream’s financial inclusion goes beyond providing access to
|
||||
data. We also help validators and stakers on proof of stake chains
|
||||
earn rewards in excess of the validation rewards. We pay validators
|
||||
to send mempool/transaction pool data back to Moonstream, and they
|
||||
divide these payments between themselves and their stakers. This
|
||||
helps validators attract more stake on proof of stake blockchains
|
||||
like Algorand, Solana, and post-merge Ethereum. It also ensures that
|
||||
Moonstream users have access to the freshest and most geographically
|
||||
diverse transaction pool data on the market.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
All of our work is open source as we do not believe that proprietary
|
||||
technologies are financially inclusive.{" "}
|
||||
<Link
|
||||
textColor="primary.500"
|
||||
isExternal
|
||||
href="https://github.com/bugout-dev/moonstream"
|
||||
>
|
||||
You can read our code on GitHub.
|
||||
</Link>
|
||||
</Text>
|
||||
</chakra.span>
|
||||
</Stack>
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
export default Product;
|
||||
|
|
@ -16,7 +16,7 @@ import Icon from "../../src/components/CustomIcon";
|
|||
import useSignUp from "../../src/core/hooks/useSignUp";
|
||||
import useUser from "../../src/core/hooks/useSignUp";
|
||||
import useRouter from "../../src/core/hooks/useSignUp";
|
||||
import { DEFAULT_METATAGS } from "../../src/components/constants";
|
||||
import { DEFAULT_METATAGS } from "../../src/core/constants";
|
||||
|
||||
export async function getStaticProps() {
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,267 @@
|
|||
import React, { useEffect, useState, useLayoutEffect, useContext } from "react";
|
||||
import {
|
||||
Heading,
|
||||
Text,
|
||||
Flex,
|
||||
Link,
|
||||
Stack,
|
||||
chakra,
|
||||
useMediaQuery,
|
||||
UnorderedList,
|
||||
ListItem,
|
||||
} from "@chakra-ui/react";
|
||||
import { DEFAULT_METATAGS } from "../../src/core/constants";
|
||||
import UIContext from "../../src/core/providers/UIProvider/context";
|
||||
|
||||
const AWS_PATH =
|
||||
"https://s3.amazonaws.com/static.simiotics.com/moonstream/assets";
|
||||
|
||||
const assets = {
|
||||
background720: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
background1920: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
background2880: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
background3840: `${AWS_PATH}/blog-background-720x405.png`,
|
||||
};
|
||||
|
||||
const Product = () => {
|
||||
const ui = useContext(UIContext);
|
||||
const [background, setBackground] = useState("background720");
|
||||
const [backgroundLoaded720, setBackgroundLoaded720] = useState(false);
|
||||
const [backgroundLoaded1920, setBackgroundLoaded1920] = useState(false);
|
||||
const [backgroundLoaded2880, setBackgroundLoaded2880] = useState(false);
|
||||
const [backgroundLoaded3840, setBackgroundLoaded3840] = useState(false);
|
||||
|
||||
const [
|
||||
isLargerThan720px,
|
||||
isLargerThan1920px,
|
||||
isLargerThan2880px,
|
||||
isLargerThan3840px,
|
||||
] = useMediaQuery([
|
||||
"(min-width: 720px)",
|
||||
"(min-width: 1920px)",
|
||||
"(min-width: 2880px)",
|
||||
"(min-width: 3840px)",
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
assets["background720"] = `${AWS_PATH}/blog-background-720x405.png`;
|
||||
assets["background1920"] = `${AWS_PATH}/blog-background-1920x1080.png`;
|
||||
assets["background2880"] = `${AWS_PATH}/blog-background-2880x1620.png`;
|
||||
assets["background3840"] = `${AWS_PATH}/blog-background-3840x2160.png`;
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
if (backgroundLoaded3840) {
|
||||
setBackground("background3840");
|
||||
} else if (backgroundLoaded2880) {
|
||||
setBackground("background2880");
|
||||
} else if (backgroundLoaded1920) {
|
||||
setBackground("background1920");
|
||||
} else {
|
||||
setBackground("background720");
|
||||
}
|
||||
}, [
|
||||
isLargerThan720px,
|
||||
isLargerThan1920px,
|
||||
isLargerThan2880px,
|
||||
isLargerThan3840px,
|
||||
backgroundLoaded720,
|
||||
backgroundLoaded1920,
|
||||
backgroundLoaded2880,
|
||||
backgroundLoaded3840,
|
||||
]);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader720 = new Image();
|
||||
imageLoader720.src = `${AWS_PATH}/blog-background-720x405.png`;
|
||||
imageLoader720.onload = () => {
|
||||
setBackgroundLoaded720(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader1920 = new Image();
|
||||
imageLoader1920.src = `${AWS_PATH}/blog-background-1920x1080.png`;
|
||||
imageLoader1920.onload = () => {
|
||||
setBackgroundLoaded1920(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader2880 = new Image();
|
||||
imageLoader2880.src = `${AWS_PATH}/blog-background-2880x1620.png`;
|
||||
imageLoader2880.onload = () => {
|
||||
setBackgroundLoaded2880(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
const imageLoader3840 = new Image();
|
||||
imageLoader3840.src = `${AWS_PATH}/blog-background-3840x2160.png`;
|
||||
imageLoader3840.onload = () => {
|
||||
setBackgroundLoaded3840(true);
|
||||
};
|
||||
}, []);
|
||||
|
||||
const margin = ui.isMobileView ? "3%" : "22%";
|
||||
|
||||
return (
|
||||
<Flex
|
||||
bgPos="bottom"
|
||||
bgColor="transparent"
|
||||
backgroundImage={`url(${assets[`${background}`]})`}
|
||||
bgSize="cover"
|
||||
minH="100vh"
|
||||
direction="column"
|
||||
alignItems="center"
|
||||
w="100%"
|
||||
>
|
||||
<Stack mx={margin} my={6} maxW="1700px">
|
||||
<Heading as="h2" size="md" w="100%" px={12} py={2} borderTopRadius="xl">
|
||||
Meet The Moonstream Team
|
||||
</Heading>
|
||||
<chakra.span pl={2} px={12} py={2}>
|
||||
<Text mb={2}>
|
||||
We are a distributed team of nerds with very strong expertise in
|
||||
math, software engineering, machine learning, and cryptography.
|
||||
Members of our team worked at Google, at OpenAI and other great
|
||||
companies.
|
||||
</Text>
|
||||
<Text mb={2}>
|
||||
We believe that the crypto world opens opportunities for financial
|
||||
inclusion. Meaning that people from all walks of life and financial
|
||||
situations can have a new source of income. We are passionate about
|
||||
developing technology that helps people become active participants
|
||||
in this field and take advantage of this opportunity. We’re striving
|
||||
to debunk harmful stereotypes and make the crypto field more
|
||||
inclusive.
|
||||
</Text>
|
||||
</chakra.span>
|
||||
</Stack>
|
||||
<Stack mx={margin} my={6} maxW="1700px">
|
||||
<Heading
|
||||
as="h2"
|
||||
size="md"
|
||||
w="100%"
|
||||
// bgColor="gray.200"
|
||||
px={12}
|
||||
py={2}
|
||||
borderTopRadius="xl"
|
||||
>
|
||||
Values that we share within our team:
|
||||
</Heading>
|
||||
<chakra.span pl={2} px={12} py={2}>
|
||||
<UnorderedList w="75%" pl={4}>
|
||||
<ListItem>
|
||||
<b> Be bold</b>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>Don’t be an ass</b>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>And always be kind to each other</b>
|
||||
</ListItem>
|
||||
</UnorderedList>
|
||||
<Text my={2}>
|
||||
We are always looking to hire new talents, regardless of their
|
||||
backgrounds. If you are interested in working with us, send us a
|
||||
message at{" "}
|
||||
<Link
|
||||
textColor="secondary.900"
|
||||
href="mailto: careers@moonstream.to"
|
||||
>
|
||||
careers@moonstream.to
|
||||
</Link>
|
||||
</Text>
|
||||
</chakra.span>
|
||||
</Stack>
|
||||
<Stack mx={margin} mb={12} maxW="1700px">
|
||||
<Heading
|
||||
as="h2"
|
||||
size="md"
|
||||
w="100%"
|
||||
// bgColor="gray.200"
|
||||
px={12}
|
||||
py={2}
|
||||
borderTopRadius="xl"
|
||||
>
|
||||
Our engineering team
|
||||
</Heading>
|
||||
<chakra.span pl={2} px={12} py={2}>
|
||||
<UnorderedList w="75%" pl={4} spacing={2}>
|
||||
<ListItem>
|
||||
<b>zomglings,</b> Founder. Number theorist. Loves playing chess
|
||||
while programming. Fan of GO, backgammon, and video games.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>kompotkot -</b>Keeper of Secrets. Likes information security
|
||||
since childhood, loves mountains and goes hiking from time to
|
||||
time. Had a close call with a wild bear in a forest once.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>wizarikus -</b>Wizard. Loves mountains, bicycling, and hiking.
|
||||
A practicing Python wizard. Also likes to cook and play the guitar
|
||||
in between data witchcraft.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>peersky -</b>
|
||||
{`Spectral hopper. Perceives the world as a
|
||||
spectrum interacting with and within the observer's mind. Loves
|
||||
to shift in time domain to spend some of it doing fire
|
||||
performances, surfing, and connecting with nature.`}
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>yhtyyar -</b>
|
||||
{`Wunderkind. Interested in Math, NLP. Loves
|
||||
programming language parsing and Algorithms & Data structures.
|
||||
Implementing his own dialect of LISP programming language for
|
||||
scientific calculations.`}
|
||||
</ListItem>
|
||||
</UnorderedList>
|
||||
</chakra.span>
|
||||
</Stack>
|
||||
<Stack mx={margin} mb={12} maxW="1700px">
|
||||
<Heading as="h2" size="md" w="100%" px={12} py={2} borderTopRadius="xl">
|
||||
Our marketing and growth team
|
||||
</Heading>
|
||||
<chakra.span pl={2} px={12} py={2}>
|
||||
<UnorderedList w="75%" pl={4}>
|
||||
<ListItem>
|
||||
<b>Pahita.</b> Dreamer. An alien who pretends to be a human. So
|
||||
far so good. Loves ecstatic dance, being alone in nature and
|
||||
dreaming.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>In_technicolor,</b>Mediator. Loves stand-up comedy and crying
|
||||
at nights. Volunteered at a horse farm once. Portrait artist, puts
|
||||
the pain in painting.
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<b>Nanaland.</b>Progress and Enthusiasm. Traveled to the North
|
||||
Korean border at the age of 19. Half German. Counseling
|
||||
psychologist who switched to tech marketing and sales.
|
||||
</ListItem>
|
||||
</UnorderedList>
|
||||
</chakra.span>
|
||||
</Stack>
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
export async function getStaticProps() {
|
||||
const assetPreload = Object.keys(assets).map((key) => {
|
||||
return {
|
||||
rel: "preload",
|
||||
href: assets[key],
|
||||
as: "image",
|
||||
};
|
||||
});
|
||||
const preconnects = [{ rel: "preconnect", href: "https://s3.amazonaws.com" }];
|
||||
|
||||
const preloads = assetPreload.concat(preconnects);
|
||||
|
||||
return {
|
||||
props: { metaTags: { ...DEFAULT_METATAGS }, preloads },
|
||||
};
|
||||
}
|
||||
export default Product;
|
||||
|
|
@ -1,106 +0,0 @@
|
|||
import { useUser, useRouter } from "../core/hooks";
|
||||
import React, { useEffect, Fragment, useState } from "react";
|
||||
import { Heading, Center, Spinner, Link, Button } from "@chakra-ui/react";
|
||||
import RouterLink from "next/link";
|
||||
const ACCOUNT_SCREEN_WIDGETS = {
|
||||
tokens: "tokens",
|
||||
security: "security",
|
||||
teams: "teams",
|
||||
};
|
||||
|
||||
const AccountNavbar = () => {
|
||||
const router = useRouter();
|
||||
const [CurrentWidget, setCurrentWidget] = useState();
|
||||
const { user, isInit } = useUser();
|
||||
|
||||
useEffect(() => {
|
||||
if (isInit) {
|
||||
if (user) {
|
||||
if (router.pathname === "/account") {
|
||||
router.replace("/account/teams");
|
||||
}
|
||||
} else {
|
||||
router.replace("/register");
|
||||
}
|
||||
}
|
||||
}, [router, CurrentWidget, user, isInit]);
|
||||
|
||||
useEffect(() => {
|
||||
setCurrentWidget(router.nextRouter.query.page);
|
||||
}, [setCurrentWidget, router.nextRouter.query.page]);
|
||||
|
||||
if (!user && !isInit)
|
||||
return (
|
||||
<Center>
|
||||
<Spinner
|
||||
hidden={false}
|
||||
my={32}
|
||||
size="lg"
|
||||
color="primary.500"
|
||||
thickness="4px"
|
||||
speed="1.5s"
|
||||
/>
|
||||
</Center>
|
||||
);
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<Center>
|
||||
<Heading as="h1" fontSize={["md", "lg"]} py={4} color="black.100">
|
||||
My Account
|
||||
</Heading>
|
||||
</Center>
|
||||
|
||||
<Link
|
||||
as={RouterLink}
|
||||
href={`/account/${ACCOUNT_SCREEN_WIDGETS.teams}`}
|
||||
passHref
|
||||
>
|
||||
<Button
|
||||
isActive={CurrentWidget === ACCOUNT_SCREEN_WIDGETS.teams}
|
||||
// ref={TeamsButtonRef}
|
||||
// href={`/account/${ACCOUNT_SCREEN_WIDGETS.teams}`}
|
||||
variant="accountMenu"
|
||||
colorScheme="secondary"
|
||||
as={Link}
|
||||
>
|
||||
Teams
|
||||
</Button>
|
||||
</Link>
|
||||
<Link
|
||||
as={RouterLink}
|
||||
href={`/account/${encodeURIComponent(ACCOUNT_SCREEN_WIDGETS.tokens)}`}
|
||||
passHref
|
||||
>
|
||||
<Button
|
||||
as={Link}
|
||||
isActive={CurrentWidget === ACCOUNT_SCREEN_WIDGETS.tokens}
|
||||
// ref={TokensButtonRef}
|
||||
colorScheme="secondary"
|
||||
variant="accountMenu"
|
||||
>
|
||||
Tokens
|
||||
</Button>
|
||||
</Link>
|
||||
<Link
|
||||
as={RouterLink}
|
||||
href={`/account/${ACCOUNT_SCREEN_WIDGETS.security}`}
|
||||
passHref
|
||||
>
|
||||
<Button
|
||||
isActive={CurrentWidget === ACCOUNT_SCREEN_WIDGETS.security}
|
||||
as={Link}
|
||||
// ref={SecurityButtonRef}
|
||||
// as={RouterLink}
|
||||
// href={`/account/${ACCOUNT_SCREEN_WIDGETS.security}`}
|
||||
variant="accountMenu"
|
||||
colorScheme="secondary"
|
||||
>
|
||||
Security
|
||||
</Button>
|
||||
</Link>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
export default AccountNavbar;
|
||||
|
|
@ -28,6 +28,7 @@ import useRouter from "../core/hooks/useRouter";
|
|||
import UIContext from "../core/providers/UIProvider/context";
|
||||
import AccountIconButton from "./AccountIconButton";
|
||||
import RouteButton from "./RouteButton";
|
||||
import { USER_NAV_PATHES, ALL_NAV_PATHES } from "../core/constants";
|
||||
|
||||
const AppNavbar = () => {
|
||||
const ui = useContext(UIContext);
|
||||
|
|
@ -97,13 +98,37 @@ const AppNavbar = () => {
|
|||
<Flex width="100%" px={2}>
|
||||
<Spacer />
|
||||
<Flex placeSelf="flex-end">
|
||||
<ButtonGroup spacing={4}>
|
||||
{/* <RouteButton variant="link" href="/docs">
|
||||
Docs
|
||||
</RouteButton> */}
|
||||
<RouteButton variant="link" href="/welcome">
|
||||
Learn how to
|
||||
</RouteButton>
|
||||
<ButtonGroup spacing={4} colorScheme="secondary">
|
||||
{ALL_NAV_PATHES.map((item, idx) => (
|
||||
<RouteButton
|
||||
key={`${idx}-${item.title}-landing-all-links`}
|
||||
variant="link"
|
||||
href={item.path}
|
||||
color="white"
|
||||
isActive={!!(router.nextRouter.pathname === item.path)}
|
||||
>
|
||||
{item.title}
|
||||
</RouteButton>
|
||||
))}
|
||||
{USER_NAV_PATHES.map((item, idx) => {
|
||||
console.log(
|
||||
"item.path:",
|
||||
item.path,
|
||||
"pathname:",
|
||||
router.nextRouter.pathname
|
||||
);
|
||||
return (
|
||||
<RouteButton
|
||||
key={`${idx}-${item.title}-navlink`}
|
||||
variant="link"
|
||||
href={item.path}
|
||||
color="white"
|
||||
isActive={!!(router.nextRouter.pathname === item.path)}
|
||||
>
|
||||
{item.title}
|
||||
</RouteButton>
|
||||
);
|
||||
})}
|
||||
</ButtonGroup>
|
||||
<SupportPopover />
|
||||
<AccountIconButton
|
||||
|
|
|
|||
|
|
@ -14,6 +14,8 @@ import useModals from "../core/hooks/useModals";
|
|||
import UIContext from "../core/providers/UIProvider/context";
|
||||
import ChakraAccountIconButton from "./AccountIconButton";
|
||||
import RouteButton from "./RouteButton";
|
||||
import { ALL_NAV_PATHES } from "../core/constants";
|
||||
import router from "next/router";
|
||||
|
||||
const LandingNavbar = () => {
|
||||
const ui = useContext(UIContext);
|
||||
|
|
@ -53,16 +55,17 @@ const LandingNavbar = () => {
|
|||
spacing={4}
|
||||
pr={16}
|
||||
>
|
||||
{ui.isLoggedIn && (
|
||||
<ButtonGroup spacing={4}>
|
||||
{/* <RouteButton variant="link" href="/docs">
|
||||
Docs
|
||||
</RouteButton> */}
|
||||
<RouteButton variant="link" href="/welcome">
|
||||
Learn how to
|
||||
</RouteButton>
|
||||
</ButtonGroup>
|
||||
)}
|
||||
{ALL_NAV_PATHES.map((item, idx) => (
|
||||
<RouteButton
|
||||
key={`${idx}-${item.title}-landing-all-links`}
|
||||
variant="link"
|
||||
href={item.path}
|
||||
color="white"
|
||||
isActive={!!(router.pathname === item.path)}
|
||||
>
|
||||
{item.title}
|
||||
</RouteButton>
|
||||
))}
|
||||
|
||||
{ui.isLoggedIn && (
|
||||
<RouterLink href="/stream" passHref>
|
||||
|
|
|
|||
|
|
@ -1,25 +0,0 @@
|
|||
export const PERMISSION_LEVELS = { none: 0, member: 1, admin: 10, owner: 100 };
|
||||
|
||||
export const PRESIGNED_URL_TYPE = {
|
||||
SESSIONS: "session",
|
||||
CLIENTS: "client",
|
||||
REPORTS: "stats",
|
||||
ERRORS: "errors",
|
||||
};
|
||||
|
||||
export const DEFAULT_METATAGS = {
|
||||
title: "Bugout: Measure the success of your dev tool",
|
||||
description:
|
||||
"Get usage metrics and crash reports. Improve your users' experience",
|
||||
keywords:
|
||||
"bugout, bugout-dev, bugout.dev, usage-metrics, analytics, dev-tool ,knowledge, docs, journal, entry, find-anything",
|
||||
url: "https://bugout.dev",
|
||||
image: "https://s3.amazonaws.com/static.simiotics.com/landing/aviator-2.svg",
|
||||
};
|
||||
|
||||
export const PRESERVE_QUERY_ACROSS_JOURNALS = false;
|
||||
export const PRICING_OPTIONS = { DEV: 1, NIGHTLY: 2, STABLE: 3 };
|
||||
|
||||
const constants = { PERMISSION_LEVELS, PRESIGNED_URL_TYPE, DEFAULT_METATAGS };
|
||||
|
||||
export default constants;
|
||||
|
|
@ -4,3 +4,31 @@ export const BUGOUT_ENDPOINTS = {
|
|||
Usage: "usage",
|
||||
Web: "parasite",
|
||||
};
|
||||
|
||||
export const DEFAULT_METATAGS = {
|
||||
title: "Moonstream.to: All your crypto data in one stream",
|
||||
description:
|
||||
"From the Ethereum transaction pool to Elon Musk’s latest tweets get all the crypto data you care about in one stream.",
|
||||
keywords:
|
||||
"blockchain, crypto, data, trading, smart contracts, ethereum, solana, transactions, defi, finance, decentralized",
|
||||
url: "https://www.moonstream.to",
|
||||
image: `https://s3.amazonaws.com/static.simiotics.com/moonstream/assets/crypto+traders.png`,
|
||||
};
|
||||
|
||||
export const ALL_NAV_PATHES = [
|
||||
{
|
||||
title: "Product",
|
||||
path: "/product",
|
||||
},
|
||||
{
|
||||
title: "Team",
|
||||
path: "/team",
|
||||
},
|
||||
];
|
||||
|
||||
export const USER_NAV_PATHES = [
|
||||
{
|
||||
title: "Learn how to",
|
||||
path: "/welcome",
|
||||
},
|
||||
];
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue