add a new util: buildURL

src/config/cdn.ts

@@ -0,0 +1,2 @@
+export const CDN_URI =
+  process.env.REACT_APP_CDN_URI ?? 'http://localhost:9000/';

src/features/QuestionsPage/components/FormDialog/FormDialog.tsx

@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 import { useForm, Controller } from 'react-hook-form';
-import { pick, get } from 'lodash';
+import { get } from 'lodash';
 import useQualifications from './FormDialog.useQualifications';
 import { capitalizeFirstLetter } from './helpers';
 import { QuestionInput, Question, Maybe, Answer } from 'libs/graphql/types';
@@ -106,10 +106,14 @@ const FormDialog = ({ open, onClose, question, onSubmit }: FormDialogProps) => {
       (uploadedImage && uploadedImage.length > 0) ||
       (question && get(question, key) && !get(images, deleteKey))
     ) {
+      let src = get(question, key, '');
+      if (src && question) {
+        src += `?` + new Date(question.updatedAt).getTime();
+      }
       return (
         <ImagePreview
           file={uploadedImage?.item(0)}
-          src={get(question, key, '')}
+          src={src}
           onDelete={() => {
             setValue(key, undefined);
             setValue(deleteKey, true);

src/features/QuestionsPage/components/FormDialog/ImagePreview.tsx

@@ -1,4 +1,6 @@
 import { useEffect, useState } from 'react';
+import buildURL from 'utils/buildURL';
+
 import { Tooltip, IconButton, Box } from '@material-ui/core';
 import { Delete as DeleteIcon } from '@material-ui/icons';
 
@@ -13,7 +15,10 @@ const PreviewImage = ({ file, src, onDelete, disabled }: PreviewImageProps) => {
   const [_src, _setSrc] = useState<string>('');
 
   useEffect(() => {
-    if (!file) return _setSrc(src ?? '');
+    if (!file && !src && process.env.NODE_ENV === 'development') {
+      console.warn('PreviewImage: you should specify file or src');
+    }
+    if (!file) return _setSrc(buildURL('cdn', src ?? ''));
     const reader = new FileReader();
 
     reader.onload = function (e) {

src/utils/buildURL.ts

@@ -0,0 +1,11 @@
+import { CDN_URI } from 'config/cdn';
+
+const buildURL = (type: 'cdn', str: string): string => {
+  switch (type) {
+    case 'cdn':
+      return CDN_URI + str;
+  }
+  return str;
+};
+
+export default buildURL;