From f3679f55efc10ce6260fd6ccc5799c7eea0b876a Mon Sep 17 00:00:00 2001 From: jiangjiwei Date: Mon, 17 Mar 2025 13:08:13 +0800 Subject: [PATCH 1/2] =?UTF-8?q?chore:=20=F0=9F=A4=96=20add=20github=20acti?= =?UTF-8?q?on=20build=20docker=20image?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/docker-build-publish.yml | 52 ++++++++++++++++++++++ README.md | 51 +++++++++++++++++++++ 2 files changed, 103 insertions(+) create mode 100644 .github/workflows/docker-build-publish.yml diff --git a/.github/workflows/docker-build-publish.yml b/.github/workflows/docker-build-publish.yml new file mode 100644 index 0000000..ff80b17 --- /dev/null +++ b/.github/workflows/docker-build-publish.yml @@ -0,0 +1,52 @@ +name: Docker Build and Publish + +on: + push: + branches: [ "main" ] + workflow_dispatch: + +env: + REGISTRY: ghcr.io + IMAGE_NAME: ${{ github.repository }} + +jobs: + build-and-push: + runs-on: ubuntu-latest + permissions: + contents: read + packages: write + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v3 + + - name: Log in to the Container registry + uses: docker/login-action@v3 + with: + registry: ${{ env.REGISTRY }} + username: ${{ github.actor }} + password: ${{ secrets.GITHUB_TOKEN }} + + - name: Extract metadata (tags, labels) for Docker + id: meta + uses: docker/metadata-action@v5 + with: + images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }} + tags: | + type=raw,value=latest,enable={{is_default_branch}} + type=sha,format=short + type=ref,event=branch + type=ref,event=tag + + - name: Build and push Docker image + uses: docker/build-push-action@v5 + with: + context: . + push: true + tags: ${{ steps.meta.outputs.tags }} + labels: ${{ steps.meta.outputs.labels }} + cache-from: type=gha + cache-to: type=gha,mode=max \ No newline at end of file diff --git a/README.md b/README.md index 17cd5de..c60caf6 100644 --- a/README.md +++ b/README.md @@ -116,6 +116,57 @@ docker run -p 3000:3000 --env-file .env nextjs-gemini-image-editing Open [http://localhost:3000](http://localhost:3000) with your browser to see the application. +### GitHub Actions Automated Build + +This project is configured with GitHub Actions workflow to automatically build Docker images and publish them to GitHub Container Registry (GHCR). + +#### Triggers + +The workflow is triggered by: +- Push to the `main` branch +- Manual workflow dispatch + +#### Features + +1. Checkout repository code +2. Set up Docker Buildx +3. Log in to GitHub Container Registry +4. Extract Docker image metadata (tags, labels) +5. Build and push Docker image to GitHub Container Registry + +#### Image Tags + +Automatically generated tags include: +- `latest` (only for default branch) +- Short SHA commit hash +- Branch name +- Tag name (if any) + +#### Permissions + +The workflow requires the following permissions: +- `contents: read` - Read repository contents +- `packages: write` - Write to GitHub Packages (for publishing Docker images) + +#### Usage + +1. Ensure GitHub Actions is enabled for your repository +2. Ensure GitHub Packages is enabled for your repository +3. Push code to the `main` branch or manually trigger the workflow +4. After the build completes, view the published Docker image on the GitHub Packages page + +#### Pull Image + +```bash +docker pull ghcr.io/[username]/[repository]:latest +``` + +#### Run Container + +```bash +docker run -p 3000:3000 -e GEMINI_API_KEY=your_google_api_key ghcr.io/[username]/[repository]:latest +``` + ## Technologies Used - [Next.js](https://nextjs.org/) - React framework for the web application From 5e149d4106214c90a1a7c19abc7901d8ea05e71c Mon Sep 17 00:00:00 2001 From: jiangjiwei Date: Mon, 17 Mar 2025 13:13:17 +0800 Subject: [PATCH 2/2] =?UTF-8?q?refactor=EF=BC=9A=20Update=20the=20Dockerfi?= =?UTF-8?q?le=20to=20disable=20lint=20checks=20during=20build;=20add=20the?= =?UTF-8?q?=20build=20parameter=20NEXT=5FTELEMETRY=5FDISABLED=20in=20GitHu?= =?UTF-8?q?b=20Actions;=20add=20eslint=20disable=20comments=20in=20the=20I?= =?UTF-8?q?mageResultDisplay=20and=20ImageUpload=20components=20to=20avoid?= =?UTF-8?q?=20warnings.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/docker-build-publish.yml | 4 +++- Dockerfile | 6 +++--- components/ImageResultDisplay.tsx | 2 ++ components/ImageUpload.tsx | 15 +++++++++------ 4 files changed, 17 insertions(+), 10 deletions(-) diff --git a/.github/workflows/docker-build-publish.yml b/.github/workflows/docker-build-publish.yml index ff80b17..e260718 100644 --- a/.github/workflows/docker-build-publish.yml +++ b/.github/workflows/docker-build-publish.yml @@ -49,4 +49,6 @@ jobs: tags: ${{ steps.meta.outputs.tags }} labels: ${{ steps.meta.outputs.labels }} cache-from: type=gha - cache-to: type=gha,mode=max \ No newline at end of file + cache-to: type=gha,mode=max + build-args: | + NEXT_TELEMETRY_DISABLED=1 \ No newline at end of file diff --git a/Dockerfile b/Dockerfile index 02e5f05..b2cc90f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -30,9 +30,9 @@ COPY . . # ENV NEXT_TELEMETRY_DISABLED=1 RUN \ - if [ -f yarn.lock ]; then yarn run build; \ - elif [ -f package-lock.json ]; then npm run build; \ - elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm run build; \ + if [ -f yarn.lock ]; then yarn run build --no-lint; \ + elif [ -f package-lock.json ]; then npm run build --no-lint; \ + elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm run build --no-lint; \ else echo "Lockfile not found." && exit 1; \ fi diff --git a/components/ImageResultDisplay.tsx b/components/ImageResultDisplay.tsx index 65a4982..fe51aee 100644 --- a/components/ImageResultDisplay.tsx +++ b/components/ImageResultDisplay.tsx @@ -57,6 +57,7 @@ export function ImageResultDisplay({
+ {/* eslint-disable-next-line @next/next/no-img-element */} Generated{part.text}

} {part.image && (
+ {/* eslint-disable-next-line @next/next/no-img-element */} {`${item.role} void; currentImage: string | null; @@ -119,11 +119,14 @@ export function ImageUpload({ onImageSelect, currentImage }: ImageUploadProps) {
- Selected +
+ {/* eslint-disable-next-line @next/next/no-img-element */} + Selected +
)}