Add fly.io deployment.

.dockerignore

@@ -0,0 +1,38 @@
+# flyctl launch added from .gitignore
+# 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*
+**\.pnpm-debug.log*
+
+# local env files
+**\.env
+
+# vercel
+**\.vercel
+
+# typescript
+**\*.tsbuildinfo
+**\next-env.d.ts
+fly.toml

Dockerfile

@@ -1,5 +1,7 @@
-FROM node:18
-ENTRYPOINT [ "/bin/sh", "-c"]
+FROM node:latest
+ENTRYPOINT [ "/bin/bash", "-c"]
+
 WORKDIR /app
 COPY . .
+
 RUN yarn install

fly.toml

@@ -0,0 +1,17 @@
+# fly.toml app configuration file generated for ventry-frontend-1 on 2023-06-07T23:50:53+07:00
+#
+# See https://fly.io/docs/reference/configuration/ for information about how to use this file.
+#
+
+app = "ventry-frontend-1"
+primary_region = "sin"
+
+[build]
+  dockerfile = "flyio.Dockerfile"
+
+[http_service]
+  internal_port = 8080
+  force_https = true
+  auto_stop_machines = true
+  auto_start_machines = true
+  min_machines_running = 0

flyio.Dockerfile

@@ -0,0 +1,10 @@
+FROM node:latest
+ENTRYPOINT [ "/bin/bash", "-c"]
+
+WORKDIR /app
+COPY . .
+
+RUN yarn global add serve
+RUN yarn install
+RUN yarn build
+CMD yarn serve

package.json

