feat: add web page app

web/.eslintignore

@@ -0,0 +1,11 @@
+node_modules
+src/vendor
+dist
+.next
+webpack.config.js
+jest.config.js
+tailwind.config.js
+postcss.config.js
+next.config.mjs
+setupTests.ts
+scripts

web/.eslintrc.js

@@ -0,0 +1,35 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: [
+    '@repo/eslint-config/next.js',
+    'xmtp-web',
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'next',
+    'next/core-web-vitals',
+    'prettier',
+  ],
+  plugins: ['@typescript-eslint'],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    project: true,
+  },
+  rules: {
+    'react/function-component-definition': 'off',
+    // '@typescript-eslint/ban-ts-comment': ['off'],
+    // '@typescript-eslint/explicit-module-boundary-types': ['off'],
+    // '@typescript-eslint/no-explicit-any': ['off'],
+    // '@typescript-eslint/no-floating-promises': ['error'],
+    // '@typescript-eslint/no-non-null-assertion': ['off'],
+    // '@typescript-eslint/no-require-imports': ['warn'],
+    // '@typescript-eslint/no-unused-vars': ['error'],
+    // 'import/no-self-import': ['error'],
+    // 'import/no-duplicates': ['error'],
+    // 'jsx-a11y/alt-text': ['off'],
+    // 'no-console': ['warn'],
+    // 'no-eval': ['error'],
+    // 'no-ex-assign': ['error'],
+    // 'no-constant-condition': ['off'],
+  },
+};

web/.gitignore

@@ -0,0 +1,39 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+/z
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# env files (can opt-in for commiting if needed)
+.env*
+(xmtp)
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+# Sentry Config File
+.env.sentry-build-plugin

web/.lintstagedrc

@@ -0,0 +1,3 @@
+{
+  "**/*.{ts,tsx,json}": ["prettier --write"]
+}

web/.prettierignore

@@ -0,0 +1,9 @@
+node_modules
+
+build
+
+dist
+
+.turbo
+
+

web/.prettierrc

@@ -0,0 +1,12 @@
+{
+  "singleQuote": true,
+  "printWidth": 120,
+  "bracketSpacing": true,
+  "tabWidth": 2,
+  "trailingComma": "es5",
+  "semi": true,
+  "arrowParens": "always",
+  "importOrder": ["^../(.*)$", "^./(.*)$"],
+  "importOrderSeparation": true,
+  "importOrderSortSpecifiers": true
+}

web/README.md

@@ -0,0 +1,36 @@
+This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+
+This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load Inter, a custom Google Font.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.

web/app/(core)/_comps/InfoView.tsx

@@ -0,0 +1,34 @@
+'use client';
+import { AppStores } from '@/lib';
+import { motion } from 'framer-motion';
+import React from 'react';
+import { TextH, TextP } from '@/comps';
+
+export function InfoView() {
+  const store = AppStores.useSettings();
+
+  return (
+    <div className="w-full h-screen flex  fixed top-0 right-0 bg-black/30 ">
+      <div
+        className={'w-full '}
+        // className={'w-[40%]'}
+        onClick={() => {
+          store.update({ infoTabOpen: false });
+        }}
+      />
+      <motion.div
+        initial={{ x: 0, opacity: 0.5, translateX: -20 }}
+        animate={{ x: 0, opacity: 1, translateX: 0 }}
+        transition={{ ease: 'easeInOut', duration: 0.3 }}
+        className={'w-[100%] max-w-[50%] bg-background rounded-r-2xl'}
+      >
+        <div className="mt-[50px] mb-[100px] flex flex-col">
+          <TextH>Heading...</TextH>
+          <TextP>Paragraph...</TextP>
+          <TextP>Paragraph...</TextP>
+          <TextP>Paragraph...</TextP>
+        </div>
+      </motion.div>
+    </div>
+  );
+}

web/app/(core)/_comps/Search.tsx

@@ -0,0 +1,33 @@
+import { AppStores, cn } from '@/lib';
+import { BsSearch } from 'react-icons/bs';
+
+export function SearchInput(props: { className?: string; onClick?: (e: string) => void }) {
+  const store = AppStores.useSettings();
+
+  return (
+    <div className={cn('w-full flex items-center justify-center border rounded-full 300 px-1', props.className)}>
+      <input
+        type="text"
+        className={`
+          bg-transparent w-full  px-2 py-2
+          outline-none border-none rounded-full
+        `}
+        placeholder="Search"
+        onChange={(e) => {
+          store.update({ searchValue: e.target.value });
+        }}
+      />
+
+      <div
+        className="bg-card rounded-full w-fit"
+        onClick={() => {
+          if (props.onClick) {
+            props.onClick(store.searchValue);
+          }
+        }}
+      >
+        <BsSearch size={20} className="m-2" />
+      </div>
+    </div>
+  );
+}

web/app/(core)/_comps/Sidebar.tsx

