feat(map): initialising map (#3938)

* feat(blink-map): initialising blink map

rebase

rebase

* chore: update deps

* chore: rename

rebase

* chore: label uppercase

rebase

* feat: adding MerchantMapSuggest gql

rebase

* chore: Addressing comments, update readme, update codegen

* chore: added test label in tilt

* chore: clean unused files

* fix: tilt syntax

* chore: fix tilt

* chore: editable coordinates

* chore: misc changes

.github/labeler.yml

@@ -22,6 +22,11 @@ admin-panel:
   - flake.lock
   - pnpm-lock.yaml
 
+map:
+  - apps/map/*
+  - flake.lock
+  - pnpm-lock.yaml
+
 core:
   - core/api/*
   - core/api-cron/*

.github/workflows/bats.yml

@@ -23,7 +23,7 @@ jobs:
       - name: Buck2 build
         run: |
           nix develop -c buck2 build //core/api //core/api-ws-server \
-            //core/api-keys //apps/dashboard //apps/consent //apps/pay //apps/admin-panel \
+            //core/api-keys //apps/dashboard //apps/consent //apps/pay //apps/admin-panel //apps/map \
             //core/notifications
       - name: Run bats tests
         run: |

.github/workflows/buck2-test.yaml

@@ -23,7 +23,7 @@ jobs:
           ${{ toJSON(github.event.pull_request.labels.*.name) }}
           EOF
 
-          DEFAULT_LABELS=("dashboard" "consent" "pay" "core" "api-keys" "notifications" "admin-panel")
+          DEFAULT_LABELS=("dashboard" "consent" "pay" "core" "api-keys" "notifications" "admin-panel" "map")
           LABELS=($(jq -r '.[]' < labels.json))
           if [ ${#LABELS[@]} -eq 0 ]; then
               LABELS=("${DEFAULT_LABELS[@]}")
@@ -33,7 +33,7 @@ jobs:
 
           for LABEL in "${LABELS[@]}"; do
             case "$LABEL" in
-              dashboard|consent|pay|admin-panel)
+              dashboard|consent|pay|admin-panel|map)
                 ARGS+=" //apps/$LABEL:test"
                 ;;
               core)

.github/workflows/integration-test.yml

@@ -27,7 +27,7 @@ jobs:
           ${{ toJSON(github.event.pull_request.labels.*.name) }}
           EOF
 
-          DEFAULT_LABELS=("dashboard" "consent" "pay" "core" "admin-panel")
+          DEFAULT_LABELS=("dashboard" "consent" "pay" "core" "admin-panel" "map")
           LABELS=($(jq -r '.[]' < labels.json))
           if [ ${#LABELS[@]} -eq 0 ]; then
               LABELS=("${DEFAULT_LABELS[@]}")
@@ -37,7 +37,7 @@ jobs:
 
           for LABEL in "${LABELS[@]}"; do
             case "$LABEL" in
-              dashboard|consent|pay|core|admin-panel)
+              dashboard|consent|pay|core|admin-panel|map)
                 ARGS+=" $LABEL"
                 ;;
             esac

BUCK

@@ -8,6 +8,7 @@ pnpm_workspace(
     "//apps/dashboard:package.json",
     "//apps/pay:package.json",
     "//apps/admin-panel:package.json",
+    "//apps/map:package.json",
     "//lib/eslint-config:package.json",
     "//lib/galoy-components:package.json"
   ],

apps/map/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

apps/map/.gitignore

@@ -0,0 +1,36 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# 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*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

apps/map/BUCK

@@ -0,0 +1,84 @@
+load(
+  "@toolchains//workspace-pnpm:macros.bzl",
+  "dev_pnpm_task_binary",
+  "dev_pnpm_task_test",
+  "build_node_modules",
+  "next_build",
+  "next_build_bin",
+  "eslint",
+  "audit",
+)
+
+dev_pnpm_task_binary(
+  name = "dev",
+  command = "dev",
+)
+
+dev_pnpm_task_binary(
+  name = "lint-fix",
+  command = "lint:fix",
+)
+
+dev_pnpm_task_test(
+  name = "test-integration",
+  command = "test",
+)
+
+export_file(
+  name = "package.json",
+  visibility = ["PUBLIC"],
+)
+
+build_node_modules(
+  name = "node_modules",
+)
+
+filegroup(
+    name = "src",
+    srcs = glob([
+    "app/**",
+    "theme/**",
+    "services/**",
+    "components/**",
+    "tailwind.config.ts",
+    "postcss.config.js",
+    "next.config.js",
+    "tsconfig.json",
+    "*.ts",
+    "instrumentation.node.ts"
+    ]),
+)
+
+next_build(
+    name = "build",
+    srcs = [":src"],
+)
+
+next_build_bin(
+    name = "map",
+)
+
+dev_deps_srcs = {
+    "lib/eslint-config": "//lib/eslint-config:src",
+}
+
+audit(
+    name = "audit",
+    level = "critical",
+)
+
+eslint(
+    name = "lint",
+    srcs = [":src"] + glob([".eslint*"]),
+    extensions = [".ts", ".tsx"],
+    allow_warnings = True,
+    dev_deps_srcs = dev_deps_srcs,
+)
+
+test_suite(
+    name = "test",
+    tests = [
+        ":audit",
+        ":lint",
+    ],
+)

apps/map/Dockerfile

@@ -0,0 +1,32 @@
+FROM nixos/nix:latest AS builder
+ARG APP=map
+
+COPY . /workdir
+WORKDIR /workdir
+
+RUN set -eux; \
+    nix \
+        --extra-experimental-features "nix-command flakes impure-derivations ca-derivations" \
+        --option filter-syscalls false \
+        build \
+        ".#$APP";
+
+RUN mkdir -p /tmp/nix-store-closure /tmp/local-bin
+RUN cp -R $(nix-store --query --requisites result/) /tmp/nix-store-closure
+RUN ln -snf $(nix-store --query result/)/bin/* /tmp/local-bin/
+
+FROM gcr.io/distroless/static-debian11 AS final
+ARG APP=map
+
+WORKDIR /app/$APP
+COPY --from=builder /tmp/nix-store-closure /nix/store
+COPY --from=builder /tmp/local-bin/* /usr/local/bin/
+
+USER 1000
+
+ARG COMMITHASH
+ENV COMMITHASH ${COMMITHASH}
+
+CMD [ \
+  "/usr/local/bin/run" \
+]

apps/map/README.md

@@ -0,0 +1,9 @@
+# Map
+
+### local dev setup  
+This app uses Google Maps, therefore it requires a Google Maps API token:
+```
+NEXT_PUBLIC_MAP_API_TOKEN
+```
+
+App run's on port `3005` by default.

apps/map/app/globals.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

apps/map/app/layout.tsx

@@ -0,0 +1,22 @@
+import type { Metadata } from "next"
+import { Inter_Tight } from "next/font/google"
+import "./globals.css"
+
+const inter = Inter_Tight({ subsets: ["latin"] })
+
+export const metadata: Metadata = {
+  title: "Maps",
+  description: "Merchant map for Blink",
+}
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode
+}>) {
+  return (
+    <html lang="en">
+      <body className={inter.className}>{children}</body>
+    </html>
+  )
+}

apps/map/app/page.tsx

@@ -0,0 +1,19 @@
+import MapComponent from "@/components/map"
+import { businessMapMarkers } from "@/services/galoy/graphql/queries/business-map-marker"
+import Image from "next/image"
+
+export default async function Home() {
+  const mapData = await businessMapMarkers()
+  if (mapData instanceof Error) {
+    return <main>{mapData.message}</main>
+  }
+
+  return (
+    <main>
+      <div className="absolute ml-1 mt-1 rounded-xl bg-clip-padding backdrop-filter backdrop-blur-sm bg-opacity-10  z-10">
+        <Image width={130} height={130} src={"/logo.svg"} alt="Blink Logo" />
+      </div>
+      <MapComponent mapData={mapData} />
+    </main>
+  )
+}

apps/map/app/server-acton.ts

@@ -0,0 +1,76 @@
+"use server"
+
+import { merchantMapSuggest } from "@/services/galoy/graphql/mutation/merchant-map-suggest"
+import { isValidCoordinates } from "./utils"
+
+export const submitMerchantSuggest = async (
+  _prevState: {
+    error: boolean
+    message: string
+  },
+  form: FormData,
+): Promise<{
+  error: boolean
+  message: string
+}> => {
+  const title = form.get("title")
+  const username = form.get("username")
+  const latitude = form.get("latitude")
+  const longitude = form.get("longitude")
+  if (
+    !title ||
+    !username ||
+    !latitude ||
+    !longitude ||
+    typeof title !== "string" ||
+    typeof username != "string" ||
+    typeof latitude != "string" ||
+    typeof longitude != "string"
+  ) {
+    return {
+      error: true,
+      message: "Missing fields",
+    }
+  }
+
+  const lat = Number(latitude)
+  const lon = Number(longitude)
+
+  if (
+    isValidCoordinates({
+      latitude: lat,
+      longitude: lon,
+    })
+  ) {
+    return {
+      error: true,
+      message: "Invalid coordinates",
+    }
+  }
+
+  const response = await merchantMapSuggest({
+    title,
+    username,
+    latitude: lat,
+    longitude: lon,
+  })
+
+  if (response instanceof Error) {
+    return {
+      error: true,
+      message: response.message,
+    }
+  }
+
+  if (response.errors.length > 0) {
+    return {
+      error: true,
+      message: response.errors[0].message,
+    }
+  }
+
+  return {
+    error: false,
+    message: "success",
+  }
+}

apps/map/app/utils.ts

@@ -0,0 +1,11 @@
+export function isValidCoordinates({
+  latitude,
+  longitude,
+}: {
+  latitude: number
+  longitude: number
+}): boolean {
+  const isValidLatitude: boolean = latitude >= -90 && latitude <= 90
+  const isValidLongitude: boolean = longitude >= -180 && longitude <= 180
+  return isValidLatitude && isValidLongitude
+}