Compare commits

..

No commits in common. "main" and "master" have entirely different histories.
main ... master

14 changed files with 20 additions and 198 deletions

View File

@ -1,7 +0,0 @@
.vscode/
node_modules/
npm-debug.log
dist/
build/
test/
yarn-error.log

View File

@ -1,7 +1,4 @@
{ {
"editor.defaultFormatter": "esbenp.prettier-vscode", "editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true, "editor.formatOnSave": true
"[dockerfile]": {
"editor.defaultFormatter": "ms-azuretools.vscode-docker"
}
} }

View File

@ -1,31 +0,0 @@
# Build application
FROM cubetiq/calpine-node AS builder
RUN apk update && \
# For build commit hash in "process.env.COMMIT_ID"
apk add git && \
apk add tzdata && \
cp /usr/share/zoneinfo/Asia/Phnom_Penh /etc/localtime && \
echo "Asia/Phnom_Penh" > /etc/timezone
WORKDIR /app
COPY package.json ./
# Set custom registry for npm registry (from cubetiq local server)
RUN yarn config set registry https://r.ctdn.net
RUN yarn
COPY . .
RUN yarn build
# Clean up unused packages
RUN apk del tzdata && \
apk del git
# Build production image
FROM nginx:alpine
LABEL maintainer="sombochea@cubetiqs.com"
WORKDIR /usr/share/nginx/html
COPY --from=builder /app/build/ /usr/share/nginx/html
COPY --from=builder /app/docker/nginx.conf /etc/nginx/conf.d
RUN rm /etc/nginx/conf.d/default.conf
EXPOSE 80

View File

@ -1,50 +1,16 @@
const path = require('path') const path = require('path');
const webpack = require('webpack')
const npmPackage = require('./package.json')
const { v4: uuidv4 } = require('uuid')
const { execSync } = require('child_process')
// Get the last commit id/log
const gitFetchCommitIdCommand = 'git rev-parse HEAD'
// Execute the command
const fetchGitCommitId = () => {
try {
return execSync(gitFetchCommitIdCommand).toString().trim()
} catch (e) {
console.error(e)
return '-1'
}
}
// get current date (build date time)
const today = new Date()
// get date as version suffix: 10112021
const dateVersion = `${today.getDay()}${today.getMonth()}${today.getFullYear()}`
module.exports = { module.exports = {
webpack: { webpack: {
alias: { alias: {
'@': path.resolve(__dirname, 'src/'), '@': path.resolve(__dirname, 'src/')
}, }
plugins: { },
add: [ jest: {
new webpack.DefinePlugin({ configure: {
'process.env.PACKAGE_NAME': `"${npmPackage.name}"`, moduleNameMapper: {
'process.env.PACKAGE_VERSION': `"${dateVersion}"`, '^@(.*)$': '<rootDir>/src$1'
'process.env.BUILD_NUMBER': `"${uuidv4()}"`, }
'process.env.BUILD_DATE': `"${today.toLocaleString()}"`, }
'process.env.COMMIT_ID': `"${fetchGitCommitId()}"`, }
}), };
],
},
},
jest: {
configure: {
moduleNameMapper: {
'^@(.*)$': '<rootDir>/src$1',
},
},
},
}

View File

@ -1,21 +0,0 @@
server {
listen 80;
# serve static files
location ~ ^/(images|javascript|js|css|flash|media|static)/ {
root /usr/share/nginx/html;
expires 30d;
}
# serve default location
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}

View File

@ -43,7 +43,7 @@
] ]
}, },
"devDependencies": { "devDependencies": {
"@craco/craco": "^6.4.3", "@craco/craco": "^6.1.2",
"@testing-library/jest-dom": "^5.11.4", "@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0", "@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10", "@testing-library/user-event": "^12.1.10",
@ -52,9 +52,9 @@
"@types/react": "^17.0.0", "@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0", "@types/react-dom": "^17.0.0",
"@types/react-router-dom": "^5.1.7", "@types/react-router-dom": "^5.1.7",
"craco-less": "^2.0.0", "craco-less": "^1.17.1",
"prettier": "^2.3.1", "prettier": "^2.3.1",
"react-scripts": "5.0.0", "react-scripts": "4.0.3",
"typescript": "^4.5.4" "typescript": "^4.1.2"
} }
} }

