Merge pull request #1344 from matiasbenary/feat/communities

feature: update communities page

src/components/communities/faqs.tsx

@@ -0,0 +1,112 @@
+import { Accordion } from '@near-pagoda/ui';
+import styled from 'styled-components';
+
+import { useCommunities } from '@/hooks/useCommunities';
+
+const Link = styled.a`
+  color: var(--violet8);
+  text-decoration: none;
+  font-weight: bold;
+  &:hover {
+    text-decoration: underline;
+  }
+`;
+
+function FAQS() {
+  const { urls } = useCommunities();
+
+  const faqs = [
+    {
+      question: 'What is the expectation for a support resolution?',
+      answer: `Upon submitting a support ticket, you can expect to receive an initial response from our team within 72 hours
+          during our business hours. Our business hours are on weekdays in the PST timezone, excluding US holidays.`,
+    },
+    {
+      question: 'Where can I find help to troubleshoot a development issue?',
+      answer: (
+        <>
+          Social channels such as <Link href={urls.telegram}>Telegram</Link> and{' '}
+          <Link href={urls.discord}>Discord</Link> are a great resource to tap into for community support on development
+          issues. If you can&apos;t find a solution, please submit a{' '}
+          <Link href={urls.supportRequest}>support request</Link> to our Customer Care team.
+        </>
+      ),
+    },
+    {
+      question: 'Where can I find funding for my project?',
+      answer: (
+        <>
+          You can find information on grants and funding opportunities on the{' '}
+          <Link href={'https://near.org/ecosystem/get-funding'}> main NEAR portal </Link>.
+        </>
+      ),
+    },
+    {
+      question: 'How can I find out about the latest product developments?',
+      answer: (
+        <>
+          Follow <Link href={urls.twitter}>NEAR on X</Link> for our latest product announcements or subscribe to{' '}
+          <Link href={urls.nearWeek}>NEAR Week</Link> to receive their weekly newsletter on ecosystem announcements.
+        </>
+      ),
+    },
+    {
+      question: 'I found a bug — where can I flag this?',
+      answer: (
+        <>
+          For any issues or concerns you&apos;ve encountered, please feel free to provide us with detailed information
+          through our{' '}
+          <Link href={urls.hackenproof} target="_blank">
+            Bug Bounty Program
+          </Link>
+          . Your cooperation and additional details will assist us in addressing and resolving any potential
+          vulnerabilities effectively. We appreciate your proactive approach in helping us maintain the security and
+          integrity of the NEAR ecosystem. If you have any further questions or need assistance, don&apos;t hesitate to
+          reach out to us.
+        </>
+      ),
+    },
+    {
+      question: 'What happened to Near Wallet?',
+      answer: (
+        <>
+          As we embrace a more decentralized future, wallet.near.org will be discontinued. This change invites you to
+          discover a variety of new and secure wallet options within our ecosystem. Your funds are safe! Accounts exist
+          on the blockchain, not in a wallet. Wallets are just an interface into using the blockchain with your account.{' '}
+          <Link href={urls.nearWallet} target="_blank">
+            Learn more
+          </Link>{' '}
+        </>
+      ),
+    },
+    {
+      question: 'Question about Transfer Exchange?',
+      answer:
+        "For issues relating to a third-party exchange, such as Binance or Coinbase we're unable to investigate issues on external platforms like these. To address your concern effectively, we recommend contacting the customer support team of the specific exchange where you're experiencing issues. They are most equipped to assist you in resolving the matter.",
+    },
+    {
+      question: 'How do I withdraw NEAR funds?',
+      answer: (
+        <>
+          Your NEAR funds are managed within your chosen wallet. To best address your question we suggest you visit the
+          support site for your wallet that holds your NEAR funds. For generalized steps see{' '}
+          <Link href={urls.withdrawNearFunds}>this article</Link>.
+        </>
+      ),
+    },
+  ];
+  return (
+    <Accordion.Root type="multiple">
+      {faqs.map((item, index) => (
+        <Accordion.Item value={item.question} key={index}>
+          <Accordion.Trigger>{item.question}</Accordion.Trigger>
+          <Accordion.Content>
+            <div>{item.answer}</div>
+          </Accordion.Content>
+        </Accordion.Item>
+      ))}
+    </Accordion.Root>
+  );
+}
+
+export default FAQS;

src/components/sidebar-navigation/Sidebar.tsx