@@ -6,7 +6,8 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "serve": "serve -s dist -p 8080"
   },
   "dependencies": {
     "@emotion/react": "^11.10.6",

src/components/managements/items/item_insert_modal.tsx

@@ -7,9 +7,6 @@ import pageSlice, {PageState} from "@/slices/page_slice";
 import {useDispatch, useSelector} from "react-redux";
 import Content from "@/models/value_objects/contracts/content";
 import messageModalSlice from "@/slices/message_modal_slice";
-import ItemBundleService from "@/services/item_bundle_map_service";
-import CreateOneItemBundleRequest
-    from "@/models/value_objects/contracts/requests/managements/item_bundle_maps/create_one_request";
 import "@/styles/components/managements/items/item_insert_modal.scss";
 import {AuthenticationState} from "@/slices/authentication_slice";
 import Item from "@/models/entities/item";

src/components/managements/locations/location_insert_modal.tsx

@@ -52,9 +52,9 @@ export default function LocationInsertModalComponent() {
                     currentModal: "noModal"
                 }))
                 dispatch(pageSlice.actions.configureCompanyAccountManagement({
-                  ...pageState.companyAccountManagement,
-                  currentLocations: [content.data, ...currentLocations!],
-              }))
+                    ...pageState.companyAccountManagement,
+                    currentLocations: [content.data, ...currentLocations!],
+                }))
                 dispatch(messageModalSlice.actions.configure({
                     type: "succeed",
                     content: "Insert Location succeed.",

src/components/managements/pos/checkout_modal.tsx

@@ -130,7 +130,8 @@ export default function CheckoutModalComponent() {
                                     <div className="row">
                                         <fieldset className="form-group paymentMethod">
                                             <label htmlFor="paymentMethod">Payment Method</label>
-                                            <Field as="select" name="paymentMethod" className="form-control mt-2" disabled>
+                                            <Field as="select" name="paymentMethod" className="form-control mt-2"
+                                                   disabled>
                                                 <option selected value="cash">Cash</option>
                                             </Field>
                                             <ErrorMessage name="paymentMethod" component="div" className="text-danger"/>

src/pages/managements/companies/account.tsx

@@ -31,33 +31,33 @@ export default function CompanyAccount() {
     const {currentAccount} = authenticationState;
     const pageState: PageState = useSelector((state: any) => state.page);
     const {currentModal, companyAccounts, roles} = pageState.companyAccountManagement;
-    const accounts = companyAccounts!.map(acc => ({ role: roles!.find(role => role.id === acc.roleId), ...acc}))
+    const accounts = companyAccounts!.map(acc => ({role: roles!.find(role => role.id === acc.roleId), ...acc}))
     const dispatch = useDispatch();
-    
+
     const fetchCompanyAccountsAndCurrentCompany = () => {
         companyService.readAllByAccountId({
             accountId: currentAccount?.id
         }).then((result) => {
             const companyContent: Content<Company[]> = result.data;
 
             Promise.all([
-              roleService
-                  .readAll(),
-              accountService
-                  .readAllByCompanyId({
-                      companyId: companyContent.data[0].id
-                   })
+                roleService
+                    .readAll(),
+                accountService
+                    .readAllByCompanyId({
+                        companyId: companyContent.data[0].id
+                    })
             ]).then((response) => {
                 const roles: Content<Role[]> = response[0].data;
                 const accountContent: Content<Account[]> = response[1].data;
                 dispatch(pageSlice.actions.configureCompanyAccountManagement({
-                  ...pageState.companyAccountManagement,
-                  currentCompany: companyContent.data[0],
-                  companyAccounts: accountContent.data.sort((a, b) => {
-                      return new Date(b.updatedAt!).getTime() - new Date(a.updatedAt!).getTime()
-                  }),
-                  roles: roles.data
-              }))
+                    ...pageState.companyAccountManagement,
+                    currentCompany: companyContent.data[0],
+                    companyAccounts: accountContent.data.sort((a, b) => {
+                        return new Date(b.updatedAt!).getTime() - new Date(a.updatedAt!).getTime()
+                    }),
+                    roles: roles.data
+                }))
             }).catch((error) => {
                 console.log(error);
             })

src/pages/managements/forecasts/stock.tsx

@@ -85,11 +85,11 @@ export default function Stock() {
                 </div>
 
                 <div className="body">
-                  {items?.length == 0 ? (
+                    {items?.length == 0 ? (
                         <div className="empty-data">
                             <div className="text">
                                 Your items is empty, try to insert one!
-                          </div>
+                            </div>
                         </div>
                     ) : undefined}
                     {items && items.map((value, index) => (

src/pages/managements/forecasts/transaction.tsx

@@ -89,7 +89,7 @@ export default function Transaction() {
                         <div className="empty-data">
                             <div className="text">
                                 Your items is empty, try to insert one!
-                          </div>
+                            </div>
                         </div>
                     ) : undefined}
                     {items && items.map((value, index) => (

src/pages/managements/items.tsx

@@ -110,7 +110,7 @@ export default function Items() {
                         <div className="empty-data">
                             <div className="text">
                                 Your items is empty, try to insert one!
-                          </div>
+                            </div>
                         </div>
                     ) : undefined}
                     {items && items.map((value, idx) => (

src/pages/managements/pos.tsx

@@ -23,7 +23,7 @@ import {PlusLg} from "react-bootstrap-icons";
 import messageModalSlice from "@/slices/message_modal_slice";
 
 
-const AutoSearchFormikMiddleware = () => {
+const AutoSearchFormikMiddleware = (): any => {
     const formik = useFormikContext();
     const [initialValueSearch, setInitialValueSearch] = useState({searchValue: ""})
 
@@ -212,7 +212,7 @@ export default function PointOfSale() {
         }))
     }
 
-    const serviceCharge = (10/100*subtotal)
+    const serviceCharge = (10 / 100 * subtotal)
 
     const totalPrice = subtotal + serviceCharge
 

src/styles/pages/managements/companies/account.scss

@@ -124,7 +124,7 @@
 }
 
 @media (min-width: 0px) and (max-width: 767px) {
-  .page.company-account{
+  .page.company-account {
     min-height: 92vh;
   }
   .page.company-account .header {

src/styles/pages/managements/companies/information.scss

@@ -59,7 +59,7 @@ $primary-blue: #007bff;
 }
 
 @media (min-width: 0px) and (max-width: 768px) {
-  .page.company-information{
+  .page.company-information {
     min-height: 92vh;
   }
   .page.company-information .header {