From f5a5df2a2466baf4735e80183d65b7d56ea08a45 Mon Sep 17 00:00:00 2001 From: "Samuel T." Date: Tue, 19 Nov 2024 16:14:30 -0500 Subject: [PATCH 1/8] Possibly fix weather images in prod (#293) --- canopeum_frontend/.eslintrc.cjs | 2 +- canopeum_frontend/package-lock.json | 26 -------------- canopeum_frontend/package.json | 1 - .../src/constants/weatherImageMap.ts | 36 +++++++++---------- 4 files changed, 19 insertions(+), 46 deletions(-) diff --git a/canopeum_frontend/.eslintrc.cjs b/canopeum_frontend/.eslintrc.cjs index 73d03d6fd..abbf7d4b8 100644 --- a/canopeum_frontend/.eslintrc.cjs +++ b/canopeum_frontend/.eslintrc.cjs @@ -49,8 +49,8 @@ module.exports = { ['^'], // Relative imports. // Anything that starts with a dot or src/ - // KEEP IN SYNC WITH canopeum_frontend/tsconfig.json AND canopeum_frontend/vite.config.ts [ + // KEEP IN SYNC WITH canopeum_frontend/tsconfig.json & canopeum_frontend/vite.config.ts '^(\\.' + '|src/' + '|@assets' diff --git a/canopeum_frontend/package-lock.json b/canopeum_frontend/package-lock.json index ba7b38abe..377f9dc84 100644 --- a/canopeum_frontend/package-lock.json +++ b/canopeum_frontend/package-lock.json @@ -44,7 +44,6 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-prefer-function-component": "^3.3.0", "eslint-plugin-react-refresh": "^0.4.5", - "readonly-types": "^4.5.0", "sass": "1.77.6", "typescript": "~5.5.4", "vite": "^5.4.6" @@ -12774,16 +12773,6 @@ "url": "https://github.com/sponsors/jonschlinkert" } }, - "node_modules/readonly-types": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/readonly-types/-/readonly-types-4.5.0.tgz", - "integrity": "sha512-Nv6cZ3vU21wktHKen8Tzh0ekBJyDAekI+oSejSEVJdSaIKLXZsSSrrTXGce0tpq3DezgSHrQo6xgEvMib7a91g==", - "dev": true, - "license": "MIT", - "dependencies": { - "ts-essentials": "^9.3.0" - } - }, "node_modules/refa": { "version": "0.12.1", "resolved": "https://registry.npmjs.org/refa/-/refa-0.12.1.tgz", @@ -14145,21 +14134,6 @@ "node": ">=6.10" } }, - "node_modules/ts-essentials": { - "version": "9.4.2", - "resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-9.4.2.tgz", - "integrity": "sha512-mB/cDhOvD7pg3YCLk2rOtejHjjdSi9in/IBYE13S+8WA5FBSraYf4V/ws55uvs0IvQ/l0wBOlXy5yBNZ9Bl8ZQ==", - "dev": true, - "license": "MIT", - "peerDependencies": { - "typescript": ">=4.1.0" - }, - "peerDependenciesMeta": { - "typescript": { - "optional": true - } - } - }, "node_modules/tsconfig-paths": { "version": "3.15.0", "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz", diff --git a/canopeum_frontend/package.json b/canopeum_frontend/package.json index 2fa79db44..af7cb739e 100644 --- a/canopeum_frontend/package.json +++ b/canopeum_frontend/package.json @@ -53,7 +53,6 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-prefer-function-component": "^3.3.0", "eslint-plugin-react-refresh": "^0.4.5", - "readonly-types": "^4.5.0", "sass": "1.77.6", "typescript": "~5.5.4", "vite": "^5.4.6" diff --git a/canopeum_frontend/src/constants/weatherImageMap.ts b/canopeum_frontend/src/constants/weatherImageMap.ts index 6adaf3cfc..2bb1deccf 100644 --- a/canopeum_frontend/src/constants/weatherImageMap.ts +++ b/canopeum_frontend/src/constants/weatherImageMap.ts @@ -1,21 +1,26 @@ -import { type ReadonlyURL, readonlyURL } from 'readonly-types' +import cloudyURL from '@assets/images/weather/cloudy-bg.jpeg' +import foggyURL from '@assets/images/weather/foggy-bg.jpeg' +import rainyURL from '@assets/images/weather/rainy-bg.jpeg' +import snowyURL from '@assets/images/weather/snowy-bg.jpeg' +import sunnyURL from '@assets/images/weather/sunny-bg.jpeg' +import thunderstormURL from '@assets/images/weather/thunderstorm-bg.jpeg' type WMOCategoriesImageUrls = { - readonly imageUrl: ReadonlyURL | undefined, + readonly imageUrl: string | undefined, WMOCategories: string[], } const WMOCategoriesImages: WMOCategoriesImageUrls[] = [ { - imageUrl: readonlyURL('../assets/images/weather/sunny-bg.jpeg', import.meta.url), + imageUrl: sunnyURL, WMOCategories: ['Clear sky', 'Mainly clear'], }, { - imageUrl: readonlyURL('../assets/images/weather/cloudy-bg.jpeg', import.meta.url), + imageUrl: cloudyURL, WMOCategories: ['Partly cloudy', 'Overcast', 'Foggy', 'Depositing rime fog'], }, { - imageUrl: readonlyURL('../assets/images/weather/rainy-bg.jpeg', import.meta.url), + imageUrl: rainyURL, WMOCategories: [ 'Slight Rain', 'Moderate Rain', @@ -30,11 +35,11 @@ const WMOCategoriesImages: WMOCategoriesImageUrls[] = [ ], }, { - imageUrl: readonlyURL('../assets/images/weather/snowy-bg.jpeg', import.meta.url), + imageUrl: snowyURL, WMOCategories: ['Slight Snow fall', 'Moderate Snow fall', 'Heavy Snow fall', 'Snow grains'], }, { - imageUrl: readonlyURL('../assets/images/weather/foggy-bg.jpeg', import.meta.url), + imageUrl: foggyURL, WMOCategories: [ 'Light Drizzle', 'Moderate Drizzle', @@ -44,7 +49,7 @@ const WMOCategoriesImages: WMOCategoriesImageUrls[] = [ ], }, { - imageUrl: readonlyURL('../assets/images/weather/thunderstorm-bg.jpeg', import.meta.url), + imageUrl: thunderstormURL, WMOCategories: [ 'Thunderstorm with slight hail', 'Thunderstorm with hail', @@ -53,15 +58,10 @@ const WMOCategoriesImages: WMOCategoriesImageUrls[] = [ }, ] -const getImageNameByWMOCategories = (WMOCategory: string): string | undefined => { - const image = - WMOCategoriesImages.find(wmoCategoriesImage => - wmoCategoriesImage.WMOCategories.some(category => WMOCategory.includes(category)) - ) ?? undefined - - return image && image.imageUrl - ? image.imageUrl.href - : WMOCategoriesImages[0].imageUrl?.href -} +const getImageNameByWMOCategories = (WMOCategory: string) => + WMOCategoriesImages + .find(wmoCategoriesImage => wmoCategoriesImage.WMOCategories.includes(WMOCategory)) + ?.imageUrl + ?? WMOCategoriesImages[0].imageUrl export { getImageNameByWMOCategories } From 2de3a53a097ac8d9ade4d49205797425f886aafd Mon Sep 17 00:00:00 2001 From: "Samuel T." Date: Tue, 26 Nov 2024 14:21:57 -0500 Subject: [PATCH 2/8] Contact card links and empty infos (#296) --- .../src/components/social/ContactCard.tsx | 40 +++++++++++++------ 1 file changed, 28 insertions(+), 12 deletions(-) diff --git a/canopeum_frontend/src/components/social/ContactCard.tsx b/canopeum_frontend/src/components/social/ContactCard.tsx index 1c214dc6a..27c367931 100644 --- a/canopeum_frontend/src/components/social/ContactCard.tsx +++ b/canopeum_frontend/src/components/social/ContactCard.tsx @@ -18,6 +18,10 @@ type Props = { const ContactCard = ({ contact, viewMode, onEdit }: Props) => { const [isModalOpen, setIsModalOpen] = useState(false) + const googleMapQueryURL = contact.address + ? `https://www.google.com/maps/search/?api=1&query=${encodeURI(contact.address)}` + : '' + const renderContactCard = () => (
@@ -34,18 +38,30 @@ const ContactCard = ({ contact, viewMode, onEdit }: Props) => { )}
-
- home_work -

