From 8cb47a6ec02371ebb6448195ed126b4164c6c77c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?German=20Urrustaraz=C3=BA?= Date: Mon, 18 Jul 2022 10:01:26 -0300 Subject: [PATCH 1/8] fix loading admins (#174) --- frontend/packages/client/src/pages/Community.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/packages/client/src/pages/Community.js b/frontend/packages/client/src/pages/Community.js index d9171fcd2..fdc71b38e 100644 --- a/frontend/packages/client/src/pages/Community.js +++ b/frontend/packages/client/src/pages/Community.js @@ -417,7 +417,7 @@ export default function Community() { {activeTabMap['proposals'] && ( )} {activeTabMap['members'] && ( From 2c8b704e40ab314791b68a09585b46c6cc5d1398 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?German=20Urrustaraz=C3=BA?= Date: Mon, 18 Jul 2022 13:20:03 -0300 Subject: [PATCH 2/8] CAS-248 - add error message for in-line image (#178) * add error message and update style * update style * update style --- .../client/src/components/UploadImageModal.js | 42 ++++++++++++++----- frontend/packages/client/src/const/index.js | 2 + 2 files changed, 34 insertions(+), 10 deletions(-) diff --git a/frontend/packages/client/src/components/UploadImageModal.js b/frontend/packages/client/src/components/UploadImageModal.js index 071013e80..798e5f9a8 100644 --- a/frontend/packages/client/src/components/UploadImageModal.js +++ b/frontend/packages/client/src/components/UploadImageModal.js @@ -1,8 +1,11 @@ import React, { useCallback, useState, useEffect, useMemo } from 'react'; import { useDropzone } from 'react-dropzone'; -import { useFileUploader } from '../hooks'; -import { Upload, Bin } from '../components/Svg'; -import { Loader } from '../components'; +import { useFileUploader, useMediaQuery } from 'hooks'; +import { Upload, Bin } from 'components/Svg'; +import { Loader } from 'components'; +import { MAX_PROPOSAL_IMAGE_FILE_SIZE } from 'const'; + +const MAX_IMAGE_FILES = 1; const IMAGE_STATUS = { notStarted: 'not-started', @@ -85,7 +88,7 @@ function ImageUploader({

{reducedFileName}

-
+
deleteImage(imageKey)}>
@@ -95,6 +98,7 @@ function ImageUploader({ } const UploadArea = ({ getRootProps, getInputProps, enableUpload }) => { + const notMobile = useMediaQuery(); return (
{ position: 'relative', height: '100%', width: '100%', + ...(!notMobile ? { minHeight: '150px' } : {}), }} disabled={enableUpload} {...(enableUpload ? getRootProps() : undefined)} @@ -134,12 +139,13 @@ export default function UploadImageModal({ onDismiss, isCancelling = false, onDone, + maxImageFiles = MAX_IMAGE_FILES, }) { - const MAX_IMAGE_FILES = 1; const [images, setImages] = useState([]); // when more than one image is added this will be an array mapping the images array const [captionValues, setCaptionValues] = useState(['']); + const [errorMessage, setErrorMessage] = useState(null); const _onDismiss = () => { onDismiss(); }; @@ -166,7 +172,15 @@ export default function UploadImageModal({ const onDrop = useCallback( (acceptedFiles) => { + // clean previous error message + if (errorMessage) { + setErrorMessage(null); + } acceptedFiles.forEach((imageFile) => { + if (imageFile.size > MAX_PROPOSAL_IMAGE_FILE_SIZE) { + setErrorMessage('The selected file exceeds the 2MB limit.'); + return; + } const imageAsURL = URL.createObjectURL(imageFile); const img = new Image(); @@ -183,12 +197,12 @@ export default function UploadImageModal({ img.src = imageAsURL; }); }, - [setImages] + [setImages, errorMessage, setErrorMessage] ); const { getRootProps, getInputProps } = useDropzone({ onDrop, - maxFiles: MAX_IMAGE_FILES, + maxFiles: maxImageFiles, accept: 'image/jpeg,image/png,image/gif', }); @@ -264,15 +278,17 @@ export default function UploadImageModal({ )} {images.length > 0 && (
-
+
-
-

Uploaded file

+
+

+ Uploaded file +

{images.map((image, i) => { return ( @@ -295,6 +311,11 @@ export default function UploadImageModal({ Accepted files: PNG, JPG, GIF

+ {errorMessage && ( +
+

{errorMessage}

+
+ )} {/* For now this is a single input */} setCaptionValues([`${e.target.value}`])} autoFocus + style={{ maxHeight: '42px' }} />
diff --git a/frontend/packages/client/src/const/index.js b/frontend/packages/client/src/const/index.js index 8649ed718..351734dd0 100644 --- a/frontend/packages/client/src/const/index.js +++ b/frontend/packages/client/src/const/index.js @@ -3,6 +3,8 @@ export const MAX_FILE_SIZE = 5242880; // 1024 * 1024 * 2 = 2MB export const MAX_AVATAR_FILE_SIZE = 2097152; +export const MAX_PROPOSAL_IMAGE_FILE_SIZE = 2097152; + export const FilterValues = { all: 'All', active: 'Active', From ff7be3c0e3cee63294e32fe97a2a970d4025f7e5 Mon Sep 17 00:00:00 2001 From: Christopher J Keller Date: Mon, 18 Jul 2022 11:27:36 -0500 Subject: [PATCH 3/8] cas-134 Display proposal strategy name instead of icon (#139) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * cas-134 display proposal strategy name instead of icon * update Proposal page components to reflect single strategy * add cursor pointer * use chaining operator to check field * change field to strategyName * add comment Co-authored-by: German Urrustarazu Co-authored-by: German Urrustarazú --- .../src/components/ProposalInformation.js | 14 ++++------- .../client/src/components/StrategyModal.js | 24 ++++++++----------- .../packages/client/src/pages/Proposal.js | 8 ++++--- 3 files changed, 19 insertions(+), 27 deletions(-) diff --git a/frontend/packages/client/src/components/ProposalInformation.js b/frontend/packages/client/src/components/ProposalInformation.js index 9e21328a5..9cd3ee026 100644 --- a/frontend/packages/client/src/components/ProposalInformation.js +++ b/frontend/packages/client/src/components/ProposalInformation.js @@ -1,6 +1,6 @@ import React, { useEffect, useRef, useState } from 'react'; import Blockies from 'react-blockies'; -import { LinkOut, StrategyIcon } from './Svg'; +import { LinkOut } from './Svg'; import { parseDateFromServer } from '../utils'; import { useVotingResults, useWindowDimensions } from '../hooks'; import useMediaQuery, { mediaMatchers } from '../hooks/useMediaQuery'; @@ -121,7 +121,7 @@ const WrapperSpacingBottom = ({ const ProposalInformation = ({ creatorAddr = '', - strategies = [], + strategyName = '', isCoreCreator = false, ipfs = '', ipfsUrl = '', @@ -249,16 +249,10 @@ const ProposalInformation = ({ >

Information

- {strategies.map((st, index) => { - return ( -
- -
- ); - })} +
{strategyName}
} /> diff --git a/frontend/packages/client/src/components/StrategyModal.js b/frontend/packages/client/src/components/StrategyModal.js index 15f505f90..f35fe8edd 100644 --- a/frontend/packages/client/src/components/StrategyModal.js +++ b/frontend/packages/client/src/components/StrategyModal.js @@ -1,6 +1,6 @@ import React from 'react'; -const StrategyModal = ({ isOpen, closeModal, strategies }) => { +const StrategyModal = ({ isOpen, closeModal, strategy }) => { return (
@@ -13,7 +13,7 @@ const StrategyModal = ({ isOpen, closeModal, strategies }) => { >
-

Strategies

+

Strategy

{
- {strategies.map((strategy, index) => { - return ( -
-
-

{strategy.name}

-

- {strategy.description} -

-
-
- ); - })} +
+
+

{strategy?.name}

+

+ {strategy?.description} +

+
+