Skip to content

Commit

Permalink
fix: Small changes for dev gateway
Browse files Browse the repository at this point in the history
This commit includes changes to the home page and contact-us page
of the Gateway, as well as it includes a new Dropdown menu based
on the user name instead of its picture
  • Loading branch information
gagdiez committed Jun 7, 2024
1 parent d089c7f commit d8e8ae3
Show file tree
Hide file tree
Showing 3 changed files with 83 additions and 54 deletions.
59 changes: 16 additions & 43 deletions src/Gateway/ContactUsPage.jsx
Original file line number Diff line number Diff line change
@@ -1,18 +1,15 @@
const urls = {
devHub: "https://near.org/devhub.near/widget/app",
discord: "http://near.chat",
discourse: "https://gov.near.org",
docs: "https://docs.near.org",
facebook: "https://www.facebook.com/NEARProtocol",
getFunding: "https://near.org/ecosystem/get-funding",
github: "https://github.com/near",
hackenproof: "https://hackenproof.com/near",
helpCenter: "https://nearhelp.zendesk.com/hc/en-us",
nearWallet: "https://wallet.near.org/",
nearWeek: "https://subscribe.nearweek.com/",
reddit: "https://www.reddit.com/r/nearprotocol",
supportRequest: "https://nearhelp.zendesk.com/hc/en-us/requests/new",
telegram: "https://t.me/cryptonear",
telegram: "https://t.me/neardev",
twitter: "https://twitter.com/nearprotocol",
wechat: "https://pages.near.org/wechat",
withdrawNearFunds:
Expand All @@ -21,11 +18,6 @@ const urls = {
};

const channels = [
{
icon: "ph-users",
label: "DevHub",
url: urls.devHub,
},
{
icon: "ph-telegram-logo",
label: "Telegram",
Expand All @@ -36,31 +28,6 @@ const channels = [
label: "Discord",
url: urls.discord,
},
{
icon: "ph-chats-teardrop",
label: "Discourse",
url: urls.discourse,
},
{
icon: "ph-facebook-logo",
label: "Facebook",
url: urls.facebook,
},
{
icon: "ph-reddit-logo",
label: "Reddit",
url: urls.reddit,
},
{
icon: "ph-wifi-high",
label: "Warpcast",
url: "https://warpcast.com/~/channel/near",
},
{
icon: "ph-youtube-logo",
label: "YouTube",
url: urls.youtube,
},
{
icon: "ph-github-logo",
label: "GitHub",
Expand Down Expand Up @@ -350,27 +317,33 @@ return (
<Flex $direction="column" $gap="1.5rem">
<Card $background="violet5" $color="violet12" style={{ flexGrow: 1 }}>
<Text $size="text-l" $fontWeight="700">
Help Center
Chat Support
</Text>

<Text>Find articles about popular services and topics.</Text>
<Text>Chat with our developers and get live support</Text>

<IconTextLink href={urls.helpCenter} target="_blank" $iconColor="violet11">
<i className="ph-bold ph-book-open-text" />
<span>Launch help center</span>
<IconTextLink href={urls.telegram} target="_blank" $iconColor="violet11">
<i className="ph-bold ph-telegram-logo" />
<span>Telegram Support</span>
</IconTextLink>
<IconTextLink href={urls.discord} target="_blank" $iconColor="violet11">
<i className="ph-bold ph-discord-logo" />
<span>Discord Support</span>
</IconTextLink>

</Card>

<Card $background="amber5" $color="amber12" style={{ flexGrow: 1 }}>
<Text $size="text-l" $fontWeight="700">
Resolve an issue
Office Hours
</Text>

<Text>Get in touch with our Customer Care Team.</Text>
<Text>Jump in a voice call with our developers </Text>
<Text> Thursdays - 11hs & 18hs (UTC) </Text>

<IconTextLink href={urls.supportRequest} target="_blank" $iconColor="amber11">
<IconTextLink href={urls.discord} target="_blank" $iconColor="amber11">
<i className="ph-bold ph-chat-circle-dots" />
<span>Launch support form</span>
<span>Join our Discord</span>
</IconTextLink>
</Card>
</Flex>
Expand Down
20 changes: 9 additions & 11 deletions src/Gateway/Home.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -395,23 +395,21 @@ return (
<Flex $direction="column" $gap="32px">
<H1>Welcome</H1>
<Text $size="text-xl" $mobileSize="text-l" style={{ maxWidth: "385px" }}>
Start building right away with easy to use tutorials.
Start building right away and get in contact with us.
</Text>
</Flex>
<Flex $direction="column" $gap="16px" $mobileGap="48px">
<ButtonLink
href="https://app.jutsu.ai"
target="_blank"
icon="ph-bold ph-plus"
title="Create a UI Project"
text="Start tinkering with Jutsu.ai using a template or start a blank project."
href="/documentation"
icon="ph-bold ph-book-open-text"
title="Read the Docs"
text="Learn everything about NEAR in our official documentation"
/>
<ButtonLink
href="https://docs.near.org/build/smart-contracts/quickstart"
target="_blank"
icon="ph-bold ph-code-block"
title="Smart Contracts"
text="Learn how to create your first smart contract in NEAR testnet."
href="/contact-us"
icon="ph-bold ph-question"
title="Reach Out"
text="Discover all the channels where you can get in touch with us"
/>
</Flex>
</Grid>
Expand Down
58 changes: 58 additions & 0 deletions src/Navigation/NameDropdown.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
let { accountId, profile, availableStorage, withdrawTokens, logOut } = props;

accountId = accountId ?? context.accountId;
profile = profile ?? Social.get(`${accountId}/profile/**`, "final");

const profilePage = `/${REPL_ACCOUNT}/widget/ProfilePage?accountId=${accountId}`;

const handleWithdraw = () => {
if (withdrawTokens) {
withdrawTokens();
} else {
console.log("withdrawTokens function not provided");
}
};

const handleLogOut = () => {
if (logOut) {
logOut();
} else {
console.log("logOut function not provided");
}
};

const menuItems = [
{
name: "Profile",
iconLeft: "ph-duotone ph-user",
href: profilePage,
},
{
name: "Settings",
iconLeft: "ph-duotone ph-gear",
href: "/settings",
},
{
name: `Withdraw ${availableStorage ?? 0}kb`,
iconLeft: "ph-duotone ph-bank",
onSelect: handleWithdraw,
disabled: !availableStorage,
},
{
name: "Log out",
iconLeft: "ph-duotone ph-sign-out",
onSelect: handleLogOut,
},
];

return (
<Widget
src="${REPL_ACCOUNT}/widget/DIG.DropdownMenu"
props={{
trigger: (
profile.name
),
items: menuItems,
}}
/>
);

0 comments on commit d8e8ae3

Please sign in to comment.