{contact.address}

-
-
- mail -

{contact.email}

-
-
- perm_phone_msg -

{contact.phone}

-
+ {contact.address && ( +
+ home_work + + {contact.address} + +
+ )} + {contact.email && ( +
+ mail + {contact.email} +
+ )} + {contact.phone && ( +
+ perm_phone_msg + {contact.phone} +
+ )}
{contact.linkedinLink && ( From 3ffe0cb11ae7d60f38206a7438205677d7ca1d1a Mon Sep 17 00:00:00 2001 From: "Samuel T." Date: Tue, 26 Nov 2024 14:23:12 -0500 Subject: [PATCH 3/8] Update batch tables to match design + make titles selectable (#295) --- .../src/assets/styles/GlobalStyles.scss | 5 ++-- .../src/components/social/PostComment.tsx | 2 +- canopeum_frontend/src/pages/Analytics.tsx | 30 +++++++++++-------- 3 files changed, 22 insertions(+), 15 deletions(-) diff --git a/canopeum_frontend/src/assets/styles/GlobalStyles.scss b/canopeum_frontend/src/assets/styles/GlobalStyles.scss index 7996c44cb..aa124bfcf 100644 --- a/canopeum_frontend/src/assets/styles/GlobalStyles.scss +++ b/canopeum_frontend/src/assets/styles/GlobalStyles.scss @@ -27,8 +27,9 @@ body { background-image: url('@assets/images/TreeBackground.png'); } -.text-small { - font-size: 90%; +// Named after https://getbootstrap.com/docs/5.2/utilities/text/#font-size +.fs-small { + font-size: 0.875rem; } .text-ellipsis { diff --git a/canopeum_frontend/src/components/social/PostComment.tsx b/canopeum_frontend/src/components/social/PostComment.tsx index 6112b9bb6..4052d4474 100644 --- a/canopeum_frontend/src/components/social/PostComment.tsx +++ b/canopeum_frontend/src/components/social/PostComment.tsx @@ -29,7 +29,7 @@ const PostComment = ({ comment, onDelete, siteId }: Props) => {
{comment.authorUsername} - + {formatDate(comment.createdAt, { dateStyle: 'short' })}
diff --git a/canopeum_frontend/src/pages/Analytics.tsx b/canopeum_frontend/src/pages/Analytics.tsx index 562a0254f..a618b09c6 100644 --- a/canopeum_frontend/src/pages/Analytics.tsx +++ b/canopeum_frontend/src/pages/Analytics.tsx @@ -142,29 +142,31 @@ const Analytics = () => { return (
-

- -

+
+
{
-
-
-
{translate('analytics.batch-tracking')}
+ { + // TODO: Implement batch search/filtering, in the mean time we show a simple title + /*
+
+

{translate('analytics.batch-tracking')}

TODO: Filters Go Here
-
+
*/ + } +

{translate('analytics.batch-tracking')}

{renderBatches()} From e92149e6f61cd5d6ea40385804c017229ce47734 Mon Sep 17 00:00:00 2001 From: "Samuel T." Date: Tue, 26 Nov 2024 14:24:04 -0500 Subject: [PATCH 4/8] Fix custom fields look (#297) --- .../src/components/inputs/EmailTextField.tsx | 5 ++-- .../src/components/inputs/PhoneTextField.tsx | 5 ++-- .../src/components/inputs/UrlTextField.tsx | 5 ++-- .../site-modal/SiteAnnouncementModal.tsx | 4 +--- .../social/site-modal/SiteContactModal.tsx | 24 +++++-------------- 5 files changed, 16 insertions(+), 27 deletions(-) diff --git a/canopeum_frontend/src/components/inputs/EmailTextField.tsx b/canopeum_frontend/src/components/inputs/EmailTextField.tsx index 73ba87325..502e0f40a 100644 --- a/canopeum_frontend/src/components/inputs/EmailTextField.tsx +++ b/canopeum_frontend/src/components/inputs/EmailTextField.tsx @@ -1,4 +1,4 @@ -import { type FC, type InputHTMLAttributes, useState } from 'react' +import { type InputHTMLAttributes, useState } from 'react' import { useTranslation } from 'react-i18next' import { isValidEmail } from '@utils/validators' @@ -10,7 +10,7 @@ type Props = { readonly isValid: (valid: boolean) => void, } -const EmailTextField: FC = props => { +const EmailTextField = (props: Props) => { const { t } = useTranslation() const [error, setError] = useState(null) @@ -31,6 +31,7 @@ const EmailTextField: FC = props => { {/* eslint-disable react/jsx-props-no-spreading -- Needed for custom input */} handleChange(event.target.value)} type='email' value={props.value} diff --git a/canopeum_frontend/src/components/inputs/PhoneTextField.tsx b/canopeum_frontend/src/components/inputs/PhoneTextField.tsx index a6437287d..cda19153e 100644 --- a/canopeum_frontend/src/components/inputs/PhoneTextField.tsx +++ b/canopeum_frontend/src/components/inputs/PhoneTextField.tsx @@ -1,4 +1,4 @@ -import { type FC, type InputHTMLAttributes, useState } from 'react' +import { type InputHTMLAttributes, useState } from 'react' import { useTranslation } from 'react-i18next' import { isValidPhone } from '@utils/validators' @@ -10,7 +10,7 @@ type Props = { readonly isValid: (valid: boolean) => void, } -const PhoneTextField: FC = props => { +const PhoneTextField = (props: Props) => { const { t } = useTranslation() const [error, setError] = useState(null) @@ -31,6 +31,7 @@ const PhoneTextField: FC = props => { {/* eslint-disable react/jsx-props-no-spreading -- Needed for custom input */} handleChange(event.target.value)} type='tel' value={props.value} diff --git a/canopeum_frontend/src/components/inputs/UrlTextField.tsx b/canopeum_frontend/src/components/inputs/UrlTextField.tsx index 378a31212..8d1a3eb7d 100644 --- a/canopeum_frontend/src/components/inputs/UrlTextField.tsx +++ b/canopeum_frontend/src/components/inputs/UrlTextField.tsx @@ -1,4 +1,4 @@ -import { type FC, type InputHTMLAttributes, useState } from 'react' +import { type InputHTMLAttributes, useState } from 'react' import { useTranslation } from 'react-i18next' import { isValidUrl } from '@utils/validators' @@ -10,7 +10,7 @@ type Props = { readonly isValid: (valid: boolean) => void, } -const UrlTextField: FC = props => { +const UrlTextField = (props: Props) => { const { t } = useTranslation() const [error, setError] = useState(null) @@ -31,6 +31,7 @@ const UrlTextField: FC = props => { {/* eslint-disable react/jsx-props-no-spreading -- Needed for custom input */} handleChange(event.target.value)} type='url' value={props.value} diff --git a/canopeum_frontend/src/components/social/site-modal/SiteAnnouncementModal.tsx b/canopeum_frontend/src/components/social/site-modal/SiteAnnouncementModal.tsx index 403b95fde..076fc9150 100644 --- a/canopeum_frontend/src/components/social/site-modal/SiteAnnouncementModal.tsx +++ b/canopeum_frontend/src/components/social/site-modal/SiteAnnouncementModal.tsx @@ -71,9 +71,7 @@ const SiteAnnouncementModal = ({ announcement, isOpen, handleClose }: Props) => {t('social.announcement.link')} setIsFormValid(value)} onChange={eventValue => setEditedAnnouncement(value => ({ ...value, link: eventValue }))} diff --git a/canopeum_frontend/src/components/social/site-modal/SiteContactModal.tsx b/canopeum_frontend/src/components/social/site-modal/SiteContactModal.tsx index e0c68f010..8a458e424 100644 --- a/canopeum_frontend/src/components/social/site-modal/SiteContactModal.tsx +++ b/canopeum_frontend/src/components/social/site-modal/SiteContactModal.tsx @@ -76,9 +76,7 @@ const SiteContactModal = ({ contact, isOpen, handleClose }: Props) => { {t('social.contact.email')} setIsFormValid(value)} onChange={eventValue => setEditedContact(value => ({ ...value, email: eventValue }))} @@ -90,9 +88,7 @@ const SiteContactModal = ({ contact, isOpen, handleClose }: Props) => { {t('social.contact.phone')} setIsFormValid(value)} onChange={eventValue => setEditedContact(value => ({ ...value, phone: eventValue }))} @@ -102,9 +98,7 @@ const SiteContactModal = ({ contact, isOpen, handleClose }: Props) => {
facebook-logo setIsFormValid(value)} onChange={eventValue => setEditedContact(value => ({ ...value, facebookLink: eventValue }))} @@ -114,9 +108,7 @@ const SiteContactModal = ({ contact, isOpen, handleClose }: Props) => {
x-logo setIsFormValid(value)} onChange={eventValue => setEditedContact(value => ({ ...value, xLink: eventValue }))} @@ -126,9 +118,7 @@ const SiteContactModal = ({ contact, isOpen, handleClose }: Props) => {
instagram-logo setIsFormValid(value)} onChange={eventValue => setEditedContact(value => ({ ...value, instagramLink: eventValue }))} @@ -138,9 +128,7 @@ const SiteContactModal = ({ contact, isOpen, handleClose }: Props) => {
linkedin-logo setIsFormValid(value)} onChange={eventValue => setEditedContact(value => ({ ...value, linkedinLink: eventValue }))} From c7f9df47fbce632886f56aca1aee1412a1cdfce8 Mon Sep 17 00:00:00 2001 From: "Samuel T." Date: Tue, 26 Nov 2024 14:25:21 -0500 Subject: [PATCH 5/8] Simplify and standardize dialogs (#299) --- .../src/assets/styles/muiCustomTheme.ts | 16 +++ .../analytics/AnalyticsSiteHeader.tsx | 7 +- .../src/components/analytics/BatchActions.tsx | 5 +- .../batch-modal/CreateBatchModal.tsx | 8 +- .../analytics/batch-modal/EditBatchModal.tsx | 8 +- .../analytics/site-modal/SiteModal.tsx | 14 +-- .../components/dialogs/ConfirmationDialog.tsx | 2 +- .../settings/AdminInvitationDialog.tsx | 105 ++++++++---------- .../components/social/PostCommentsDialog.tsx | 2 +- .../src/components/social/SharePostDialog.tsx | 2 +- .../src/components/social/WidgetDialog.tsx | 2 +- .../site-modal/SiteAnnouncementModal.tsx | 2 +- .../social/site-modal/SiteContactModal.tsx | 2 +- 13 files changed, 80 insertions(+), 95 deletions(-) diff --git a/canopeum_frontend/src/assets/styles/muiCustomTheme.ts b/canopeum_frontend/src/assets/styles/muiCustomTheme.ts index b01d9ce76..5704ebeb0 100644 --- a/canopeum_frontend/src/assets/styles/muiCustomTheme.ts +++ b/canopeum_frontend/src/assets/styles/muiCustomTheme.ts @@ -21,6 +21,22 @@ const muiCustomTheme = createTheme({ paper: variables.cardBackground, }, }, + components: { + MuiDialogActions: { + styleOverrides: { + spacing: { + justifyContent: 'space-around', + }, + }, + }, + MuiDialogTitle: { + styleOverrides: { + root: { + textAlign: 'center', + }, + }, + }, + }, }) export default muiCustomTheme diff --git a/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx b/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx index 816fdf437..0c236d39c 100644 --- a/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx +++ b/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx @@ -59,10 +59,7 @@ const AnalyticsSiteHeader = ({ siteSummary }: Props) => {
-
+
{
group {translate('analyticsSite.sponsors')}: diff --git a/canopeum_frontend/src/components/analytics/BatchActions.tsx b/canopeum_frontend/src/components/analytics/BatchActions.tsx index e7eaf5b0e..4306db095 100644 --- a/canopeum_frontend/src/components/analytics/BatchActions.tsx +++ b/canopeum_frontend/src/components/analytics/BatchActions.tsx @@ -69,10 +69,7 @@ const BatchActions = ({ onEdit, onDelete, batchDetail }: Props) => { className='bg-lightgreen text-center rounded-circle unstyled-button' type='button' > - + more_horiz diff --git a/canopeum_frontend/src/components/analytics/batch-modal/CreateBatchModal.tsx b/canopeum_frontend/src/components/analytics/batch-modal/CreateBatchModal.tsx index 461d9ec4f..757c8a827 100644 --- a/canopeum_frontend/src/components/analytics/batch-modal/CreateBatchModal.tsx +++ b/canopeum_frontend/src/components/analytics/batch-modal/CreateBatchModal.tsx @@ -89,13 +89,9 @@ const CreateBatchModal = ({ open, site, handleClose }: Props) => { return ( - -
- {t('analyticsSite.batch-modal.create-title')} -
- + {t('analyticsSite.batch-modal.create-title')} - + diff --git a/canopeum_frontend/src/components/analytics/batch-modal/EditBatchModal.tsx b/canopeum_frontend/src/components/analytics/batch-modal/EditBatchModal.tsx index c435c26cb..a1223ec51 100644 --- a/canopeum_frontend/src/components/analytics/batch-modal/EditBatchModal.tsx +++ b/canopeum_frontend/src/components/analytics/batch-modal/EditBatchModal.tsx @@ -82,13 +82,9 @@ const BatchModal = ({ batchToEdit, handleClose }: Props) => { return ( - -
- {t('analyticsSite.batch-modal.edit-title')} -
- + {t('analyticsSite.batch-modal.edit-title')} - + { return ( handleClose(reason)} open={open}> -
- {t( - siteId - ? 'analytics.edit-site-info' - : 'analytics.create-site', - )} -
+ {t( + siteId + ? 'analytics.edit-site-info' + : 'analytics.create-site', + )} - +