Merge pull request #917 from bigcapitalhq/20260128-195652-2287

fix: dockerfile build script

packages/webapp/Dockerfile

@@ -1,27 +1,47 @@
-FROM node:18.16.0-alpine as build
-
-USER root
+# Stage 1: Build
+FROM node:18.16.0-alpine AS builder
 
 WORKDIR /app
 
-# Copy application dependency manifests to the container image.
-COPY . .
+# Install pnpm
+RUN npm install -g pnpm@8.10.2
 
-# Install application dependencies
-RUN apk update
-RUN apk add python3 build-base chromium
+# Install build dependencies
+RUN apk add --no-cache python3 build-base chromium
 
-# Set PYHTON env
+# Set Python environment
 ENV PYTHON=/usr/bin/python3
 
-# Install pnpm packages dependencies
-RUN npm install -g pnpm
+# Copy package files for dependency installation
+COPY --chown=node:node package.json pnpm-lock.yaml pnpm-workspace.yaml lerna.json ./
+COPY --chown=node:node packages/webapp/package.json ./packages/webapp/
+COPY --chown=node:node shared/bigcapital-utils/package.json ./shared/bigcapital-utils/
+COPY --chown=node:node shared/pdf-templates/package.json ./shared/pdf-templates/
+COPY --chown=node:node shared/email-components/package.json ./shared/email-components/
+
+# Install all dependencies (including devDependencies for build)
 RUN pnpm install
 
+# Copy source code for webapp and dependencies
+COPY --chown=node:node ./packages/webapp ./packages/webapp
+COPY --chown=node:node ./shared/bigcapital-utils ./shared/bigcapital-utils
+COPY --chown=node:node ./shared/pdf-templates ./shared/pdf-templates
+COPY --chown=node:node ./shared/email-components ./shared/email-components
+
 # Build webapp package
 RUN pnpm run build:webapp
 
-FROM nginx
+# Stage 2: Nginx
+FROM nginx:alpine
 
-COPY ./packages/webapp/nginx/sites/default.conf /etc/nginx/conf.d/default.conf
-COPY --from=build /app/packages/webapp/dist /usr/share/nginx/html
+# Copy nginx configuration
+COPY --chown=root:root ./packages/webapp/nginx/sites/default.conf /etc/nginx/conf.d/default.conf
+
+# Copy built webapp assets from builder stage
+COPY --from=builder --chown=nginx:nginx /app/packages/webapp/dist /usr/share/nginx/html
+
+# Expose port
+EXPOSE 80
+
+# Nginx runs as nginx user by default, which is good for security
+# No CMD needed as nginx base image already has it

packages/webapp/src/containers/Alerts/Accounts/AccountBulkActivateAlert.tsx

@@ -2,7 +2,7 @@
 import React, { useState } from 'react';
 import intl from 'react-intl-universal';
 import { Intent, Alert } from '@blueprintjs/core';
-import { queryCache } from 'react-query';
+import { useQueryClient } from 'react-query';
 import { FormattedMessage as T, AppToaster } from '@/components';
 
 import { withAlertStoreConnect } from '@/containers/Alert/withAlertStoreConnect';
@@ -22,6 +22,7 @@ function AccountBulkActivateAlert({
   requestBulkActivateAccounts,
 }) {
   const [isLoading, setLoading] = useState(false);
+  const queryClient = useQueryClient();
   const selectedRowsCount = 0;
 
   // Handle alert cancel.
@@ -38,9 +39,9 @@ function AccountBulkActivateAlert({
           message: intl.get('the_accounts_has_been_successfully_activated'),
           intent: Intent.SUCCESS,
         });
-        queryCache.invalidateQueries('accounts-table');
+        queryClient.invalidateQueries('accounts-table');
       })
-      .catch((errors) => { })
+      .catch((errors) => {})
       .finally(() => {
         setLoading(false);
         closeAlert(name);

packages/webapp/src/containers/Alerts/Accounts/AccountBulkInactivateAlert.tsx

@@ -3,7 +3,7 @@ import React, { useState } from 'react';
 import { FormattedMessage as T } from '@/components';
 import intl from 'react-intl-universal';
 import { Intent, Alert } from '@blueprintjs/core';
-import { queryCache } from 'react-query';
+import { useQueryClient } from 'react-query';
 import { AppToaster } from '@/components';
 
 // import { withAccountsActions } from '@/containers/Accounts/withAccountsTableActions';
@@ -22,8 +22,8 @@ function AccountBulkInactivateAlert({
 
   closeAlert,
 }) {
-
   const [isLoading, setLoading] = useState(false);
+  const queryClient = useQueryClient();
   const selectedRowsCount = 0;
 
   // Handle alert cancel.
@@ -39,9 +39,9 @@ function AccountBulkInactivateAlert({
           message: intl.get('the_accounts_have_been_successfully_inactivated'),
           intent: Intent.SUCCESS,
         });
-        queryCache.invalidateQueries('accounts-table');
+        queryClient.invalidateQueries('accounts-table');
       })
-      .catch((errors) => { })
+      .catch((errors) => {})
       .finally(() => {
         setLoading(false);
         closeAlert(name);

packages/webapp/src/containers/Alerts/Estimates/EstimateApproveAlert.tsx

@@ -3,7 +3,7 @@ import React, { useCallback } from 'react';
 import intl from 'react-intl-universal';
 import { AppToaster, FormattedMessage as T } from '@/components';
 import { Intent, Alert } from '@blueprintjs/core';
-import { queryCache } from 'react-query';
+import { useQueryClient } from 'react-query';
 
 import { useApproveEstimate } from '@/hooks/query';
 
@@ -25,6 +25,7 @@ function EstimateApproveAlert({
   // #withAlertActions
   closeAlert,
 }) {
+  const queryClient = useQueryClient();
   const { mutateAsync: deliverEstimateMutate, isLoading } =
     useApproveEstimate();
 
@@ -40,7 +41,7 @@ function EstimateApproveAlert({
           message: intl.get('the_estimate_has_been_approved_successfully'),
           intent: Intent.SUCCESS,
         });
-        queryCache.invalidateQueries('estimates-table');
+        queryClient.invalidateQueries('estimates-table');
       })
       .catch((error) => {})
       .finally(() => {

packages/webapp/src/containers/Dialogs/BillNumberDialog/BillNumberDialogContent.tsx

@@ -1,7 +1,7 @@
 // @ts-nocheck
 import React from 'react';
 import { DialogContent } from '@/components';
-import { useQuery, queryCache } from 'react-query';
+import { useQuery, useQueryClient } from 'react-query';
 
 import ReferenceNumberForm from '@/containers/JournalNumber/ReferenceNumberForm';
 
@@ -31,6 +31,7 @@ function BillNumberDialogContent({
   // #withBillsActions
   setBillNumberChanged,
 }) {
+  const queryClient = useQueryClient();
   const fetchSettings = useQuery(['settings'], () => requestFetchOptions({}));
 
   const handleSubmitForm = (values, { setSubmitting }) => {
@@ -45,7 +46,7 @@ function BillNumberDialogContent({
         setBillNumberChanged(true);
 
         setTimeout(() => {
-          queryCache.invalidateQueries('settings');
+          queryClient.invalidateQueries('settings');
         }, 250);
       })
       .catch(() => {