initial commit

.devcontainer/Dockerfile

@@ -0,0 +1,29 @@
+# Update the VARIANT arg in docker-compose.yml to pick a Node version: 10, 12, 14
+ARG VARIANT=16
+FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}
+
+# See https://github.com/microsoft/vscode-dev-containers/tree/master/containers/docker-from-docker for more documentation
+# On how to use docker from within docker
+
+# Install Docker CE CLI
+RUN apt-get update \
+  && apt-get install -y apt-transport-https ca-certificates curl gnupg2 lsb-release \
+  && curl -fsSL https://download.docker.com/linux/$(lsb_release -is | tr '[:upper:]' '[:lower:]')/gpg | apt-key add - 2>/dev/null \
+  && echo "deb [arch=amd64] https://download.docker.com/linux/$(lsb_release -is | tr '[:upper:]' '[:lower:]') $(lsb_release -cs) stable" | tee /etc/apt/sources.list.d/docker.list \
+  && apt-get update \
+  && apt-get install -y docker-ce-cli
+
+# Install Docker Compose
+RUN LATEST_COMPOSE_VERSION=$(curl -sSL "https://api.github.com/repos/docker/compose/releases/latest" | grep -o -P '(?<="tag_name": ").+(?=")') \
+  && curl -sSL "https://github.com/docker/compose/releases/download/${LATEST_COMPOSE_VERSION}/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose \
+  && chmod +x /usr/local/bin/docker-compose
+
+# Update args in docker-compose.yaml to set the UID/GID of the "node" user.
+ARG USER_UID=1000
+ARG USER_GID=$USER_UID
+RUN if [ "$USER_GID" != "1000" ] || [ "$USER_UID" != "1000" ]; then groupmod --gid $USER_GID node && usermod --uid $USER_UID --gid $USER_GID node; fi
+
+# Add the node user to the docker group to access
+# the daemon without sudo
+RUN groupadd docker
+RUN usermod -a -G docker node

.devcontainer/devcontainer.json

@@ -0,0 +1,44 @@
+{
+  "name": "next-image-s3-imgproxy-loader",
+  "dockerComposeFile": "docker-compose.yml",
+  "service": "application",
+  "workspaceFolder": "/workspace",
+  "settings": {
+    "terminal.integrated.defaultProfile.linux": "bash"
+  },
+  "remoteEnv": {
+    "PATH": "${containerEnv:PATH}:/workspace/bin"
+  },
+  "extensions": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "mikestead.dotenv",
+    "ms-azuretools.vscode-docker",
+    "ms-vsliveshare.vsliveshare",
+    "wayou.vscode-todo-highlight",
+    "xshrim.txt-syntax"
+  ],
+  "forwardPorts": [
+    3000,
+    4000,
+    9000,
+    9001
+  ],
+  "postCreateCommand": "bash -i .devcontainer/init.sh",
+"remoteUser": "node",
+"portsAttributes": {
+  "3000":{
+    "label": "Example Application",
+    "onAutoForward": "notify"
+  },
+	"4000": {
+		"label": "Imgproxy Server"
+	},
+	"9000": {
+		"label": "Minio Server"
+	},
+	"9001": {
+		"label": "Minio Console"
+	}
+}
+}

.devcontainer/docker-compose.yml

@@ -0,0 +1,62 @@
+version: '3.7'
+
+networks:
+  next-image-s3-imgproxy-loader-network:
+    name: next-image-s3-imgproxy-loader-network
+    driver: bridge
+
+volumes:
+  next-image-s3-imgproxy-loader-mariadb-10.5.9__data:
+    driver: local
+  next-image-s3-imgproxy-loader-mariadb-10.5.9__config:
+    driver: local
+  next-image-s3-imgproxy-loader-minio-latest__data:
+    driver: local
+
+services:
+  application:
+    container_name: next-image-s3-imgproxy-loader
+    build:
+      context: .
+      dockerfile: Dockerfile
+      args:
+        VARIANT: 14
+        USER_UID: 1000
+        USER_GID: 1000
+    networks:
+      - next-image-s3-imgproxy-loader-network
+    volumes:
+      - ..:/workspace:cached
+      - ~/.ssh:/home/node/.ssh:ro
+      - /var/run/docker.sock:/var/run/docker.sock
+    command: sleep infinity
+    user: node
+    env_file:
+      - ./workspace.env
+    ports:
+      - 4000:4000
+      - 9000:9000
+      - 9001:9001
+
+  # Minio
+  next-image-s3-imgproxy-loader-minio-latest:
+    container_name: next-image-s3-imgproxy-loader-minio-latest
+    image: minio/minio:latest
+    network_mode: service:application
+    volumes:
+      - type: volume
+        source: next-image-s3-imgproxy-loader-minio-latest__data
+        target: /data
+        volume:
+          nocopy: false
+    command: server /data --console-address :9001
+    env_file:
+      - ./minio.env
+
+  # Imgproxy
+  next-image-s3-imgproxy-loader-imgproxy-latest:
+    container_name: next-image-s3-imgproxy-loader-imgproxy-latest
+    image: darthsim/imgproxy:latest
+    network_mode: service:application
+    env_file:
+      - ./imgproxy.env

.devcontainer/imgproxy.env

