GitHub actions

.github/workflows/github-actions.yml

@@ -0,0 +1,102 @@
+name: Build & deploy
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [12.x, 14.x, 16.x]
+
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@v2
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v2
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+    - name: Install dependencies
+      run: npm ci
+    - name: Run code style check
+      run: npm run lint
+    - name: Run code formatter
+      run: npm run prettier
+    - name: Build
+      run: npm run build --if-present
+    - name: Create deploy folder
+      run: mkdir deploy
+    - name: Copy content from build folder to deploy folder
+      run: cp -r ./build/. ./deploy
+    - name: Copy content from public folder to deploy folder
+      run: cp -r ./public/. ./deploy
+    - name: Add script tag into index.html
+      run: sed -i '4 i <script src="./direflowBundle.js"></script>' './deploy/index.html'
+    - name: Upload production-ready build files on main branch
+      if: github.event_name != 'pull_request'
+      uses: actions/upload-artifact@v2
+      with:
+        name: production-files
+        path: ./deploy
+    - name: Upload production-ready build files on pull_request
+      if: github.event_name == 'pull_request'
+      uses: actions/upload-artifact@v2
+      with:
+        name: pull-request-files
+        path: ./deploy
+
+  deploy:
+    name: Deploy
+    needs: build
+    runs-on: ubuntu-latest
+    environment: 
+      name: github-pages
+      url: https://simtlix.github.io/simfinity-web/${{ env.branch_name }}
+    steps:
+
+    # save branch name on main branch.
+    - name: Save branch name on main branch
+      if: github.event_name != 'pull_request'
+      run: echo "branch_name=${{ github.head_ref }}" >> $GITHUB_ENV
+      id: extract_branch
+
+    # save branch name on pull request
+    - name: Save branch name on pull request
+      if: github.event_name == 'pull_request'
+      run: echo "branch_name=${{ github.head_ref }}" >> $GITHUB_ENV
+
+    - name: Download artifact on main branch
+      if: github.event_name != 'pull_request'
+      uses: actions/download-artifact@v2
+      with:
+        name: production-files
+        path: ./deploy
+    - name: Download artifact on pull_request
+      if: github.event_name == 'pull_request'
+      uses: actions/download-artifact@v2
+      with:
+        name: pull-request-files
+        path: ./deploy
+    - name: Deploy to gh-pages on main branch
+      if: github.event_name != 'pull_request'
+      uses: peaceiris/actions-gh-pages@v3
+      with:
+        github_token: ${{ secrets.ACTIONS_DEPLOY_ACCESS_TOKEN }}
+        publish_dir: ./deploy
+        destination_dir: ${{ env.branch_name }}
+        keep_files: true
+    - name: Deploy to gh-pages on pull_request
+      if: github.event_name == 'pull_request'
+      uses: peaceiris/actions-gh-pages@v3
+      with:
+        github_token: ${{ secrets.ACTIONS_DEPLOY_ACCESS_TOKEN }}
+        publish_dir: ./deploy
+        destination_dir: ${{ env.branch_name }}
+        keep_files: false

package.json

@@ -4,6 +4,7 @@
   "version": "1.0.0",
   "author": "Multiscreen Technology Group - SimTLiX SRL",
   "license": "SEE LICENSE IN LICENSE",
+  "homepage": "https://simtlix.github.io/simfinity-web/",
   "repository": {
     "type": "git",
     "url": "https://github.com/simtlix/simfinity-web"
@@ -13,6 +14,8 @@
     "build"
   ],
   "scripts": {
+    "predeploy": "npm run build",
+    "deploy": "gh-pages -d deploy",
     "start": "direflow-scripts start",
     "build": "direflow-scripts build",
     "build:lib": "direflow-scripts build:lib",
@@ -28,6 +31,7 @@
     "babel-eslint": "^10.1.0",
     "direflow-component": "3.5.3",
     "direflow-scripts": "3.5.3",
+    "gh-pages": "^3.2.3",
     "react": "16.13.1",
     "react-dom": "16.13.1",
     "react-hook-form": "^7.4.0",

src/direflow-components/App.js

@@ -34,10 +34,23 @@ const App = ({ url }) => {
       }
     });
   }, [url]);
+
   useEffect(() => {
+    // usar useCallBack
+    const handleClick = (entity, ind) => {
+      setCurrentEntity(entity);
+      setResultTitle(
+        intl.formatMessage({
+          id: `entity.${entity.name}.plural`,
+          defaultMessage: `Resultados de ${entity.name}`,
+        })
+      );
+      setSelectedKey(ind.toString());
+    };
     if (entities[0]?.name) {
       handleClick(entities[0], 0);
     }
+    // eslint-disable-next-line
   }, [entities]);
   const handleClick = (entity, ind) => {
     setCurrentEntity(entity);

src/direflow-components/Form/Collection.js

@@ -203,6 +203,7 @@ const Collection = ({
         }
       );
     }
+    // eslint-disable-next-line
   }, [parentId]);
 
   const handleSearch = (selectedKeys, confirm) => {

src/direflow-components/Form/FormStack.js

@@ -78,6 +78,7 @@ const FormStack = ({ displayEntity = null, onSuccess, mode, id }) => {
         return newState;
       });
     },
+    // eslint-disable-next-line
     [entitiesStack, openForResultForms]
   );
 
@@ -120,6 +121,7 @@ const FormStack = ({ displayEntity = null, onSuccess, mode, id }) => {
         }
       });
     }
+    // eslint-disable-next-line
   }, []);
 
   const onSubmit = (data, name) => {
@@ -198,6 +200,7 @@ const FormStack = ({ displayEntity = null, onSuccess, mode, id }) => {
         </InstancesContext.Provider>
       </FormAntd.Provider>
     );
+    // eslint-disable-next-line
   }, [entitiesStack]);
 
   return render();

src/direflow-components/Form/SelectEntities.js

@@ -110,6 +110,7 @@ export const SelectEntities = ({
         setResponseEntity(data);
       });
     }
+    // eslint-disable-next-line
   }, [initialValue, initialValueFromForm]);
 
   useEffect(() => {
@@ -166,8 +167,8 @@ export const SelectEntities = ({
       setResponseEntity(data);
     });
     //}
+    // eslint-disable-next-line
   }, [selectValues]);
-
   const renderSelect = useCallback(() => {
     const options = responseEntity?.map((item) => {
       return (
@@ -177,6 +178,7 @@ export const SelectEntities = ({
       );
     });
     return options;
+    // eslint-disable-next-line
   }, [responseEntity]);
 
   // siempre se va a mandar el id como field en este tipo de conexion ?
@@ -233,6 +235,7 @@ export const SelectEntities = ({
         </Space>
       </FormAntd.Item>
     );
+    // eslint-disable-next-line
   }, [responseEntity, initialValue, initialValueFromForm]);
 
   return element();