chore: staging deployment + build issues (#10)

.dockerignore

@@ -0,0 +1,21 @@
+node_modules/
+.nvmrc
+.next/
+
+k8s/
+
+.git/
+.gitignore
+.gitmodules
+
+.idea/
+.vscode/
+
+Dockerfile
+.dockerignore
+
+README.md
+LICENSE
+
+.eslintrc.json
+next-env.d.ts

.github/workflows/ci.yml

@@ -0,0 +1,40 @@
+name: CI
+
+on:
+  push:
+    branches:
+      - master
+
+  pull_request:
+    branches:
+      - master
+
+jobs:
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version-file: '.nvmrc'
+
+      - uses: pnpm/action-setup@v2
+        with:
+          version: 8.6.10
+
+      - run: |
+          which node
+          which npm
+          which pnpm
+          node --version
+          npm --version
+          pnpm --version
+
+      - run: |
+          pnpm install --frozen-lockfile
+
+      - run: |
+          pnpm build

.github/workflows/deploy-staging.yml

@@ -0,0 +1,113 @@
+name: Deploy Staging
+
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  build:
+    name: Build Images
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Setup Gcloud Auth
+        uses: google-github-actions/auth@v1
+        with:
+          credentials_json: '${{ secrets.ORG_SANDBOX_DEPLOYMENT_KEY }}'
+
+      - name: Setup Cloud SDK
+        uses: google-github-actions/setup-gcloud@v1
+
+      - name: Set Image Tag
+        id: lookup
+        run: echo "version=$(git rev-parse --short HEAD)" >> $GITHUB_OUTPUT
+
+      - run: |
+          gcloud auth list
+          gcloud auth configure-docker -q
+          echo "VERSION: ${{ steps.lookup.outputs.version }}"
+
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@master
+        with:
+          install: true
+
+      - name: Cache Docker Layers
+        uses: actions/cache@v3
+        with:
+          path: /tmp/.buildx-website-cache
+          key: ${{ runner.os }}-buildx-image-${{ github.sha }}
+          restore-keys: ${{ runner.os }}-buildx-image
+
+      - name: Build and Push Images
+        uses: docker/build-push-action@v3
+        with:
+          context: .
+          file: ./Dockerfile
+          builder: ${{ steps.buildx.outputs.name }}
+          push: true
+          tags: gcr.io/fetch-ai-sandbox/docs-website:${{ steps.lookup.outputs.version }}
+          cache-from: type=local,src=/tmp/.buildx-website-cache
+          cache-to: type=local,dest=/tmp/.buildx-website-cache-new
+
+      - name: Move cache
+        run: |
+          rm -rf /tmp/.buildx-website-cache
+          mv /tmp/.buildx-website-cache-new /tmp/.buildx-website-cache
+
+
+  deploy:
+    name: Deployment
+    runs-on: ubuntu-latest
+
+    needs:
+      - build
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Setup Gcloud Auth
+        uses: google-github-actions/auth@v1
+        with:
+          credentials_json: '${{ secrets.ORG_SANDBOX_DEPLOYMENT_KEY }}'
+
+      - name: Setup Cloud SDK
+        uses: google-github-actions/setup-gcloud@v1
+
+      - name: Set Image Tag
+        id: lookup
+        run: echo "version=$(git describe --always --dirty=-wip)" >> $GITHUB_OUTPUT
+
+      - name: Turnstyle
+        uses: softprops/turnstyle@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Deploy to Staging
+        env:
+          IMAGE_TAG: ${{ steps.lookup.outputs.version }}
+          HELM_NAME: staging
+          NAMESPACE: docs-staging
+          GKE_PROJECT: fetch-ai-sandbox
+          GKE_CLUSTER: london-b
+          GKE_ZONE: europe-west2-b
+
+        run: |
+          gcloud components install gke-gcloud-auth-plugin
+          gcloud container clusters get-credentials $GKE_CLUSTER \
+            --zone $GKE_ZONE \
+            --project $GKE_PROJECT
+          helm upgrade --install --wait --timeout 300s $HELM_NAME \
+            ./k8s/docs/ \
+            --set-string website.image.tag=$IMAGE_TAG \
+            -n $NAMESPACE

.nvmrc

@@ -0,0 +1 @@
+18.17

Dockerfile

@@ -0,0 +1,15 @@
+FROM node:18-alpine
+
+RUN apk add tree && corepack prepare [email protected] --activate && corepack enable
+
+WORKDIR /app
+ADD package.json pnpm-lock.yaml /app/
+
+RUN pnpm install --frozen-lockfile
+
+COPY . /app
+
+RUN pnpm build
+
+ENTRYPOINT ["pnpm"]
+CMD ["start"]

README.md

@@ -14,3 +14,7 @@ pnpm next
 ```python
 localhost:3000/framework
 ```
+
+### Staging Website
+
+https://docs-staging.sandbox-london-b.fetch-ai.com/framework

components/mdx.tsx

@@ -1,5 +1,7 @@
 import React from "react";
-import {Tab} from '@headlessui/react'
+import {Tab as HeadlessTab} from '@headlessui/react'
+
+
 
 function InfoIcon(props) {
     return (
@@ -100,32 +102,35 @@ export function Tabs({children, half = false}) {
         <div className={`rounded h-min overflow-auto ${half ? "w-full" : "w-full"}`}>
 
 
-            <Tab.Group>
-                <Tab.List className="flex space-x-1 rounded-xl p-1">
+            <HeadlessTab.Group>
+                <HeadlessTab.List className="flex space-x-1 rounded-xl p-1">
                     {React.Children.map(children, (child, index) => (
-                        <Tab key={index} className={({selected}) =>
+                        <HeadlessTab key={index} className={({selected}) =>
                             classNames(
                                 'w-full rounded-lg py-2.5 text-sm font-medium leading-5 bg-slate-100',
                                 ' focus:outline-none focus:ring-2',
                                 selected
                                     ? 'shadow'
                                     : 'text-white-100 hover:bg-white/[0.12] hover:text-white'
                             )
-                        }>{child.props.heading}</Tab>
+                        }>{child.props.heading}</HeadlessTab>
                     ))}
-                </Tab.List>
-                <Tab.Panels>
+                </HeadlessTab.List>
+                <HeadlessTab.Panels>
                     {React.Children.map(children, (child, index) => (
-                        <Tab.Panel key={index}
+                        <HeadlessTab.Panel key={index}
                                    className={classNames('p-3 ring-opacity-60 ring-offset-2 ring-offset-blue-400 focus:outline-none focus:ring-2'
-                                   )}>{child.props.children}</Tab.Panel>
+                                   )}>{child.props.children}</HeadlessTab.Panel>
                     ))}
-                </Tab.Panels>
-            </Tab.Group>
+                </HeadlessTab.Panels>
+            </HeadlessTab.Group>
         </div>
     )
 }
 
