From 970ca1f5aac3f497fe4275a5938537b5ed460d23 Mon Sep 17 00:00:00 2001 From: Hannah Zulueta Date: Wed, 24 Jul 2024 20:07:44 -0700 Subject: [PATCH] Normalize social media links --- client/package-lock.json | 18 +- client/package.json | 2 +- .../StakeholderDetails/StakeholderDetails.js | 221 ++++++++++++------ client/src/images/facebookIcon.png | Bin 674 -> 0 bytes client/src/images/instagramIcon.png | Bin 686 -> 0 bytes 5 files changed, 164 insertions(+), 77 deletions(-) delete mode 100644 client/src/images/facebookIcon.png delete mode 100644 client/src/images/instagramIcon.png diff --git a/client/package-lock.json b/client/package-lock.json index fc2cb1e2f..de2816ad5 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -13,7 +13,7 @@ "@emotion/react": "^11.10.5", "@emotion/styled": "^11.10.5", "@mapbox/geo-viewport": "^0.4.1", - "@mui/icons-material": "^5.11.0", + "@mui/icons-material": "^5.16.4", "@mui/lab": "^5.0.0-alpha.113", "@mui/material": "^5.11.1", "@mui/x-data-grid": "^5.17.20", @@ -1820,9 +1820,9 @@ "integrity": "sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA==" }, "node_modules/@babel/runtime": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.22.10.tgz", - "integrity": "sha512-21t/fkKLMZI4pqP2wlmsQAWnYW1PDyKyyUV4vCi+B25ydmdaYTKXPwCj0BzSUnZf4seIiYvSA3jcZ3gdsMFkLQ==", + "version": "7.24.8", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.8.tgz", + "integrity": "sha512-5F7SDGs1T72ZczbRwbGO9lQi0NLjQxzl6i4lJxLxfW9U5UluCSyEJeniWvnhl3/euNiqQVbo8zruhsDfid0esA==", "dependencies": { "regenerator-runtime": "^0.14.0" }, @@ -3295,18 +3295,18 @@ } }, "node_modules/@mui/icons-material": { - "version": "5.11.11", - "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.11.11.tgz", - "integrity": "sha512-Eell3ADmQVE8HOpt/LZ3zIma8JSvPh3XgnhwZLT0k5HRqZcd6F/QDHc7xsWtgz09t+UEFvOYJXjtrwKmLdwwpw==", + "version": "5.16.4", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.16.4.tgz", + "integrity": "sha512-j9/CWctv6TH6Dou2uR2EH7UOgu79CW/YcozxCYVLJ7l03pCsiOlJ5sBArnWJxJ+nGkFwyL/1d1k8JEPMDR125A==", "dependencies": { - "@babel/runtime": "^7.21.0" + "@babel/runtime": "^7.23.9" }, "engines": { "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/mui" + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { "@mui/material": "^5.0.0", diff --git a/client/package.json b/client/package.json index ea08ea2e9..66f3227ae 100644 --- a/client/package.json +++ b/client/package.json @@ -20,7 +20,7 @@ "@emotion/react": "^11.10.5", "@emotion/styled": "^11.10.5", "@mapbox/geo-viewport": "^0.4.1", - "@mui/icons-material": "^5.11.0", + "@mui/icons-material": "^5.16.4", "@mui/lab": "^5.0.0-alpha.113", "@mui/material": "^5.11.1", "@mui/x-data-grid": "^5.17.20", diff --git a/client/src/components/FoodSeeker/SearchResults/StakeholderDetails/StakeholderDetails.js b/client/src/components/FoodSeeker/SearchResults/StakeholderDetails/StakeholderDetails.js index 2ad8396ff..24e24286d 100644 --- a/client/src/components/FoodSeeker/SearchResults/StakeholderDetails/StakeholderDetails.js +++ b/client/src/components/FoodSeeker/SearchResults/StakeholderDetails/StakeholderDetails.js @@ -26,8 +26,6 @@ import { calculateMinutesToClosing, calculateMinutesToOpening, } from "helpers"; -import facebookIcon from "images/facebookIcon.png"; -import instagramIcon from "images/instagramIcon.png"; import StakeholderIcon from "images/stakeholderIcon"; import ForkIcon from "icons/ForkIcon"; import AppleIcon from "icons/AppleIcon"; @@ -50,6 +48,12 @@ import { useSiteContext } from "contexts/siteContext"; import Grid2 from "@mui/material/Unstable_Grid2/Grid2"; import { stakeholdersDaysHours } from "../StakeholderPreview/StakeholderPreview"; import { success } from "../../../../theme/palette"; +import InstagramIcon from "@mui/icons-material/Instagram"; +import FacebookIcon from "@mui/icons-material/Facebook"; +import LinkedInIcon from "@mui/icons-material/LinkedIn"; +import XIcon from "@mui/icons-material/X"; +import PinterestIcon from "@mui/icons-material/Pinterest"; +import IconButton from "@mui/material/IconButton"; const MinorHeading = styled(Typography)(({ theme }) => ({ variant: "h5", @@ -290,12 +294,12 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { fontSize: { xs: "14px", md: "18px" }, color: { md: theme.palette.common.gray, xs: "#747476" }, textTransform: "none", - fontWeight: "bold", + fontWeight: "bold", "&:focus": { borderWidth: "2px", borderColor: theme.palette.primary.dark, borderStyle: "solid", - dropShadow: "10px 10px 12px", + dropShadow: "10px 10px 12px", }, })} onClick={handleBackButtonClick} @@ -393,21 +397,21 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { {selectedOrganization.inactiveTemporary || - selectedOrganization.inactive ? ( - - ) : null} + (selectedOrganization.inactive && ( + + ))} {!( selectedOrganization.inactiveTemporary || @@ -495,7 +499,7 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { )} - {selectedOrganization.hours ? ( + {selectedOrganization.hours && ( {selectedOrganization.hours @@ -536,9 +540,9 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { ))} - ) : null} + )} - {selectedOrganization.foodTypes ? ( + {selectedOrganization.foodTypes && ( { {selectedOrganization.foodTypes} - ) : ( - "" )} { No E-Mail Address on record )} - {selectedOrganization.website ? ( + {selectedOrganization.website && ( <> Website @@ -642,7 +644,7 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { - ) : null} + )} Languages {selectedOrganization.languages ? ( @@ -673,7 +675,7 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { No covid notes to display. )} - {selectedOrganization.hoursNotes ? ( + {selectedOrganization.hoursNotes && ( <> Hour Notes { }} > - ) : null} + )} - {selectedOrganization.services ? ( + {selectedOrganization.services && ( <> Services {selectedOrganization.services} - ) : null} + )} - {selectedOrganization.items ? ( + {selectedOrganization.items && ( <> Items Available {selectedOrganization.items} - ) : null} - - {selectedOrganization.facebook || - selectedOrganization.instagram ? ( - <> - Social Media - - {selectedOrganization.facebook ? ( - - facebook link - - ) : null} - {selectedOrganization.instagram ? ( - - instagram link - - ) : null} - - - ) : null} + )} + {hasAnySocialMediaUrl(selectedOrganization) && ( + + )} Eligibility/Requirements {selectedOrganization.requirements ? ( @@ -758,7 +730,7 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { {selectedOrganization.verificationStatusId === - VERIFICATION_STATUS.VERIFIED ? ( + VERIFICATION_STATUS.VERIFIED && ( Data updated on{" "} {selectedOrganization.approvedDate @@ -767,7 +739,7 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { ? formatDateMMMddYYYY(selectedOrganization.modifiedDate) : formatDateMMMddYYYY(selectedOrganization.createdDate)} - ) : null} + )} @@ -778,3 +750,118 @@ const StakeholderDetails = ({ onBackClick, isDesktop }) => { }; export default StakeholderDetails; + +function hasAnySocialMediaUrl(organization) { + return Boolean( + organization.facebook || + organization.instagram || + organization.linkedin || + organization.pinterest || + organization.twitter + ); +} + +function normalizeSocialLink({ value, socialMedia }) { + if ( + value === "N/A" || + value === "n/a" || + value === "n / a" || + value === "N / A" + ) { + return null; + } + + if (value.startsWith("http")) { + return value; + } + + let handle = value; + if (value.startsWith("@")) { + handle = value.replace("@", ""); + } + + // this might not be always correct, for linkedin sometimes it has /company/, for facebook sometimes it has /page/ + // but our goal is to have full urls in our db + return `https://${socialMedia}.com/${handle}`; +} + +function SocialMedia({ selectedOrganization }) { + const instagram = normalizeSocialLink({ + value: selectedOrganization.instagram, + socialMedia: "instagram", + }); + const facebook = normalizeSocialLink({ + value: selectedOrganization.facebook, + socialMedia: "facebook", + }); + const linkedin = normalizeSocialLink({ + value: selectedOrganization.linkedin, + socialMedia: "linkedin", + }); + const pinterest = normalizeSocialLink({ + value: selectedOrganization.pinterest, + socialMedia: "pinterest", + }); + const twitter = normalizeSocialLink({ + value: selectedOrganization.twitter, + socialMedia: "x", + }); + + return ( + <> + Social Media + + {facebook && ( + + + + )} + {instagram && ( + + + + )} + {linkedin && ( + + + + )} + {pinterest && ( + + + + )} + {twitter && ( + + + + )} + + + ); +} \ No newline at end of file diff --git a/client/src/images/facebookIcon.png b/client/src/images/facebookIcon.png deleted file mode 100644 index 5ca675812c7bb0730dc9b6f92678ca815029d75a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 674 zcmV;T0$u%yP)9(cv4Q8w5^(a{`+aB%FY70+cQ@K(sjlqCxHu0|kjk z`|@^WC$_AOmDt~mM!Wmoe&722tc-96JTG*F`1h8O_JPO+KzC}&0YMVc38+V(r94Y* z99U2M!o{u05fFsX08DbM)b?SW&{lOJ2=*et;u8;_L34PBD(ZB*m*XruvkC;k^8o=3 zdDw>gqm6*CcDhe7%YMa60$vbA{2Df4;@GDg7|BC^Q;vw8Idj-~vXhR-*@d2%9GIAk zNy0;C1v8UUlqAW;{IVDHj+iK#Tgpjo`#L8=&xDw~Z$O?Bsh3r93!Et@;PmuAR_!1K zk(A#*&ade*hW394FDFBeMSpou@wf%z>b0d>D<~FD9t6D+!QTV80{eC$-Uv=m9~yxD ze#6blJ%<1eR_-C}3vMP4?hmJt7m_O)J3k0$1neLc^5g1|SaF>Dwd9{r2UyNF1< zgH3}9!)XMh{3=P&#zdHFU`lx=P>P(7v;o#cNq&Afn=dq)HmoC3C0`P_6)ARs?A^IU ztc!%ZzDlmqs@pJ)->&cb``il=*8ICLpH0LVNgc~1IRy)@0lO&<&KZi0DF6Tf07*qo IM6N<$f^V!J0ssI2 diff --git a/client/src/images/instagramIcon.png b/client/src/images/instagramIcon.png deleted file mode 100644 index 3074ef1deb7deebdc6211f0d15ea3ac721e25b47..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 686 zcmV;f0#W^mP)nut-r$7EOgf7$ol~aEBS4uhq)Jl7egpdn0#AVGn6Z)W4Wd*iRme;V z|BP?FD-a_yKH1pt&4BKAzrDTP?+{ARI;<)6zeh;>K;#2pjfZP+FDM1Xl!yjkpAU_h zq{R#tjaIAOBcRU@Ggu7-{1V4!eQA43<9#;%m76bMI|%EI#=mSfo1oTjeN}p_o8IP>XD- za*z0^)MpRT~igjpJjP~X~%