View File

@ -1,9 +0,0 @@
#!/bin/sh -e
echo "Building docker image..."
docker build . -t myreactapp:latest
echo "Running docker image..."
docker run --cpus=".1" --memory="5m" --rm -it -p 3003:3000 myreactapp:latest
# Now you can access the app at http://localhost:3003

View File

@ -1,5 +0,0 @@
export const APP_NAME = process.env.PACKAGE_NAME
export const APP_VERSION = process.env.PACKAGE_VERSION
export const APP_BUILD_NUMBER = process.env.BUILD_NUMBER
export const APP_BUILD_DATE = process.env.BUILD_DATE
export const APP_COMMIT_ID = process.env.COMMIT_ID

View File

@ -1,25 +0,0 @@
import {
APP_BUILD_DATE,
APP_BUILD_NUMBER,
APP_COMMIT_ID,
APP_NAME,
APP_VERSION,
} from '@/app.config'
import { RouteTypes } from '@/routes/types'
import './index.less'
export default function Info() {
return (
<div>
<h1>App Info</h1>
<p>App name: {APP_NAME}</p>
<p>App version: {APP_VERSION}</p>
<p>App build number: {APP_BUILD_NUMBER}</p>
<p>App build date: {APP_BUILD_DATE}</p>
<p> App commit id: {APP_COMMIT_ID}</p>
<br />
<a href={RouteTypes.RESET}>Reset</a>
</div>
)
}

View File

@ -1,23 +0,0 @@
import { RouteTypes } from '@/routes/types'
import { clearStorage } from '@/utils/ls_util'
import { useEffect } from 'react'
import { Redirect } from 'react-router'
const Reset = () => {
const clearAllCaches = () => {
caches.keys().then((cacheNames) => {
cacheNames.forEach((cacheName) => {
caches.delete(cacheName).then((r) => console.log('Caches cleared', r))
})
})
}
useEffect(() => {
clearStorage()
sessionStorage.clear()
clearAllCaches()
}, [])
return <Redirect to={RouteTypes.HOME} />
}
export default Reset

View File

@ -1,10 +1,8 @@
import About from '@/pages/About' import About from '@/pages/About'
import NotFound from '@/pages/Error/404' import NotFound from '@/pages/Error/404'
import Home from '@/pages/Home' import Home from '@/pages/Home'
import Info from '@/pages/Info'
import Login from '@/pages/Login' import Login from '@/pages/Login'
import Profile from '@/pages/Profile' import Profile from '@/pages/Profile'
import Reset from '@/pages/Reset'
import { CustomRouteProps } from '@/routes/interfaces' import { CustomRouteProps } from '@/routes/interfaces'
import { RouteTypes } from '@/routes/types' import { RouteTypes } from '@/routes/types'
@ -26,18 +24,6 @@ const routes: CustomRouteProps[] = [
path: RouteTypes.ABOUT, path: RouteTypes.ABOUT,
component: () => <About />, component: () => <About />,
}, },
{
exact: true,
key: 'info',
path: RouteTypes.INFO,
component: () => <Info />,
},
{
exact: true,
key: 'reset',
path: RouteTypes.RESET,
component: () => <Reset />,
},
{ {
exact: true, exact: true,
key: 'profile', key: 'profile',

View File

@ -2,8 +2,6 @@ const RouteTypes = {
HOME: "/", HOME: "/",
ABOUT: "/about", ABOUT: "/about",
PROFILE: "/profile", PROFILE: "/profile",
INFO: "/info",
RESET: "/reset",
// Auth // Auth
LOGIN: '/login', LOGIN: '/login',

View File

@ -4,8 +4,4 @@ export const setStorage = (key: string, value?: any) => {
export const getStorage = (key: string, defaultValue?: string): (string | undefined | null) => { export const getStorage = (key: string, defaultValue?: string): (string | undefined | null) => {
return localStorage.getItem(key) ?? defaultValue return localStorage.getItem(key) ?? defaultValue
}
export const clearStorage = () => {
return localStorage.clear()
} }