+export function Tab(props) {
+    return <HeadlessTab {...props}/>
+}
 
 export function Row({children}){
 

k8s/build-img.py

@@ -0,0 +1,88 @@
+#!/usr/bin/env python3
+import os
+import sys
+import subprocess
+import argparse
+
+
+PROFILES = {
+    'staging': {
+        'repository': 'gcr.io/fetch-ai-sandbox/docs-website',
+    }
+}
+PROJECT_ROOT = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
+
+
+def _profile(text: str) -> str:
+    if text not in PROFILES:
+        available_profiles = ', '.join(PROFILES.keys())
+        print(f'Invalid profile {text}. Please select one of [{available_profiles}]')
+        sys.exit(1)
+
+    return text
+
+
+def parse_commandline() -> argparse.Namespace:
+    parser = argparse.ArgumentParser()
+    parser.add_argument('-p', '--profile', type=_profile, default='staging', help='The profile to use')
+    parser.add_argument('-n', '--no-push', dest='push', action='store_false', help='Disable pusing of the image')
+    parser.add_argument('-f', '--force-build', action='store_true', help=argparse.SUPPRESS)
+    return parser.parse_args()
+
+
+def detect_local_modifications() -> bool:
+    exit_code = subprocess.call(['git', 'diff-index', '--quiet', 'HEAD'])
+    return exit_code != 0
+
+
+def get_version() -> str:
+    return subprocess.check_output(['git', 'rev-parse', '--short', 'HEAD']).decode().strip()
+
+
+def main():
+    args = parse_commandline()
+
+    # argument validation / augmentation
+    push = args.push
+    if detect_local_modifications():
+        if args.force_build:
+            push = False
+            print('Disabling push of images due to local modifications')
+        else:
+            print('Detected local modifications. Please commit and try again')
+            sys.exit(1)
+
+    # lookup the required information
+    version = get_version()
+    repository = PROFILES[args.profile]['repository']
+
+    image_url = f'{repository}:{version}'
+
+    print()
+    print(f'Project root: {PROJECT_ROOT}')
+    print(f'Profile.....: {args.profile}')
+    print(f'Image Ref...: {image_url}')
+    print(f'Push........: {push}')
+    print()
+
+    # Step 1. Build the image
+    subprocess.check_call([
+        'docker',
+        'build',
+        '--platform', 'linux/amd64',
+        '-t', image_url,
+        PROJECT_ROOT,
+    ])
+
+    # Step 2. Push the image
+    if push:
+        subprocess.check_call([
+            'docker',
+            'push',
+            image_url,
+        ])
+
+
+
+if __name__ == '__main__':
+    main()

k8s/docs/.helmignore

@@ -0,0 +1,23 @@
+# Patterns to ignore when building packages.
+# This supports shell glob matching, relative path matching, and
+# negation (prefixed with !). Only one pattern per line.
+.DS_Store
+# Common VCS dirs
+.git/
+.gitignore
+.bzr/
+.bzrignore
+.hg/
+.hgignore
+.svn/
+# Common backup files
+*.swp
+*.bak
+*.tmp
+*.orig
+*~
+# Various IDEs
+.project
+.idea/
+*.tmproj
+.vscode/

k8s/docs/Chart.yaml

@@ -0,0 +1,24 @@
+apiVersion: v2
+name: docs
+description: A Helm chart for Kubernetes
+
+# A chart can be either an 'application' or a 'library' chart.
+#
+# Application charts are a collection of templates that can be packaged into versioned archives
+# to be deployed.
+#
+# Library charts provide useful utilities or functions for the chart developer. They're included as
+# a dependency of application charts to inject those utilities and functions into the rendering
+# pipeline. Library charts do not define any templates and therefore cannot be deployed.
+type: application
+
+# This is the chart version. This version number should be incremented each time you make changes
+# to the chart and its templates, including the app version.
+# Versions are expected to follow Semantic Versioning (https://semver.org/)
+version: 0.1.0
+
+# This is the version number of the application being deployed. This version number should be
+# incremented each time you make changes to the application. Versions are not expected to
+# follow Semantic Versioning. They should reflect the version the application is using.
+# It is recommended to use it with quotes.
+appVersion: "0.1.0"