Merge pull request #37 from twentyhq/cbo-install-fa-pro

Migrate to FontAwesome pro
2025-10-29 20:02:29 +00:00 · 2023-04-14 12:42:35 +02:00
parent 1b1b5c9584 c317d4bcf6
commit d767160b03
11 changed files with 29 additions and 23 deletions
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@@ -22,6 +22,8 @@ jobs:
            ${{ runner.os }}-build-
            ${{ runner.os }}-
      - name: Install Dependencies
+        env:
+          FONTAWESOME_NPM_AUTH_TOKEN: ${{ secrets.FONTAWESOME_NPM_AUTH_TOKEN }}
        run: cd front && npm install
      - name: Run tests and code coverage
        run: cd front && npm run coverage-ci
--- a/infra/dev/.front.env.example
+++ b/infra/dev/.front.env.example
@@ -1 +1,2 @@
 REACT_APP_API_URL=http://localhost:3000
+FONTAWESOME_NPM_AUTH_TOKEN=REPLACE_ME
--- a/front/.npmrc
+++ b/front/.npmrc
@@ -0,0 +1,2 @@
+@fortawesome:registry=https://npm.fontawesome.com/
+//npm.fontawesome.com/:_authToken=${FONTAWESOME_NPM_AUTH_TOKEN}
--- a/front/package-lock.json
+++ b/front/package-lock.json
@@ -12,8 +12,8 @@
        "@emotion/react": "^11.10.6",
        "@emotion/styled": "^11.10.5",
        "@fortawesome/fontawesome-svg-core": "^6.2.1",
-        "@fortawesome/free-regular-svg-icons": "^6.2.1",
-        "@fortawesome/free-solid-svg-icons": "^6.2.1",
+        "@fortawesome/pro-regular-svg-icons": "^6.4.0",
+        "@fortawesome/pro-solid-svg-icons": "^6.4.0",
        "@fortawesome/react-fontawesome": "^0.2.0",
        "@tanstack/react-table": "^8.8.5",
        "@types/node": "^16.18.4",
@@ -3092,11 +3092,10 @@
        "node": ">=6"
      }
    },
-    "node_modules/@fortawesome/free-regular-svg-icons": {
+    "node_modules/@fortawesome/pro-regular-svg-icons": {
      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.4.0.tgz",
-      "integrity": "sha512-ZfycI7D0KWPZtf7wtMFnQxs8qjBXArRzczABuMQqecA/nXohquJ5J/RCR77PmY5qGWkxAZDxpnUFVXKwtY/jPw==",
-      "hasInstallScript": true,
+      "resolved": "https://npm.fontawesome.com/@fortawesome/pro-regular-svg-icons/-/6.4.0/pro-regular-svg-icons-6.4.0.tgz",
+      "integrity": "sha512-yEJgoA/31qfIsD27kAg31BODCD+bvgievPp4R39F3kUp/+mu05qX6xgW366RUfs4CnTWSw0fFpc4AhFwC7xbJw==",
      "dependencies": {
        "@fortawesome/fontawesome-common-types": "6.4.0"
      },
@@ -3104,11 +3103,10 @@
        "node": ">=6"
      }
    },
