Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mastodon and bluesky to user profiles #1696

Merged
merged 12 commits into from
Feb 12, 2025
Merged

Mastodon and bluesky to user profiles #1696

Show file tree
Hide file tree
Changes from 11 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
61b787e
undo main commit
aaerhart Jan 14, 2025
6d208cd
Merge branch 'main' of https://github.com/codeforboston/maple
aaerhart Jan 18, 2025
f2a9380
feat: mastodon and bluesky to user profiles
aaerhart Feb 5, 2025
b29ef18
fix: run linter
aaerhart Feb 5, 2025
45cb593
Delete components/bill/service.tsx
aaerhart Feb 5, 2025
b61f40b
Delete components/bill/redux.ts
aaerhart Feb 5, 2025
0932959
fix: initialize bluesky and mastodon in profile state reducer
aaerhart Feb 5, 2025
4d97d73
Merge branch 'mastodon-and-bluesky-to-user-profiles' of https://githu…
aaerhart Feb 5, 2025
ab7673f
fix: bluesky icon size
aaerhart Feb 5, 2025
89a315d
fix: bluesky link
aaerhart Feb 5, 2025
05400b2
fix: mastodon link formatting
aaerhart Feb 5, 2025
5c01355
fix: image file location and urlcleanup
aaerhart Feb 12, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 32 additions & 0 deletions components/EditProfilePage/PersonalInfoTab.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ type UpdateProfileData = {
linkedIn: string
instagram: string
fb: string
blueSky: string
mastodon: string
publicEmail: string
publicPhone: number
website: string
Expand Down Expand Up @@ -54,6 +56,8 @@ async function updateProfile(
await updateSocial("linkedIn", data.linkedIn)
await updateSocial("twitter", data.twitter)
await updateSocial("instagram", data.instagram)
await updateSocial("blueSky", data.blueSky)
await updateSocial("mastodon", data.mastodon)
await updateSocial("fb", data.fb)
await updateAbout(data.aboutYou)
await updateFullName(data.fullName)
Expand Down Expand Up @@ -171,6 +175,20 @@ export function PersonalInfoTab({
iconSrc="./linkedin.svg"
{...register("linkedIn")}
/>
<SocialInput
label={t("socialLinks.blueSky")}
defaultValue={social?.blueSky}
className="col-sm-12 col-md-6 mb-1"
iconSrc="./bluesky.svg"
{...register("blueSky")}
/>
<SocialInput
label={t("socialLinks.mastodon")}
defaultValue={social?.mastodon}
className="col-sm-12 col-md-6 mb-1"
iconSrc="./mastodon.svg"
{...register("mastodon")}
/>
{isOrg && (
<>
<SocialInput
Expand All @@ -187,6 +205,20 @@ export function PersonalInfoTab({
iconSrc="./facebook.svg"
{...register("fb")}
/>
<SocialInput
label={t("socialLinks.bluesky")}
defaultValue={social?.blueSky}
className="col-sm-12 col-md-6 mb-1"
iconSrc="./bluesky.svg"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the images issue here is related to the path:

  • We currently have two images each for Facebook/Twitter/LinkedIn, one at public/facebook.svg and another at public/images/facebook.svg.
  • The root of the image path for these components is public/, so these components are trying to get public/bluesky.svg when we only added public/images/bluesky.svg in the PR.
  • This will still work for Facebook/Twitter/etc. because they also have an image under just public/, so it seems inconsistent
  • To make this load consistently, we should just move the bluesky.svg/mastodon.svg out of public/images/ to public/

{...register("blueSky")}
/>
<SocialInput
label={t("socialLinks.mastodon")}
defaultValue={social?.mastodon}
className="col-sm-12 col-md-6 mb-1"
iconSrc="./mastodon.svg"
{...register("mastodon")}
/>
</>
)}
</div>
Expand Down
16 changes: 13 additions & 3 deletions components/ProfilePage/ProfileAboutSection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,17 @@ export const ProfileAboutSection = ({
twitter,
linkedIn,
instagram,
fb
}: { twitter?: string; linkedIn?: string; instagram?: string; fb?: string } =
profile?.social ?? {}
fb,
blueSky,
mastodon
}: {
twitter?: string
linkedIn?: string
instagram?: string
fb?: string
blueSky?: string
mastodon?: string
} = profile?.social ?? {}
const { t } = useTranslation("profile")
const title = isOrg
? t("aboutUs")
Expand All @@ -37,6 +45,8 @@ export const ProfileAboutSection = ({
linkedIn={linkedIn}
instagram={instagram}
fb={fb}
blueSky={blueSky}
mastodon={mastodon}
/>
) : (
<></>
Expand Down
22 changes: 21 additions & 1 deletion components/ProfilePage/SocialMediaIcons.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,16 @@ export const SocialMediaIcons = ({
twitter,
linkedIn,
instagram,
fb
fb,
blueSky,
mastodon
}: {
twitter?: string
instagram?: string
fb?: string
linkedIn?: string
blueSky?: string
mastodon?: string
}) => {
const { t } = useTranslation("common")

Expand Down Expand Up @@ -49,6 +53,22 @@ export const SocialMediaIcons = ({
</External>
</Col>
)}

{blueSky && (
<Col>
<External plain href={`https://bsky.app.profile/${blueSky}`}>
<Image alt={t("socials.bluesky")} src="/bluesky.svg" />
</External>
</Col>
)}

{mastodon && (
<Col>
<External plain href={`https://mastodon.social/@${mastodon}`}>
<Image alt={t("socials.mastodon")} src="/mastodon.svg" />
</External>
</Col>
)}
</Row>
</div>
)
Expand Down
4 changes: 3 additions & 1 deletion components/db/profile/profile.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,9 @@ export function useProfile() {
linkedIn: false,
twitter: false,
instagram: false,
fb: false
fb: false,
blueSky: false,
mastodon: false
},
updatingBillsFollowing: false,
profile
Expand Down
4 changes: 3 additions & 1 deletion components/db/profile/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,9 @@ export const SOCIAL_NETWORKS = [
"linkedIn",
"twitter",
"instagram",
"fb"
"fb",
"blueSky",
"mastodon"
] as const

export type SocialLinks = Partial<
Expand Down
9 changes: 9 additions & 0 deletions components/db/profile/urlCleanup.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,15 @@ export function cleanSocialLinks(network: keyof SocialLinks, link: string) {
const index: number = path.indexOf(".com/") + 5
path = path.substring(index)
}
if (
network === "mastodon" &&
path.substring(path.indexOf("@") + 1).charAt(0) === "@"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: This might be a bit easier to read as:

if (network === "mastodon" && path.startsWith("@")) {
  path = path.substring(1)
}

) {
path.replace(
path.substring(path.indexOf("@") + 1),
path.substring(path.indexOf("@") + 2)
)
}
}

return path
Expand Down
1 change: 1 addition & 0 deletions public/images/bluesky.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions public/images/mastodon.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 3 additions & 1 deletion public/locales/en/common.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,9 @@
"instagram": "Instagram",
"linkedin": "LinkedIn",
"twitter": "Twitter",
"facebook": "Facebook"
"facebook": "Facebook",
"bluesky": "BlueSky",
"mastodon": "Mastodon"
},
"table": {
"page": "Page {{currentPage}}"
Expand Down
4 changes: 3 additions & 1 deletion public/locales/en/editProfile.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,9 @@
"twitter": "Twitter Username",
"linkedIn": "LinkedIn Url",
"instagram": "Instagram Username",
"facebook": "Facebook Link"
"facebook": "Facebook Link",
"blueSky": "BlueSky Link",
"mastodon": "Mastodon Link"
},
"contact": {
"contactInfo": "Contact Information",
Expand Down
Loading