diff --git a/.github/workflows/production-deployment.yml b/.github/workflows/production-deployment.yml index 2db3074fb..8d29eb5e6 100644 --- a/.github/workflows/production-deployment.yml +++ b/.github/workflows/production-deployment.yml @@ -1,6 +1,7 @@ name: Production Deployment on: + workflow_dispatch: push: branches: - main @@ -8,6 +9,31 @@ on: - .github/workflows/** jobs: + build_and_push: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: Set up QEMU + uses: docker/setup-qemu-action@v3 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v3 + + - name: Login to Docker Hub + uses: docker/login-action@v3 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} + + - name: Build and push + uses: docker/build-push-action@v6 + with: + file: docker/prod/Dockerfile + push: true + tags: hngdevops/nextjs-boilerplate:prod + deploy_to_production: if: github.event.repository.fork == false runs-on: ubuntu-latest @@ -24,4 +50,5 @@ jobs: username: ${{ secrets.USERNAME }} password: ${{ secrets.PASSWORD }} script: | - ./deploy_prod.sh next + cd hng_boilerplate_nextjs + ./scripts/prod_deploy.sh diff --git a/.github/workflows/staging-deployment.yml b/.github/workflows/staging-deployment.yml index ed32fb66f..ea82c2617 100644 --- a/.github/workflows/staging-deployment.yml +++ b/.github/workflows/staging-deployment.yml @@ -1,6 +1,7 @@ name: Staging Deployment on: + workflow_dispatch: push: branches: - staging @@ -8,6 +9,31 @@ on: - .github/workflows/** jobs: + build_and_push: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + + - name: Set up QEMU + uses: docker/setup-qemu-action@v3 + + - name: Set up Docker Buildx + uses: docker/setup-buildx-action@v3 + + - name: Login to Docker Hub + uses: docker/login-action@v3 + with: + username: ${{ secrets.DOCKERHUB_USERNAME }} + password: ${{ secrets.DOCKERHUB_TOKEN }} + + - name: Build and push + uses: docker/build-push-action@v6 + with: + file: docker/staging/Dockerfile + push: true + tags: hngdevops/nextjs-boilerplate:staging + deploy_to_staging: if: github.event.repository.fork == false runs-on: ubuntu-latest @@ -24,4 +50,5 @@ jobs: username: ${{ secrets.USERNAME }} password: ${{ secrets.PASSWORD }} script: | - ./deploy_staging.sh next + cd hng_boilerplate_nextjs + ./scripts/staging_deploy.sh diff --git a/.github/workflows/team-deployment.yml b/.github/workflows/team-deployment.yml index dd04d55d7..e85a8c44c 100644 --- a/.github/workflows/team-deployment.yml +++ b/.github/workflows/team-deployment.yml @@ -25,6 +25,24 @@ jobs: script: | cd hng_boilerplate_nextjs ./scripts/team_deploy.sh kimiko-golang ${{ vars.PORT }} + kimiko-cs: + if: github.event.repository.fork == false + runs-on: ubuntu-latest + + environment: + name: "kimiko-cs" + url: ${{ vars.URL }} + + steps: + - name: Deploy to kimiko-cs environment + uses: appleboy/ssh-action@v1.0.3 + with: + host: ${{ secrets.HOST }} + username: ${{ secrets.USERNAME }} + password: ${{ secrets.PASSWORD }} + script: | + cd hng_boilerplate_nextjs + ./scripts/team_deploy.sh kimiko-cs ${{ vars.PORT }} cyborgs-java: if: github.event.repository.fork == false diff --git a/docker/prod/docker-compose.yml b/docker/prod/docker-compose.yml index 9fa19856a..38660d65b 100644 --- a/docker/prod/docker-compose.yml +++ b/docker/prod/docker-compose.yml @@ -1,12 +1,11 @@ services: - next-prod-frontend-1: - build: - context: ../../ - dockerfile: docker/prod/Dockerfile + frontend: + image: hngdevops/nextjs-boilerplate:prod ports: - 3000:3000 - restart: always + volumes: + - ../../.env:/app/.env # next-prod-frontend-2: # build: diff --git a/docker/staging/docker-compose.yml b/docker/staging/docker-compose.yml index 96ed1f242..d279c3648 100644 --- a/docker/staging/docker-compose.yml +++ b/docker/staging/docker-compose.yml @@ -1,12 +1,11 @@ services: - next-staging-frontend-1: - build: - context: ../../ - dockerfile: docker/staging/Dockerfile + frontend: + image: hngdevops/nextjs-boilerplate:staging ports: - 3200:3000 - restart: always + volumes: + - ../../.env:/app/.env # next-staging-frontend-2: # build: diff --git a/scripts/prod_deploy.sh b/scripts/prod_deploy.sh index e192db8c1..38ab8d1a1 100755 --- a/scripts/prod_deploy.sh +++ b/scripts/prod_deploy.sh @@ -1,22 +1,8 @@ #!/bin/bash -if [ "$#" -ne 1 ]; then - echo "Usage: $0 {next|remix}" - exit 1 -fi +set -e -if [ "$1" == "next" ]; then - cd /home/nextjs/prod/hng_boilerplate_nextjs - git pull origin main - docker compose -f docker/prod/docker-compose.yml build - docker compose -f docker/prod/docker-compose.yml up -d -elif [ "$1" == "remix" ]; then - cd /home/remixjs/prod/hng_boilerplate_remix - git pull origin main - docker compose -f docker/prod/docker-compose.yml build - docker compose -f docker/prod/docker-compose.yml up -d -else - echo "Invalid argument. Use 'next' or 'remix'." - echo "Usage: $0 {next|remix}" - exit 1 -fi +cd "$(git rev-parse --show-toplevel)" +git pull origin main +docker pull hngdevops/nextjs-boilerplate:prod +docker compose --project-name prod-nextjs -f docker/prod/docker-compose.yml up -d diff --git a/scripts/staging_deploy.sh b/scripts/staging_deploy.sh index cc2ba3194..9a5f36ef3 100755 --- a/scripts/staging_deploy.sh +++ b/scripts/staging_deploy.sh @@ -1,22 +1,8 @@ #!/bin/bash -if [ "$#" -ne 1 ]; then - echo "Usage: $0 {next|remix}" - exit 1 -fi +set -e -if [ "$1" == "next" ]; then - cd /home/nextjs/staging/hng_boilerplate_nextjs - git pull origin staging - docker compose -f docker/staging/docker-compose.yml build - docker compose -f docker/staging/docker-compose.yml up -d -elif [ "$1" == "remix" ]; then - cd /home/remixjs/staging/hng_boilerplate_remix - git pull origin staging - docker compose -f docker/staging/docker-compose.yml build - docker compose -f docker/staging/docker-compose.yml up -d -else - echo "Invalid argument. Use 'next' or 'remix'." - echo "Usage: $0 {next|remix}" - exit 1 -fi +cd "$(git rev-parse --show-toplevel)" +git pull origin staging +docker pull hngdevops/nextjs-boilerplate:staging +docker compose --project-name staging-nextjs -f docker/staging/docker-compose.yml up -d diff --git a/src/app/(auth-routes)/register/page.tsx b/src/app/(auth-routes)/register/page.tsx index e5845f651..2c4d59ced 100644 --- a/src/app/(auth-routes)/register/page.tsx +++ b/src/app/(auth-routes)/register/page.tsx @@ -2,14 +2,13 @@ import { zodResolver } from "@hookform/resolvers/zod"; import { DialogContent, DialogTitle } from "@radix-ui/react-dialog"; -import Image from "next/image"; import Link from "next/link"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import { useForm } from "react-hook-form"; import { z } from "zod"; +import CustomButton from "~/components/common/common-button/common-button"; import { DialogDemo } from "~/components/common/Dialog"; -import { Button } from "~/components/ui/button"; import { Form, FormControl, @@ -24,6 +23,8 @@ import { InputOTPGroup, InputOTPSlot, } from "~/components/ui/input-otp"; +import { useToast } from "~/components/ui/use-toast"; +import { getApiUrl } from "~/utils/getApiUrl"; const formSchema = z.object({ fullname: z.string().min(2, { @@ -40,6 +41,26 @@ const formSchema = z.object({ type FormData = z.infer; const SignUp = () => { + const [apiUrl, setApiUrl] = useState(""); + const { toast } = useToast(); + + useEffect(() => { + const fetchApiUrl = async () => { + try { + const url = await getApiUrl(); + setApiUrl(url); + } catch { + toast({ + title: "Error", + description: "Failed to fetch API URL", + variant: "destructive", + }); + } + }; + + fetchApiUrl(); + }, [toast]); + const form = useForm({ resolver: zodResolver(formSchema), }); @@ -53,7 +74,7 @@ const SignUp = () => { })(); }; - const handleSubmit = () => { + const handleSubmit = async () => { form.handleSubmit(handleFormSubmit)(); }; @@ -66,26 +87,77 @@ const SignUp = () => {

- - + + + + + + + } + > + Sign up with Google + + + + + + + + + + + + } + > + Sign up with Facebook +
@@ -157,9 +229,14 @@ const SignUp = () => { )} /> - + { ))} - +

Would you rather use email and password? diff --git a/src/utils/getApiUrl.ts b/src/utils/getApiUrl.ts new file mode 100644 index 000000000..2579b1996 --- /dev/null +++ b/src/utils/getApiUrl.ts @@ -0,0 +1,11 @@ +"use server"; + +export const getApiUrl = async (): Promise => { + const apiUrl = process.env.API_URL; + + if (!apiUrl) { + throw new Error("API_URL environment variable is not defined"); + } + + return apiUrl; +};