@@ -0,0 +1,8 @@
+IMGPROXY_BIND=0.0.0.0:4000
+IMGPROXY_ALLOWED_SOURCES=s3://
+IMGPROXY_USE_S3=true
+IMGPROXY_S3_ENDPOINT=http://localhost:9000
+IMGPROXY_KEY=91bdcda48ce22cd7d8d3a0eda930b3db1762bc1cba5dc13542e723b68fe55d6f9d18199cbe35191a45faf22593405cad0fe76ffec67d24f8aee861ac8fe44d96
+IMGPROXY_SALT=72456c286761260f320391fe500fcec53755958dabd288867a6db072e1bc1dbd84b15079838a83a715edc1ecad50c3ce91dd8fdef6f981816fa274f91d8ecf06
+AWS_ACCESS_KEY_ID=minio_user
+AWS_SECRET_ACCESS_KEY=minio_password

.devcontainer/init.sh

@@ -0,0 +1,7 @@
+#!/bin/bash
+NVMRC_VERSION="$(head -1 .nvmrc | sed 's/v//' | tr --delete '\n')"
+nvm install
+nvm use
+nvm alias  default $(node --version)
+nvm install-latest-npm
+npm i

.devcontainer/minio.env

@@ -0,0 +1,2 @@
+MINIO_ACCESS_KEY=minio_user
+MINIO_SECRET_KEY=minio_password

.devcontainer/workspace.env

@@ -0,0 +1 @@
+IMGPROXY_URL=http://localhost:4000 

.github/workflows/publish-npm-package.yml

@@ -0,0 +1,42 @@
+name: Publish npm package
+
+on:
+  release:
+    types: [created]
+
+jobs:
+  publish:
+    if: github.repository_owner == 'bitpatty'
+    name: Publish NPM package (GitHub Registry)
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: '16.6.1'
+          registry-url: 'https://npm.pkg.github.com'
+          scope: '@bitpatty'
+      - run: npm install
+      - run: npm run build
+      - run: echo "registry=https://npm.pkg.github.com/@bitpatty" >> .npmrc
+      - run: npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+  # publish-npmjs:
+  #   name: Publish NPM package (npmjs.org)
+  #   runs-on: ubuntu-latest
+  #   environment: npm-registry
+  #   steps:
+  #     - uses: actions/checkout@v2
+  #     - uses: actions/setup-node@v2
+  #       with:
+  #         node-version: '16.6.1'
+  #         registry-url: 'https://registry.npmjs.org'
+  #     - run: npm install
+  #     - run: npm publish
+  #       env:
+  #         NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+dist

.npmignore

@@ -0,0 +1,8 @@
+.vscode
+example
+src
+.nvmrc
+.prettierrc
+rollup.config.js
+test.js
+tsconfig.json

.nvmrc

@@ -0,0 +1 @@
+v16.6.1

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all",
+  "printWidth": 80
+}

.vscode/settings.json

@@ -0,0 +1,65 @@
+{
+    "[html]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[javascriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "[json]": {
+    "editor.quickSuggestions": {
+    "strings": true
+    },
+    "editor.suggest.insertMode": "replace",
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+    "files.autoSave": "off",
+    "breadcrumbs.symbolSortOrder": "type",
+    "coverage-gutters.coverageReportFileName": "coverage/**/index.html",
+    "coverage-gutters.showLineCoverage": true,
+    "editor.codeLens": true,
+    "editor.detectIndentation": true,
+    "editor.formatOnSave": true,
+    "editor.minimap.maxColumn": 150,
+    "editor.tabSize": 2,
+    "explorer.confirmDragAndDrop": false,
+    "files.associations": {
+    "*.erb": "html",
+    "*.html.erb": "html"
+    },
+    "git.confirmSync": false,
+    "git.enableSmartCommit": true,
+    "html.format.wrapLineLength": 150,
+    "javascript.updateImportsOnFileMove.enabled": "always",
+    "search.exclude": {
+    "**/*.eot": true,
+    "**/*.png": true,
+    "**/*.svg": true,
+    "**/*.ttf": true,
+    "**/*.woff": true,
+    "**/*.woff2": true,
+    "**/.git": true,
+    "**/bower_components": true,
+    "**/dist/": true,
+    "**/node_modules": true,
+    "**/tmp": true
+    },
+    "todohighlight.keywords": [
+    "@TODO"
+    ],
+    "typescript.preferences.importModuleSpecifier": "relative",
+    "typescript.referencesCodeLens.enabled": true,
+    "typescript.referencesCodeLens.showOnAllFunctions": true,
+    "typescript.reportStyleChecksAsWarnings": true,
+    "typescript.updateImportsOnFileMove.enabled": "always",
+    "workbench.editor.enablePreview": false,
+    "workbench.editor.enablePreviewFromQuickOpen": false
+    }

README.md

@@ -0,0 +1 @@
+# WIP next/image loader for imgproxy s3

example/.eslintrc.json

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

example/.gitignore

@@ -0,0 +1,34 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# 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
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel

example/README.md

@@ -0,0 +1,34 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+npm run dev
+# or
+yarn dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
+
+[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
+
+The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
+
+## Learn More
+
+To learn more about Next.js, take a look at the following resources:
+
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+
+## Deploy on Vercel
+
+The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

example/next-env.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

example/next.config.js

@@ -0,0 +1,6 @@
+const { loader } = require('../dist');
+
+/** @type {import('next').NextConfig} */
+module.exports = {
+  reactStrictMode: true,
+};