fix: replace broken default image

.eslintrc

@@ -26,6 +26,10 @@
     "no-restricted-syntax": "off",
     // disable the rule for all files
     "@typescript-eslint/explicit-module-boundary-types": "off",
+    "react/function-component-definition": [
+      2,
+      { "namedComponents": "arrow-function" }
+    ],
     "jsx-a11y/anchor-is-valid": [
       "error",
       {

cypress.config.ts

@@ -1,5 +1,5 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
-import { defineConfig } from 'cypress'
+import { defineConfig } from 'cypress';
 
 export default defineConfig({
   video: false,
@@ -11,9 +11,9 @@ export default defineConfig({
     // We've imported your old cypress plugins here.
     // You may want to clean this up later by importing these.
     setupNodeEvents(on, config) {
-      // eslint-disable-next-line global-require, @typescript-eslint/no-var-requires
-      return require('./cypress/plugins/index.js')(on, config)
+      // eslint-disable-next-line global-require, @typescript-eslint/no-var-requires, import/extensions
+      return require('./cypress/plugins/index.js')(on, config);
     },
     baseUrl: 'http://localhost:3111',
   },
-})
+});

cypress/e2e/item/thumbnails/viewThumbnails.cy.js

@@ -1,11 +1,11 @@
-import { DEFAULT_IMAGE_SRC } from '../../../../src/config/constants';
 import { HOME_PATH, SHARED_ITEMS_PATH } from '../../../../src/config/paths';
 import {
   HEADER_MEMBER_MENU_BUTTON_ID,
   buildItemCard,
   buildNameCellRendererId,
 } from '../../../../src/config/selectors';
 import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
+import defaultImage from '../../../../src/resources/avatar.png';
 import { MEMBERS } from '../../../fixtures/members';
 import { SAMPLE_ITEMS_WITH_THUMBNAILS } from '../../../fixtures/thumbnails';
 import { TABLE_ITEM_RENDER_TIME } from '../../../support/constants';
@@ -32,7 +32,7 @@ describe('View Thumbnails', () => {
     cy.wait(TABLE_ITEM_RENDER_TIME);
     cy.get(`#${buildItemCard(items[0].id)} img`)
       .should('have.attr', 'src')
-      .and('contain', DEFAULT_IMAGE_SRC);
+      .and('contain', defaultImage);
 
     cy.get(`#${buildItemCard(items[1].id)} img`)
       .should('have.attr', 'src')

src/components/item/settings/ThumbnailSetting.js

@@ -15,9 +15,9 @@ import {
   THUMBNAIL_SETTING_MAX_WIDTH,
 } from '../../../config/constants';
 import { useBuilderTranslation } from '../../../config/i18n';
-import defaultImage from '../../../config/logo.jpeg';
 import { hooks, useMutation } from '../../../config/queryClient';
 import { THUMBNAIL_SETTING_UPLOAD_BUTTON_CLASSNAME } from '../../../config/selectors';
+import defaultImage from '../../../resources/avatar.png';
 import { getEmbeddedLinkExtra } from '../../../utils/itemExtra';
 import { configureThumbnailUppy } from '../../../utils/uppy';
 import CropModal from '../../common/CropModal';

src/components/main/Item.tsx

@@ -11,13 +11,11 @@ import {
 } from '@graasp/sdk';
 import { Card as GraaspCard, Thumbnail } from '@graasp/ui';
 
-import {
-  DEFAULT_IMAGE_SRC,
-  DESCRIPTION_MAX_LENGTH,
-} from '../../config/constants';
+import { DESCRIPTION_MAX_LENGTH } from '../../config/constants';
 import { buildItemPath } from '../../config/paths';
 import { hooks } from '../../config/queryClient';
 import { buildItemCard, buildItemLink } from '../../config/selectors';
+import defaultImage from '../../resources/avatar.png';
 import { stripHtml } from '../../utils/item';
 import { getEmbeddedLinkExtra } from '../../utils/itemExtra';
 import { isItemUpdateAllowedForUser } from '../../utils/membership';
@@ -58,7 +56,7 @@ const Item: FC<Props> = ({ item, memberships }) => {
         height: '100%',
         objectFit: 'cover',
       }}
-      src={DEFAULT_IMAGE_SRC}
+      src={defaultImage}
       alt={alt}
     />
   );

src/components/member/AvatarSetting.js

@@ -15,9 +15,9 @@ import {
   THUMBNAIL_SETTING_MAX_WIDTH,
 } from '../../config/constants';
 import { useAccountTranslation } from '../../config/i18n';
-import defaultImage from '../../config/logo.jpeg';
 import { hooks, useMutation } from '../../config/queryClient';
 import { MEMBER_PROFILE_AVATAR_UPLOAD_BUTTON_CLASSNAME } from '../../config/selectors';
+import defaultImage from '../../resources/avatar.png';
 import { configureAvatarUppy } from '../../utils/uppy';
 import CropModal from '../common/CropModal';
 import StatusBar from '../file/StatusBar';

src/config/constants.ts

@@ -47,11 +47,6 @@ export const DOMAIN = process.env.REACT_APP_DOMAIN || 'localhost';
 
 export const DESCRIPTION_MAX_LENGTH = 30;
 
-// todo: use local image
-// this might require a webpack configuration for cypress
-export const DEFAULT_IMAGE_SRC =
-  'https://pbs.twimg.com/profile_images/1300707321262346240/IsQAyu7q_400x400.jpg';
-
 // time to be considered between 2 clicks for a double-click (https://en.wikipedia.org/wiki/Double-click#Speed_and_timing)
 export const DOUBLE_CLICK_DELAY_MS = 500;