From 50bb9ef5db094e881a60d8ce0c303aad7098eab2 Mon Sep 17 00:00:00 2001 From: Ricardo Campos Date: Thu, 12 Sep 2024 21:31:41 -0300 Subject: [PATCH 1/4] feat: change to ghcr -m issue --- .github/workflows/pr.yml | 12 ++-- .gitignore | 12 ++-- client/src/App.tsx | 11 ++- client/src/views/Landing/index.tsx | 10 +-- client/src/views/Login/index.tsx | 108 +++++++++++++++++++++++++++++ docker-compose.yml | 21 +++--- tools/run-docker.sh | 3 + tools/stop-docker.sh | 3 + 8 files changed, 156 insertions(+), 24 deletions(-) create mode 100644 client/src/views/Login/index.tsx create mode 100755 tools/run-docker.sh create mode 100755 tools/stop-docker.sh diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index c5a88b7..298bd1e 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -35,17 +35,21 @@ jobs: - uses: actions/checkout@v4 - uses: docker/setup-buildx-action@v3 name: Set up Docker Buildx + - uses: docker/login-action@v3 name: Login to Docker Hub with: - username: ${{ secrets.DOCKERHUB_USERNAME }} - password: ${{ secrets.DOCKERHUB_TOKEN }} + registry: ghcr.io + username: ${{ github.actor }} + password: ${{ secrets.GITHUB_TOKEN }} + - name: Build and push uses: docker/build-push-action@v6 with: push: true - context: ./client - tags: rmcampos/tasknote:${{ github.event.number }} + context: ./ + file: client/Dockerfile + tags: rmcampos/tasknote-client:${{ github.event.number }} build-args: BUILD=${{ github.event.number }} cache-from: type=gha cache-to: type=gha,mode=max diff --git a/.gitignore b/.gitignore index b4850e6..4ec0a9a 100644 --- a/.gitignore +++ b/.gitignore @@ -1,16 +1,16 @@ # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies -/node_modules -/.pnp -.pnp.js +client/node_modules +client/.pnp +client.pnp.js # testing -/coverage +client/coverage # production -/build -/dist +client/build +client/dist # misc .DS_Store diff --git a/client/src/App.tsx b/client/src/App.tsx index 2f71b60..82fc9b7 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -11,14 +11,23 @@ import Layout from './layout/PrivateLayout'; import browserRoutes from './routes'; import NotFound from './views/NotFound'; import AuthContext from './context/AuthContext'; +import Login from './views/Login'; const App: React.FC = () => { const { signed, checkCurrentAuthUser } = useContext(AuthContext); const notSignedRouter = createBrowserRouter([ { - path: '*', + path: '/', element: + }, + { + path: '/signin', + element: + }, + { + path: '*', + element: } ]); diff --git a/client/src/views/Landing/index.tsx b/client/src/views/Landing/index.tsx index 32f83e1..9977a4a 100644 --- a/client/src/views/Landing/index.tsx +++ b/client/src/views/Landing/index.tsx @@ -1,22 +1,22 @@ -import React, { useContext } from 'react'; +import React from 'react'; import { Button } from 'react-bootstrap'; import './styles.scss'; -import AuthContext from '../../context/AuthContext'; +import { useNavigate } from 'react-router-dom'; /** * */ function Landing() { - const { signIn } = useContext(AuthContext); + const navigate = useNavigate(); return ( <>