-    "node_modules/@fortawesome/free-solid-svg-icons": {
+    "node_modules/@fortawesome/pro-solid-svg-icons": {
      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.4.0.tgz",
-      "integrity": "sha512-kutPeRGWm8V5dltFP1zGjQOEAzaLZj4StdQhWVZnfGFCvAPVvHh8qk5bRrU4KXnRRRNni5tKQI9PBAdI6MP8nQ==",
-      "hasInstallScript": true,
+      "resolved": "https://npm.fontawesome.com/@fortawesome/pro-solid-svg-icons/-/6.4.0/pro-solid-svg-icons-6.4.0.tgz",
+      "integrity": "sha512-R54gxoqHAZdlSCmE7JYpQKT64Jgw59nQIyabT6oh3jsb70O4A3ea+ojVBCKsvoW4UhYe1IOXS1o4PqDEW8Y7Tg==",
      "dependencies": {
        "@fortawesome/fontawesome-common-types": "6.4.0"
      },
--- a/front/package.json
+++ b/front/package.json
@@ -7,8 +7,8 @@
    "@emotion/react": "^11.10.6",
    "@emotion/styled": "^11.10.5",
    "@fortawesome/fontawesome-svg-core": "^6.2.1",
-    "@fortawesome/free-regular-svg-icons": "^6.2.1",
-    "@fortawesome/free-solid-svg-icons": "^6.2.1",
+    "@fortawesome/pro-regular-svg-icons": "^6.4.0",
+    "@fortawesome/pro-solid-svg-icons": "^6.4.0",
    "@fortawesome/react-fontawesome": "^0.2.0",
    "@tanstack/react-table": "^8.8.5",
    "@types/node": "^16.18.4",
@@ -89,7 +89,6 @@
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
-    "react-scripts": "5.0.1",
    "@types/jest": "^27.5.2",
    "@typescript-eslint/eslint-plugin": "^5.45.0",
    "babel-plugin-named-exports-order": "^0.0.2",
@@ -104,6 +103,7 @@
    "eslint-plugin-storybook": "^0.6.11",
    "prettier": "^2.8.0",
    "prop-types": "^15.8.1",
+    "react-scripts": "5.0.1",
    "storybook": "^7.0.2",
    "typescript": "^4.9.3",
    "webpack": "^5.75.0"
--- a/front/src/layout/navbar/Navbar.tsx
+++ b/front/src/layout/navbar/Navbar.tsx
@@ -5,8 +5,8 @@ import { Workspace } from '../../interfaces/workspace.interface';
 import NavItem from './NavItem';
 import NavTitle from './NavTitle';
 import WorkspaceContainer from './WorkspaceContainer';
-import { faUser } from '@fortawesome/free-regular-svg-icons';
-import { faBuilding } from '@fortawesome/free-regular-svg-icons';
+import { faUser } from '@fortawesome/pro-regular-svg-icons';
+import { faBuildings } from '@fortawesome/pro-regular-svg-icons';

 const NavbarContainer = styled.div`
  display: flex;
@@ -48,7 +48,7 @@ function Navbar({ workspace }: OwnProps) {
          <NavItem
            label="Companies"
            to="/companies"
-            icon={faBuilding}
+            icon={faBuildings}
            active={
              !!useMatch({
                path: useResolvedPath('/companies').pathname,
--- a/front/src/layout/navbar/stories/NavItem.stories.tsx
+++ b/front/src/layout/navbar/stories/NavItem.stories.tsx
@@ -1,5 +1,5 @@
 import { MemoryRouter } from 'react-router-dom';
-import { faUser } from '@fortawesome/free-regular-svg-icons';
+import { faUser } from '@fortawesome/pro-regular-svg-icons';
 import { ThemeProvider } from '@emotion/react';

 import NavItem from '../../../layout/navbar/NavItem';
--- a/front/src/pages/companies/Companies.tsx
+++ b/front/src/pages/companies/Companies.tsx
@@ -1,9 +1,9 @@
-import { faBuilding } from '@fortawesome/free-regular-svg-icons';
+import { faBuildings } from '@fortawesome/pro-regular-svg-icons';
 import WithTopBarContainer from '../../layout/containers/WithTopBarContainer';

 function Companies() {
  return (
-    <WithTopBarContainer title="Companies" icon={faBuilding}>
+    <WithTopBarContainer title="Companies" icon={faBuildings}>
      <></>
    </WithTopBarContainer>
  );
--- a/front/src/pages/people/People.tsx
+++ b/front/src/pages/people/People.tsx
@@ -1,11 +1,11 @@
 import {
-  faBuilding,
+  faBuildings,
  faCalendar,
  faEnvelope,
  faRectangleList,
  faUser,
-} from '@fortawesome/free-regular-svg-icons';
-import { faList, faMapPin, faPhone } from '@fortawesome/free-solid-svg-icons';
+} from '@fortawesome/pro-regular-svg-icons';
+import { faList, faMapPin, faPhone } from '@fortawesome/pro-solid-svg-icons';
 import WithTopBarContainer from '../../layout/containers/WithTopBarContainer';
 import Table from '../../components/table/Table';
 import { Company } from '../../interfaces/company.interface';
@@ -123,7 +123,7 @@ const columns = [
    ),
  }),
  columnHelper.accessor('company', {
-    header: () => <TableHeader viewName="Company" viewIcon={faBuilding} />,
+    header: () => <TableHeader viewName="Company" viewIcon={faBuildings} />,
    cell: (props) => (
      <CellLink
        name={props.row.original.company.name}
--- a/infra/dev/front/Dockerfile
+++ b/infra/dev/front/Dockerfile
@@ -7,6 +7,7 @@ RUN apk update && apk upgrade && \
 WORKDIR /app/front
 COPY ../../front .

+RUN export $(xargs <.env)
 RUN npm install

 CMD ["npm", "run", "start"]
--- a/infra/prod/front/Dockerfile
+++ b/infra/prod/front/Dockerfile
@@ -1,5 +1,7 @@
 FROM node:18-alpine as front

+ARG FONTAWESOME_NPM_AUTH_TOKEN
+
 WORKDIR /app/front
 COPY ./front .