feat: Shared Data files (Feature PR) (#330)

.github/workflows/build.yml

@@ -4,9 +4,11 @@ on:
   push:
     branches:
       - main
+      - feature/shared-files
   pull_request:
     branches:
       - main
+      - feature/shared-files
 
 jobs:
   lint:
@@ -49,7 +51,7 @@ jobs:
 
       - name: Run test
         run: npm run test
-  
+
   tests-coverage:
     runs-on: ubuntu-latest
 

.github/workflows/check-commits.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     branches:
       - main
+      - feature/shared-files
     types:
       - opened
       - edited

.github/workflows/codeql-analysis.yml

@@ -13,10 +13,10 @@ name: "CodeQL"
 
 on:
   push:
-    branches: [ main ]
+    branches: [ main, feature/shared-files ]
   pull_request:
     # The branches below must be a subset of the branches above
-    branches: [ main ]
+    branches: [ main, feature/shared-files ]
   schedule:
     - cron: '34 6 * * 4'
 

.github/workflows/localization.yml

@@ -4,9 +4,11 @@ on:
   push:
     branches:
       - main
+      - feature/shared-files
   pull_request:
     branches:
       - main
+      - feature/shared-files
 
 jobs:
   missing-keys:

.prettierrc

@@ -8,7 +8,7 @@
 		"<THIRD_PARTY_MODULES>",
 		"^@mui/(.*)$",
 		"^(common|forms|layout|localization|monitoring|navigation|notifications|permissions|state)/(.*)$",
-		"^(account|contact|gis|group|home|landscape|terrasoBackend|tool|user)/(.*)$",
+		"^(account|contact|gis|group|home|landscape|sharedData|terrasoBackend|tool|user)/(.*)$",
 		"^(config|custom-hooks|react-hoc)$",
 		"^[./]",
 		"^assets/(.*)$",

local.env

@@ -1,3 +1,4 @@
 REACT_APP_TERRASO_ENV=local
 REACT_APP_TERRASO_API_URL=http://127.0.0.1:8000
 REACT_APP_PLAUSIBLE_DOMAIN=app.local.terraso.org
+REACT_APP_SHARED_DATA_ACCEPTED_EXTENSIONS=xlsx,xls,csv

package.json

@@ -17,6 +17,7 @@
     "@testing-library/user-event": "^14.0.0",
     "@turf/bbox": "^6.5.0",
     "@turf/helpers": "^6.5.0",
+    "filesize": "^8.0.7",
     "history": "^5.3.0",
     "i18next": "^21.6.14",
     "i18next-browser-languagedetector": "^6.1.4",
@@ -27,6 +28,7 @@
     "leaflet-geosearch": "^3.6.0",
     "lodash": "^4.17.21",
     "notistack": "^2.0.3",
+    "path-browserify": "^1.0.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-dropzone": "^12.0.4",

src/account/accountService.js

@@ -46,7 +46,7 @@ export const fetchUser = () => {
     ${userPreferences}
   `;
   return terrasoApi
-    .request(query, { email: getUserEmail() })
+    .requestGraphQL(query, { email: getUserEmail() })
     .then(_.get('users.edges[0].node'))
     .then(user => user || Promise.reject('not_found'))
     .then(user => ({
@@ -65,7 +65,7 @@ export const saveUser = user => {
     ${userFields}
   `;
   return terrasoApi
-    .request(query, {
+    .requestGraphQL(query, {
       input: _.omit(['profileImage', 'email', 'preferences'], user),
     })
     .then(response => ({
@@ -84,7 +84,7 @@ export const savePreference = ({ key, value }, currentUser) => {
     ${userPreferencesFields}
   `;
   return terrasoApi
-    .request(query, {
+    .requestGraphQL(query, {
       input: {
         userEmail: currentUser.email,
         key,

src/account/components/AccountProfile.test.js

@@ -59,7 +59,7 @@ test('AccountProfile: Display Avatar with missing image', async () => {
 });
 
 test('AccountProfile: Save', async () => {
-  terrasoApi.request.mockResolvedValue(
+  terrasoApi.requestGraphQL.mockResolvedValue(
     _.set(
       'updateUser.user',
       {
@@ -98,8 +98,8 @@ test('AccountProfile: Save', async () => {
   await act(async () =>
     fireEvent.click(screen.getByRole('button', { name: 'Confirm' }))
   );
-  expect(terrasoApi.request).toHaveBeenCalledTimes(1);
-  expect(terrasoApi.request.mock.calls[0][1]).toStrictEqual({
+  expect(terrasoApi.requestGraphQL).toHaveBeenCalledTimes(1);
+  expect(terrasoApi.requestGraphQL.mock.calls[0][1]).toStrictEqual({
     input: {
       id: 'user-id',
       firstName: 'Pablo',
@@ -108,7 +108,7 @@ test('AccountProfile: Save', async () => {
   });
 });
 test('AccountProfile: Save language', async () => {
-  terrasoApi.request.mockResolvedValueOnce(
+  terrasoApi.requestGraphQL.mockResolvedValueOnce(
     _.set(
       'updateUser.user',
       {
@@ -124,7 +124,7 @@ test('AccountProfile: Save language', async () => {
       {}
     )
   );
-  terrasoApi.request.mockResolvedValueOnce(
+  terrasoApi.requestGraphQL.mockResolvedValueOnce(
     _.set(
       'updateUserPreference.preference',
       { key: 'language', value: 'es-ES' },
@@ -164,15 +164,15 @@ test('AccountProfile: Save language', async () => {
   await act(async () =>
     fireEvent.click(screen.getByRole('button', { name: 'Confirm' }))
   );
-  expect(terrasoApi.request).toHaveBeenCalledTimes(2);
-  expect(terrasoApi.request.mock.calls[0][1]).toStrictEqual({
+  expect(terrasoApi.requestGraphQL).toHaveBeenCalledTimes(2);
+  expect(terrasoApi.requestGraphQL.mock.calls[0][1]).toStrictEqual({
     input: {
       id: 'user-id',
       firstName: 'Pablo',
       lastName: 'Perez',
     },
   });
-  expect(terrasoApi.request.mock.calls[1][1]).toStrictEqual({
+  expect(terrasoApi.requestGraphQL.mock.calls[1][1]).toStrictEqual({
     input: {
       key: 'language',
       userEmail: '[email protected]',
@@ -181,7 +181,7 @@ test('AccountProfile: Save language', async () => {
   });
 });
 test('AccountProfile: Save error', async () => {
-  terrasoApi.request.mockRejectedValueOnce('Save Error');
+  terrasoApi.requestGraphQL.mockRejectedValueOnce('Save Error');
 
   const { inputs } = await setup({
     account: {
@@ -205,7 +205,7 @@ test('AccountProfile: Save error', async () => {
   await act(async () =>
     fireEvent.click(screen.getByRole('button', { name: 'Confirm' }))
   );
-  expect(terrasoApi.request).toHaveBeenCalledTimes(1);
+  expect(terrasoApi.requestGraphQL).toHaveBeenCalledTimes(1);
 
   // Test error display
   expect(screen.getByText(/Save Error/i)).toBeInTheDocument();

src/account/components/RequireAuth.test.js

@@ -32,7 +32,7 @@ test('Auth: test redirect', async () => {
   useParams.mockReturnValue({
     slug: 'slug-1',
   });
-  terrasoApi.request.mockRejectedValueOnce('UNAUTHENTICATED');
+  terrasoApi.requestGraphQL.mockRejectedValueOnce('UNAUTHENTICATED');
   global.fetch.mockResolvedValueOnce({
     status: 401,
   });
@@ -59,7 +59,7 @@ test('Auth: test redirect', async () => {
   );
 
   expect(global.fetch).toHaveBeenCalledTimes(2);
-  expect(terrasoApi.request).toHaveBeenCalledTimes(1);
+  expect(terrasoApi.requestGraphQL).toHaveBeenCalledTimes(1);
   expect(screen.getByText('To: /account')).toBeInTheDocument();
 });
 test('Auth: test redirect referrer', async () => {
@@ -81,7 +81,7 @@ test('Auth: test refresh tokens', async () => {
   useParams.mockReturnValue({
     slug: 'slug-1',
   });
-  terrasoApi.request
+  terrasoApi.requestGraphQL
     .mockRejectedValueOnce('UNAUTHENTICATED')
     .mockResolvedValueOnce({});
   global.fetch.mockResolvedValueOnce({
@@ -114,7 +114,7 @@ test('Auth: test refresh tokens', async () => {
 });
 test('Auth: test fetch user', async () => {
   getUserEmail.mockReturnValue(Promise.resolve('[email protected]'));
-  terrasoApi.request.mockReturnValue(
+  terrasoApi.requestGraphQL.mockReturnValue(
     Promise.resolve(
       _.set(
         'users.edges[0].node',
@@ -141,5 +141,5 @@ test('Auth: test fetch user', async () => {
     }
   );
 
-  expect(terrasoApi.request).toHaveBeenCalledTimes(1);
+  expect(terrasoApi.requestGraphQL).toHaveBeenCalledTimes(1);
 });

src/common/components/ConfirmButton.js

@@ -14,6 +14,7 @@ const ConfirmButton = props => {
     loading,
     buttonProps,
     onConfirm,
+    variant,
   } = props;
 
   useEffect(() => {
@@ -39,10 +40,10 @@ const ConfirmButton = props => {
       <LoadingButton
         onClick={onClick}
         loading={loading}
-        variant="outlined"
+        variant={variant || 'outlined'}
         {...(buttonProps || {})}
       >
-        {buttonLabel}
+        {buttonLabel || props.children}
       </LoadingButton>
     </>
   );