This is landing page

); diff --git a/client/src/views/Login/index.tsx b/client/src/views/Login/index.tsx new file mode 100644 index 0000000..a8ade4f --- /dev/null +++ b/client/src/views/Login/index.tsx @@ -0,0 +1,108 @@ +import React, { useContext, useEffect, useState } from 'react'; +import AuthContext from '../../context/AuthContext'; +import { Button, Form } from 'react-bootstrap'; +import { FeedbackType } from 'react-bootstrap/esm/Feedback'; + +function Login() { + const { signIn } = useContext(AuthContext); + const [validated, setValidated] = useState(true); + const [email, setEmail] = useState(''); + const [password, setPassword] = useState(''); + const [emailValidType, setEmailValidType] = useState('valid'); + const [emailValidMsg, setEmailValidMsg] = useState('Looks good!'); + const [passwordValidType, setPasswordValidType] = useState('valid'); + const [passwordValidMsg, setPasswordValidMsg] = useState('Looks good!'); + + const handleSubmit = (event: React.FormEvent) => { + event.preventDefault(); + event.stopPropagation(); + setValidated(true); + + const form = event.currentTarget; + if (form.checkValidity() === false) { + console.log('form is invalid!'); + + if (email.length === 0) { + setEmailValidType('invalid'); + setEmailValidMsg('Please type your email!'); + } else { + setEmailValidType('valid'); + setEmailValidMsg('Looks good!'); + } + + if (password.length === 0) { + setPasswordValidType('invalid'); + setPasswordValidMsg('Please type your password!'); + } else { + setPasswordValidType('valid'); + setPasswordValidMsg('Looks good!'); + } + + return; + } + + setEmailValidType('valid'); + setEmailValidMsg('Looks good!'); + + setPasswordValidType('valid'); + setPasswordValidMsg('Looks good!'); + console.log('form is valid!'); + console.log(`email=${email}, password=${password}`); + }; + + const resetForm = () => { + setValidated(false); + setEmail(''); + setEmailValidType('valid'); + setPassword(''); + setPasswordValidType('valid'); + }; + + useEffect(() => {}, [validated]); + + return ( + <> +

This is login page

+
+ + Email address + setEmail(e.target.value)} + isInvalid={emailValidType === 'invalid'} + /> + + {emailValidMsg} + + + + + Password + setPassword(e.target.value)} + isInvalid={passwordValidType === 'invalid'} + /> + + {passwordValidMsg} + + + + + +
+ + ); +} + +export default Login; diff --git a/docker-compose.yml b/docker-compose.yml index 71f3ee4..10f645e 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -2,19 +2,23 @@ services: client: - container_name: tasknote + container_name: client image: node:20.17-bullseye-slim ports: - "5000:5000" entrypoint: sh -c "npm i --no-update-notifier && npm start" user: root volumes: - - "./:/app" + - "./client:/app" working_dir: /app environment: LOG_LEVEL: debug healthcheck: - test: timeout 10s bash -c 'true > /dev/tcp/127.0.0.1/3000' + test: timeout 10s bash -c 'true > /dev/tcp/127.0.0.1/5000' + interval: 1m30s + timeout: 15s + retries: 3 + start_period: 10s java-api: container_name: java-api @@ -39,9 +43,9 @@ services: healthcheck: test: curl -f http://localhost:8585/actuator/health | grep '"status":"UP"' interval: 1m30s - timeout: 30s - retries: 5 - start_period: 30s + timeout: 15s + retries: 3 + start_period: 10s postgres: container_name: postgres @@ -52,8 +56,9 @@ services: POSTGRES_USER: tasknoteuser POSTGRES_PASSWORD: default POSTGRES_PORT: 5432 + PGDATA: /tmp volumes: - - "/pgdata" + - "./data:/tmp" ports: - "5432:5432" healthcheck: @@ -61,7 +66,7 @@ services: interval: 1m30s timeout: 15s retries: 3 - start_period: 15s + start_period: 10s caddy: container_name: caddy diff --git a/tools/run-docker.sh b/tools/run-docker.sh new file mode 100755 index 0000000..4a16708 --- /dev/null +++ b/tools/run-docker.sh @@ -0,0 +1,3 @@ +#!/bin/bash + +docker compose up -d diff --git a/tools/stop-docker.sh b/tools/stop-docker.sh new file mode 100755 index 0000000..5e50d10 --- /dev/null +++ b/tools/stop-docker.sh @@ -0,0 +1,3 @@ +#!/bin/bash + +docker compose down From dbb8fe04961a824ed321056980b6d13b6b993081 Mon Sep 17 00:00:00 2001 From: Ricardo Campos Date: Thu, 12 Sep 2024 21:36:10 -0300 Subject: [PATCH 2/4] chore: fix lint issues issue #33 --- client/src/views/Landing/index.tsx | 2 +- client/src/views/Login/index.tsx | 14 +++++++------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/client/src/views/Landing/index.tsx b/client/src/views/Landing/index.tsx index 9977a4a..1b04833 100644 --- a/client/src/views/Landing/index.tsx +++ b/client/src/views/Landing/index.tsx @@ -14,7 +14,7 @@ function Landing() {

