Update packages & new UI

.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.env.example

@@ -1,6 +1,5 @@
 PORT=80
 HOST=0.0.0.0
 WALLET_CONNECT_ID=
-GOERLI_NETWORK_ENDPOINT=
 POLLINATIONX_URL=
 POLLINATIONX_TOKEN=

.eslintrc.cjs

@@ -0,0 +1,31 @@
+module.exports = {
+  extends: ['@nuxtjs/eslint-config-typescript', 'plugin:prettier/recommended'],
+  rules: {
+    // General
+    'comma-dangle': ['error', 'always-multiline'],
+
+    // Typescript
+    '@typescript-eslint/type-annotation-spacing': 'error',
+
+    // Vue
+    'vue/arrow-spacing': ['error', { before: true, after: true }],
+    'vue/array-bracket-spacing': ['error', 'never'],
+    'vue/block-spacing': ['error', 'always'],
+    'vue/brace-style': ['error', 'stroustrup', { allowSingleLine: true }],
+    'vue/comma-spacing': ['error', { before: false, after: true }],
+    'vue/html-comment-indent': ['error', 1],
+    'vue/html-indent': ['error', 2],
+    'vue/key-spacing': ['error', { beforeColon: false, afterColon: true, mode: 'strict' }],
+    'vue/keyword-spacing': ['error', { before: true, after: true }],
+    'vue/multi-word-component-names': 'off',
+    'vue/object-curly-spacing': ['error', 'always'],
+    'vue/padding-line-between-blocks': ['error', 'always'],
+    'vue/script-indent': ['error', 2, { baseIndent: 0 }],
+    'vue/space-infix-ops': ['error', { int32Hint: false }],
+  },
+  overrides: [
+    {
+      files: ['*.{ts,js,cjs,vue}'],
+    },
+  ],
+};

.gitignore

@@ -5,5 +5,6 @@ node_modules
 .cache
 .output
 .env
-dist
 .idea
+.DS_Store
+dist

.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "semi": true,
+  "trailingComma": "all",
+  "singleQuote": true,
+  "printWidth": 120,
+  "arrowParens": "always",
+  "tabWidth": 2,
+  "plugins": ["prettier-plugin-tailwindcss"]
+}

app.config.ts

@@ -0,0 +1,194 @@
+export default defineAppConfig({
+  links: {
+    privacyPolicy: 'https://github.com/4thtech/static-assets/raw/main/pdf/privacy-policy.pdf',
+    termsOfUse: 'https://github.com/4thtech/static-assets/raw/main/pdf/2023-02-20-Block_Labs_Software_Terms.pdf',
+  },
+  layout: {
+    title: '4thTech',
+    collapse: {
+      toolbar: {
+        enabled: true,
+        showTitle: true,
+        showNavBurger: true,
+        tools: [
+          {
+            component: 'ThemeToggle',
+          },
+          {
+            component: 'ToolbarNetwork',
+          },
+          {
+            component: 'ToolbarAccountMenu',
+          },
+        ],
+      },
+      navigation: {
+        enabled: true,
+        header: {
+          component: 'CollapseNavigationHeader',
+        },
+        footer: {
+          component: 'CollapseNavigationFooter',
+        },
+        items: [
+          {
+            name: 'Dashboard',
+            icon: { name: 'ph:sidebar-duotone', class: 'w-5 h-5' },
+            to: '/dashboard',
+          },
+          {
+            name: 'Mail',
+            icon: { name: 'ph:envelope-simple-duotone', class: 'w-5 h-5' },
+            activePath: '/mail',
+            children: [
+              {
+                name: 'Compose new',
+                to: '/mail/compose',
+                icon: { name: 'ph:plus', class: 'w-4 h-4' },
+              },
+              {
+                name: 'Inbox',
+                to: '/mail/inbox',
+                icon: { name: 'ph:tray-duotone', class: 'w-4 h-4' },
+              },
+            ],
+          },
+          {
+            name: 'Chat',
+            icon: { name: 'ph:chat-circle-duotone', class: 'w-5 h-5' },
+            to: '/chat',
+          },
+        ],
+      },
+    },
+    panels: [
+      {
+        name: 'network',
+        position: 'right',
+        component: 'PanelNetwork',
+      },
+    ],
+  },
+  /**
+   * Shuriken UI layer configuration
+   */
+  nui: {
+    /**
+     * Default shape for components
+     *
+     * This allows to not have to specify the shape prop on every component.
+     * Define only the ones you want to override.
+     */
+    defaultShapes: {
+      /**
+       * Default shape for the BaseAccordion component
+       *
+       * @type {'straight' | 'rounded' | 'curved'}
+       */
+      accordion: 'rounded',
+      /**
+       * Default shape for the BaseAutocompleteItem component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      autocompleteItem: 'rounded',
+      /**
+       * Default shape for the BaseAvatar component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      avatar: 'full',
+      /**
+       * Default shape for the BaseButton component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      button: 'rounded',
+      /**
+       * Default shape for the BaseButtonAction component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      buttonAction: 'rounded',
+      /**
+       * Default shape for the BaseButtonIcon component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      buttonIcon: 'rounded',
+      /**
+       * Default shape for the BaseButtonIcon component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      buttonClose: 'full',
+      /**
+       * Default shape for the BaseCard component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      card: 'rounded',
+      /**
+       * Default shape for the BaseDropdown component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      dropdown: 'rounded',
+      /**
+       * Default shape for the BaseIconBox component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      iconBox: 'rounded',
+      /**
+       * Default shape for all input components component
+       * - BaseAutocomplete
+       * - BaseCheckbox
+       * - BaseInput
+       * - BaseInputFile
+       * - BaseInputListbox
+       * - BaseInputSelect
+       * - BaseInputTextarea
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      input: 'rounded',
+      /**
+       * Default shape for the BaseMessage component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      message: 'curved',
+      /**
+       * Default shape for the BasePagination component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      pagination: 'rounded',
+      /**
+       * Default shape for the BaseProgress component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      progress: 'full',
+      /**
+       * Default shape for the BaseProse component
+       *
+       * @type {'straight' | 'rounded' | 'curved'}
+       */
+      prose: 'rounded',
+      /**
+       * Default shape for the BaseTabSlider component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      tabSlider: 'rounded',
+      /**
+       * Default shape for the BaseTag component
+       *
+       * @type {'straight' | 'rounded' | 'curved' | 'full'}
+       */
+      tag: 'rounded',
+    },
+  },
+});

app.vue

@@ -1,11 +1,15 @@
 <template>
-  <NuxtLayout>
-    <NuxtLoadingIndicator color="#6366f1" />
-    <NuxtPage />
-  </NuxtLayout>
+  <div>
+    <NetworkSwitcher />
+
+    <NuxtLayout>
+      <NuxtLoadingIndicator color="rgb(var(--color-primary-500))" />
+      <NuxtPage />
+    </NuxtLayout>
+  </div>
 </template>
 
 <script setup lang="ts">
-import '~/assets/styles/main.css';
-import 'vue-toastification/dist/index.css';
+import { Buffer } from 'buffer/';
+window.Buffer = Buffer;
 </script>