feat: add front cache and improve AWS UX (#49)

* feat: add front cache and improve AWS UX

* feat: improve types

* feat: rewrite of latest page

* feat: improvement for registry v2

* fix build

* fix: docker build

* chore: dependencies

* feat: use session token

* feat: clean useCLI

* feat: improve docker, deps

* feat: fix credentials detection

* chore: add changelog

.dockerignore

@@ -6,12 +6,12 @@
 !assets
 !functions
 !layouts
-!middlewares
 !pages
 !plugins
 !server
-!static
-!store
-!.babelrc
+!types
+
+!LICENSE
 !nuxt.config.ts
-!tailwind.config.js
+!tailwind.config.ts
+!tsconfig.json

CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## 1.7.0 | 2023-05-06
+
+AWS CLI was dropped and now it uses the standard api with SDK. Intructions to use a local authentication with Docker are available in the readme.
+Now cache is built for every page client side to improve the experience when consulting data intensively
+#### Features
+
+- Classic usage of AWS SDK with local authentication (awscli)
+- Add cache everywhere in app, transitions are smoother
+
+#### Chores
+
+- Upgrade to the latest version of Nuxt.js (v3.4.3)
+- Upgrage packages
+
 ## 1.6.0 | 2022-11-05
 
 Nuxt.js v3 is definitively coming. The bridge has been removed and the framework has been updated to the last current version (Nuxt.js v3-rc13).

Dockerfile

@@ -21,7 +21,7 @@ WORKDIR /app
 
 COPY --from=builder /app/.output /app/.output
 
-RUN npm install --omit=dev nuxt
+RUN npm install --omit=dev nuxt pino-pretty
 
 EXPOSE 3000
 

README.md

@@ -4,8 +4,10 @@ Fuzzy engine a is beautiful ✨ and simple 🐹 UI for your [private Docker regi
 
 List of supporting docker registry:
 
-- [x] Self-hostable registry
+- [x] Self hostable registry
 - [x] AWS ECR
+  - [x] With API keys
+  - [x] With local authentication (CLI)
 - [x] Github Container Registry
 - [x] Dockerhub
 - [ ] Google Cloud
@@ -20,6 +22,28 @@ The best way to use and to deploy the UI is with Docker.
 docker run -d -p 3000:3000 tchoupinax/fuzzy-engine
 ```
 
+### Authentication to ECR using AWS local authentication
+
+In a company enterprise, you are logged to your ECR with the AWS cli. Fuzzy-engine support this authentication.
+
+When you logged in, the cli exposed three environment variables to your shell
+- AWS_ACCESS_KEY_ID
+- AWS_SECRET_ACCESS_KEY
+- AWS_SESSION_TOKEN
+
+Fuzzy-engine will simply use them for talking with AWS api.
+
+If you use a Docker image, you have to share these variable by the following way
+
+```
+docker run -d \
+  -p 3000:3000 \
+  -e AWS_ACCESS_KEY_ID=$AWS_ACCESS_KEY_ID \
+  -e AWS_SECRET_ACCESS_KEY=$AWS_SECRET_ACCESS_KEY \
+  -e AWS_SESSION_TOKEN=$AWS_SESSION_TOKEN \
+  tchoupinax/fuzzy-engine
+```
+
 ### FAQ
 
 #### How it works ?

functions/db.ts

@@ -0,0 +1,80 @@
+import { Option } from '@swan-io/boxed'
+import { getCookie } from '~~/functions/cookies'
+
+export class DB {
+  public upsertRepositories (repositories: Array<any>): Option<Array<any>> {
+    const alreadySavedRepositories = this.findRepositories()
+
+    let repositoriesToSave = []
+    if (alreadySavedRepositories.isSome()) {
+      repositoriesToSave = Array.from(
+        new Set([
+          ...alreadySavedRepositories.get(),
+          ...repositories
+        ]
+          .map(obj => JSON.stringify(obj))
+        )
+      ).map(obj => JSON.parse(obj))
+    } else {
+      repositoriesToSave = [...repositories]
+    }
+
+    localStorage.setItem(this.computeKey('repositories'), JSON.stringify(repositoriesToSave))
+
+    return Option.Some(repositoriesToSave)
+  }
+
+  public findRepositories (): Option<Array<any>> {
+    const item = localStorage.getItem(this.computeKey('repositories'))
+
+    if (item) {
+      return Option.Some(JSON.parse(item))
+    }
+
+    return Option.None()
+  }
+
+  public saveRepositoryImages (
+    repositoryName: string,
+    images: any
+  ): void {
+    localStorage.setItem(this.computeKey(`images-for-repo-${repositoryName}`), JSON.stringify(images))
+  }
+
+  public findRepositoryImages (
+    repositoryName: string,
+  ): Option<any> {
+    const item = localStorage.getItem(this.computeKey(`images-for-repo-${repositoryName}`))
+
+    if (item) {
+      return Option.Some(JSON.parse(item))
+    }
+
+    return Option.None()
+  }
+
+  public saveLatestRepositories (repositories: Array<any>): Option<Array<any>> {
+    localStorage.setItem(this.computeKey('latest-repositories'), JSON.stringify(repositories))
+
+    return Option.Some(repositories)
+  }
+
+  public findLatestRepositories (): Option<Array<any>> {
+    const item = localStorage.getItem(this.computeKey('latest-repositories'))
+
+    if (item) {
+      return Option.Some(JSON.parse(item))
+    }
+
+    return Option.None()
+  }
+
+  private computeKey (key: string): string {
+    const provider = Option.fromNullable(getCookie('fuzzy-engine-provider'))
+    if (provider.isSome()) {
+      key = `${provider.get()}-${key}`
+    }
+
+    return key
+  }
+}

nuxt.config.ts

@@ -4,7 +4,7 @@
 export default defineNuxtConfig({
   ssr: true,
   typescript: {
-    shim: false
+    shim: false,
   },
   app: {
     head: {