@@ -0,0 +1,90 @@
+'use client';
+import { TextH, TextP } from '@/comps';
+import { cn } from '@/lib';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import React from 'react';
+import { IconType } from 'react-icons';
+import { BiHome, BiLink } from 'react-icons/bi';
+import { BsBank, BsTools } from 'react-icons/bs';
+import { FaFileInvoice } from 'react-icons/fa';
+import { GrGroup } from 'react-icons/gr';
+
+export function AdminSidebar() {
+  const pathname = usePathname();
+
+  const checkActive = (val: string): boolean => {
+    if (pathname === '/admin') {
+      return true;
+    }
+
+    return pathname === val;
+  };
+
+  return (
+    <div className="w-[250px] bg-card flex flex-col h-full border-r overflow-x-hidden">
+      {/* <div className="h-[60px] flex items-center justify-center w-full bg-background">
+        <TextH>Gasonomy </TextH>
+      </div> */}
+      {data.map((val, i) => {
+        const { Icon } = val;
+        return (
+          <Link href={val.link}>
+            <div
+              key={i}
+              className={cn(
+                'py-3 px-5 hover:bg-background flex items-center',
+                checkActive(val.link) && 'bg-background'
+              )}
+            >
+              <Icon className={cn('mr-4', checkActive(val.link) && 'text-primary')} size={20} />
+              <TextP>{val.title}</TextP>
+            </div>
+          </Link>
+        );
+      })}
+    </div>
+  );
+}
+
+const data: {
+  title: string;
+  link: string;
+  Icon: IconType;
+}[] = [
+  {
+    title: 'Home',
+    link: '/admin',
+    Icon: BiHome,
+  },
+  {
+    title: 'All',
+    link: '/search/airtime',
+    Icon: GrGroup,
+  },
+  {
+    title: 'Blockchains',
+    link: '/search/withdraw',
+    Icon: BiLink,
+  },
+  {
+    title: 'RPC',
+    link: '/search/logs',
+    Icon: FaFileInvoice,
+  },
+  {
+    title: 'Tooling',
+    link: '/search/support',
+    Icon: BsTools,
+  },
+  {
+    title: 'Subsystems',
+    link: '/search/credit_bank',
+    Icon: BsBank,
+  },
+  {
+    title: 'Packages',
+    link: '/search/credit_crypto',
+    Icon: BiHome,
+  },
+];

web/app/(core)/_comps/index.ts

@@ -0,0 +1,3 @@
+export * from "./Sidebar"
+export * from "./InfoView"
+export * from "./Search"

web/app/(core)/blogs/[slug]/page.tsx

@@ -0,0 +1,42 @@
+'use client';
+import React from 'react';
+import { AppDocs } from '../md';
+import { Navbar, TextP } from '@/comps';
+
+export default function DocsPage({ params }: { params: { slug: string } }) {
+  const doc = AppDocs.filter((v) => v.key === params.slug)[0];
+
+  if (!doc) {
+    return (
+      <div>
+        <Navbar title={'Help'} isBack />
+        <div>
+          <TextP>No document found</TextP>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <>
+      <Navbar title={doc.title} isBack />
+      <div
+        className={`
+      px-5 py-3
+      [&_h1]:text-xl [&_h1]:mt-4 [&_h1]:font-extrabold
+      [&_h2]:text-xl [&_h2]:font-bold 
+      [&_h3]:text-lg [&_h3]:font-semibold 
+      [&_h4]:text-md [&_h4]:font-semibold 
+      [&_h5]:text-sm [&_h5]:font-bold 
+      [&_p]:text-sm  [&_p]:text-justify  [&_p]:my-2
+      [&_ul]:p-2 [&_ul]:font-light 
+      [&_ol]:p-2 [&_ol]:font-light 
+      [&_li]:list-disc [&_li]:px-2 [&_li]:py-[2px] [&_li]:ml-4
+      [&_table]:font-light 
+      [&_hr]:mb-3
+    `}
+      >
+        {doc.MdDoc}
+      </div>
+    </>
+  );
+}

web/app/(core)/blogs/md/about.mdx

@@ -0,0 +1,11 @@
+# About Us
+
+There were three
+camps that dominated the psychology of gender and that vocally opposed the
+application of evolutionary theory: social constructionism, cognitive learning
+theories, and social role theory.
+
+### Social constructionists
+
+This school of thought claim that gender
+is perpetrated and main-

web/app/(core)/blogs/md/faq.mdx

@@ -0,0 +1,11 @@
+# Frequently Asked Questions
+
+There were three
+camps that dominated the psychology of gender and that vocally opposed the
+application of evolutionary theory: social constructionism, cognitive learning
+theories, and social role theory.
+
+### Social constructionists
+
+This school of thought claim that gender
+is perpetrated and main-

web/app/(core)/blogs/md/help.mdx

@@ -0,0 +1,11 @@
+# Help
+
+There were three
+camps that dominated the psychology of gender and that vocally opposed the
+application of evolutionary theory: social constructionism, cognitive learning
+theories, and social role theory.
+
+### Social constructionists
+
+This school of thought claim that gender
+is perpetrated and main-