This is landing page

diff --git a/client/src/views/Login/index.tsx b/client/src/views/Login/index.tsx index a8ade4f..68e9473 100644 --- a/client/src/views/Login/index.tsx +++ b/client/src/views/Login/index.tsx @@ -1,8 +1,11 @@ import React, { useContext, useEffect, useState } from 'react'; -import AuthContext from '../../context/AuthContext'; import { Button, Form } from 'react-bootstrap'; import { FeedbackType } from 'react-bootstrap/esm/Feedback'; +import AuthContext from '../../context/AuthContext'; +/** + * Created the Login component. + */ function Login() { const { signIn } = useContext(AuthContext); const [validated, setValidated] = useState(true); @@ -20,8 +23,6 @@ function Login() { const form = event.currentTarget; if (form.checkValidity() === false) { - console.log('form is invalid!'); - if (email.length === 0) { setEmailValidType('invalid'); setEmailValidMsg('Please type your email!'); @@ -29,7 +30,7 @@ function Login() { setEmailValidType('valid'); setEmailValidMsg('Looks good!'); } - + if (password.length === 0) { setPasswordValidType('invalid'); setPasswordValidMsg('Please type your password!'); @@ -43,11 +44,10 @@ function Login() { setEmailValidType('valid'); setEmailValidMsg('Looks good!'); - + setPasswordValidType('valid'); setPasswordValidMsg('Looks good!'); - console.log('form is valid!'); - console.log(`email=${email}, password=${password}`); + signIn(); }; const resetForm = () => { From ba17ab210000e3e50a4a5b9b67590f9e1751a968 Mon Sep 17 00:00:00 2001 From: Ricardo Campos Date: Thu, 12 Sep 2024 21:38:43 -0300 Subject: [PATCH 3/4] ci: fix context client build issue #33 --- .github/workflows/pr.yml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index 298bd1e..66bad6d 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -47,8 +47,7 @@ jobs: uses: docker/build-push-action@v6 with: push: true - context: ./ - file: client/Dockerfile + context: ./client tags: rmcampos/tasknote-client:${{ github.event.number }} build-args: BUILD=${{ github.event.number }} cache-from: type=gha From 95aa8aa896f969727c0fc1e6a1b27bc5c3da7ff5 Mon Sep 17 00:00:00 2001 From: Ricardo Campos Date: Thu, 12 Sep 2024 21:48:00 -0300 Subject: [PATCH 4/4] ci: fix build tag issue #33 --- .github/workflows/pr.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index 66bad6d..732930e 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -37,7 +37,7 @@ jobs: name: Set up Docker Buildx - uses: docker/login-action@v3 - name: Login to Docker Hub + name: Login to GitHub Container Registry with: registry: ghcr.io username: ${{ github.actor }} @@ -48,7 +48,7 @@ jobs: with: push: true context: ./client - tags: rmcampos/tasknote-client:${{ github.event.number }} + tags: ghcr.io/ricardo-campos-org/react-typescript-todolist/client:${{ github.event.number }} build-args: BUILD=${{ github.event.number }} cache-from: type=gha cache-to: type=gha,mode=max