feat: new app design

.eslintrc.json

@@ -1,3 +1,19 @@
 {
-  "extends": ["next", "next/core-web-vitals"]
+  "env": {
+    "browser": true,
+    "node": true
+  },
+  "extends": ["next/core-web-vitals", "next", "prettier"],
+  "plugins": ["prettier"],
+  "rules": {
+    "prettier/prettier": "warn",
+    "react/prop-types": ["off"],
+    "no-console": ["warn", { "allow": ["warn", "error"] }],
+    "no-unused-vars": [
+      "warn",
+      { "vars": "all", "args": "none", "ignoreRestSiblings": false }
+    ],
+    "eol-last": ["warn", "always"],
+    "react/react-in-jsx-scope": "off"
+  }
 }

.github/workflows/lint.yml

@@ -0,0 +1,29 @@
+name: Lint Code
+
+on:
+  push:
+    branches: [main, staging]
+  pull_request:
+    branches: [main, staging]
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+
+      - name: Set up Yarn
+        run: corepack enable
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Run linter
+        run: yarn lint && yarn prettier:check

.prettierrc.json

@@ -0,0 +1,9 @@
+{
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": false,
+  "endOfLine": "lf",
+  "bracketSpacing": true,
+  "arrowParens": "always"
+}

Makefile

@@ -0,0 +1,7 @@
+code-check:
+	yarn lint
+	yarn prettier:check
+
+code-fix:
+	yarn lint:fix
+	yarn prettier:fix

README.md

@@ -1,17 +1,14 @@
-BTC TECHNICAL MATERIALS SEARCH
+![bitcoin-search-home](https://github.com/bitcoinsearch/bitcoinsearch-app/assets/18506343/65833946-63a2-400e-9e91-023f96cac9b2)
 
-This project will serve as a search engine for searching Bitcoin technical related materials. It will aggregate all Bitcoin related materials and performs search on those materials instead of going through thousands of unrelated Google search results. 
+# Welcome to Bitcoin Search
 
-It will classify materials according to:
+## Features
 
-- Relevance
-- Domains
-- Tags
-- Authors
+- **Elasticsearch Integration**: Directly interfaces with Elasticsearch, leveraging the dataset curated and indexed by the [scraper](https://github.com/bitcoinsearch/scraper). This integration facilitates robust full-text search capabilities, supporting complex queries, filters (authors, domains), and sorting options.
+- **URL-Driven Search State**: Manages the search state through URL parameters using NextJS's router, enabling shareable search URLs and intuitive user navigation.
+- **Proxy Server for Security**: Implements a [server-side proxy layer](src/pages/api/elasticSearchProxy/search.ts) for Elasticsearch queries, abstracting away direct access to the Elasticsearch cluster and enriching queries with necessary filters and parameters.
 
----
-
-## Getting started 
+## Getting started
 
 The search engine is built using NextJS and connects to elasticsearch
 

next.config.js

@@ -1,6 +1,24 @@
+const mapping = require("./src/config/mapping.json");
+const domains = [
+  ...new Set(
+    Object.keys(mapping.labels).map((domain) => new URL(domain).hostname)
+  ),
+];
+
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-}
+  images: {
+    // domain mapping is not an exhaustive list of all the domains we have
+    // domains,
+    // allow favicon from any indexed domain for now
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "**",
+      },
+    ],
+  },
+};
 
-module.exports = nextConfig
+module.exports = nextConfig;

package.json

@@ -7,7 +7,10 @@
     "dev": "GENERATE_SOURCEMAP=false next dev",
     "build": "GENERATE_SOURCEMAP=false next build",
     "start": "GENERATE_SOURCEMAP=false next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "lint:fix": "next lint --fix",
+    "prettier:check": "prettier --check . --ignore-path .gitignore",
+    "prettier:fix": "prettier --write . --ignore-path .gitignore"
   },
   "dependencies": {
     "@chakra-ui/react": "^2.0.0",
@@ -19,15 +22,14 @@
     "@elastic/search-ui-elasticsearch-connector": "1.20.2",
     "@emotion/react": "^11.10.5",
     "@emotion/styled": "^11.10.5",
+    "@fontsource/geist-sans": "^5.0.2",
     "@netlify/plugin-nextjs": "^4.40.1",
     "@tanstack/react-query": "^4.29.12",
     "autoprefixer": "10.4.14",
-    "eslint": "^8.42.0",
-    "eslint-config-next": "^13.4.4",
     "framer-motion": "^6.5.1",
     "html-to-react": "^1.5.0",
     "next": "13.4.4",
-    "node-sass": "^7.0.3",
+    "node-sass": "^8.0.0",
     "postcss": "8.4.24",
     "rc-pagination": "^3.5.0",
     "react": "18.2.0",
@@ -42,6 +44,8 @@
     "@types/node": "^20.2.5",
     "@types/react": "^18.2.8",
     "@types/react-dom": "^18.2.4",
+    "eslint": "^8.42.0",
+    "eslint-config-next": "^13.4.4",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-prettier": "^4.2.1",
     "prettier": "^2.8.8",

postcss.config.js

@@ -3,4 +3,4 @@ module.exports = {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};

public/index.html

@@ -3,14 +3,23 @@
   <head>
     <meta charset="utf-8" />
     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, maximum-scale=1"
+    />
     <meta name="theme-color" content="#000000" />
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
     <title>Bitcoin Search</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:image" content="https://bitcoinsearch.xyz/btc_book_2_1.jpg?v1">
-    <meta name="twitter:title" content="Technical ₿itcoin Search">
-    <meta name="twitter:description" content="The bitcoin technical search we deserve">
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta
+      name="twitter:image"
+      content="https://bitcoinsearch.xyz/btc_book_2_1.jpg?v1"
+    />
+    <meta name="twitter:title" content="Technical ₿itcoin Search" />
+    <meta
+      name="twitter:description"
+      content="The bitcoin technical search we deserve"
+    />
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>