@@ -149,10 +149,10 @@ export const Sidebar = () => {
               </S.NavigationItem>
             </Tooltip>
 
-            <Tooltip content="Support" side="right" disabled={tooltipsDisabled}>
-              <S.NavigationItem $active={isNavigationItemActive('/contact-us')} $type="featured" href="/contact-us">
+            <Tooltip content="Community Support" side="right" disabled={tooltipsDisabled}>
+              <S.NavigationItem $active={isNavigationItemActive('/communities')} $type="featured" href="/communities">
                 <i className="ph-bold ph-question" />
-                <span>Support</span>
+                <span>Community Support</span>
               </S.NavigationItem>
             </Tooltip>
           </S.Stack>

src/hooks/useCommunities.ts

@@ -0,0 +1,122 @@
+const featuredCommunities = [
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreibysr2mkwhb4j36h2t7mqwhynqdy4vzjfygfkfg65kuspd2bawauu',
+    name: 'NEAR Dev',
+    summary: 'An open community for developers',
+    accountId: 'nearai.community.devhub.near',
+    telegram: 'nearaialpha',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreihgxkxuvj67b7vwys5di2326vx7sdvw5jjswv2xqlyxhelhha52ra',
+    name: 'NEAR AI',
+    summary: 'A community for AI enthusiasts',
+    accountId: 'nearai.community.devhub.near',
+    telegram: 'nearaialpha',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreibi2p7h2jailau6fwt4zf2xdifsqhc4dabsowmngzswpzr7r4ikiq',
+    name: 'Chain Abstraction',
+    summary: 'Chain and Account Abstraction',
+    accountId: 'chain-abstraction.community.devhub.near',
+    telegram: 'chain_abstraction',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreidhehq7za5btjegq5u2rw5jmw2kygef2776d6qcpkopaa3nphg5pm',
+    name: 'Tooling',
+    summary: 'Supporting our tooling ecosystem',
+    accountId: 'tooling.community.devhub.near',
+    telegram: 'NEAR_Tools_Community_Group',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreib45plxkuy6wcefachijuq2dm4jnfs4236yhfleehqboeeljpmxje',
+    name: 'Docs',
+    summary: 'A space to talk about all NEAR docs',
+    accountId: 'docs.community.devhub.near',
+    telegram: 'neardocscg',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreicfcszhhmiw6bq5fvh7ebfqhmodplldxjve7id4mi67iykz67qehi',
+    name: 'Build DAO',
+    summary: 'The more you ship, the more you level up',
+    accountId: 'build.community.devhub.near',
+    telegram: '+bQmGfDqcAT9iYTcx',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreihdu5bsnvxoxi62j24ljd4o5gfebtgtn6gaj3n4ebq23qoprn7tou',
+    name: 'Wallet Builders',
+    summary: 'Building Wallet infrastructure on NEAR',
+    accountId: 'wallet.community.devhub.near',
+    telegram: 'wallet-builders',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreihmospumgywngdgtxpqftry3sykqyljr7xzvtqhlktg36vy4f4djq',
+    name: 'Validators',
+    summary: 'Ensuring a healthy & efficient ecosystem',
+    accountId: 'validators.community.devhub.near',
+    telegram: 'near_validators',
+  },
+  {
+    icon: 'https://ipfs.near.social/ipfs/bafkreifydvg7r7e34j5chme633yjhk6lqyhbesmdcd2ninjx6dyl46qyey',
+    name: 'Near Ukraine',
+    summary: 'Community of Developers, Builders, Founders',
+    accountId: 'nearukraine.community.devhub.near',
+    telegram: 'nearprotocolua',
+  },
+];
+
+const urls = {
+  devHub: 'neardevhub.org',
+  discord: 'https://near.chat',
+  discourse: 'https://gov.near.org',
+  docs: 'https://docs.near.org',
+  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/',
+  supportRequest: 'https://nearhelp.zendesk.com/hc/en-us/requests/new',
+  telegram: 'https://t.me/neardev',
+  twitter: 'https://twitter.com/nearprotocol',
+  wechat: 'https://pages.near.org/wechat',
+  withdrawNearFunds:
+    'https://nearhelp.zendesk.com/hc/en-us/articles/360060927734-Staking-Unstaking-and-Withdrawing-NEAR',
+  youtube: 'https://www.youtube.com/channel/UCuKdIYVN8iE3fv8alyk1aMw',
+};
+
+const channels = [
+  {
+    icon: 'ph-telegram-logo',
+    label: 'Telegram',
+    url: urls.telegram,
+  },
+  {
+    icon: 'ph-discord-logo',
+    label: 'Discord',
+    url: urls.discord,
+  },
+  {
+    icon: 'ph-github-logo',
+    label: 'GitHub',
+    url: urls.github,
+  },
+  {
+    icon: 'ph-file-text',
+    label: 'Docs',
+    url: urls.docs,
+  },
+  {
+    icon: 'ph-wechat-logo',
+    label: 'WeChat',
+    url: urls.wechat,
+  },
+  {
+    icon: 'ph-twitter-logo',
+    label: 'X',
+    url: urls.twitter,
+  },
+];
+
+export function useCommunities() {
+  return { featuredCommunities, urls, channels };
+}