diff --git a/components/molecules/ContributorProfileInfo/contributor-profile-info.tsx b/components/molecules/ContributorProfileInfo/contributor-profile-info.tsx index b036fc92d..a939d526f 100644 --- a/components/molecules/ContributorProfileInfo/contributor-profile-info.tsx +++ b/components/molecules/ContributorProfileInfo/contributor-profile-info.tsx @@ -8,6 +8,7 @@ import { HiOutlineMail } from "react-icons/hi"; import LanguagePill from "components/atoms/LanguagePill/LanguagePill"; import Title from "components/atoms/Typography/title"; import Badge from "components/atoms/Badge/badge"; +import { getTimezone } from "lib/utils/timezones"; interface ContributorProfileInfoProps { githubName: string; @@ -16,6 +17,8 @@ interface ContributorProfileInfoProps { twitterUsername?: string; interests?: string; isConnected?: boolean; + timezone?: string; + displayLocalTime?: boolean; } const ContributorProfileInfo = ({ @@ -23,7 +26,9 @@ const ContributorProfileInfo = ({ twitterUsername, bio, interests, - isConnected + isConnected, + timezone, + displayLocalTime }: ContributorProfileInfoProps) => { const interestArray = interests?.split(","); @@ -43,7 +48,7 @@ const ContributorProfileInfo = ({ <> - UTC +1 + {timezone ? `UTC${getTimezone(timezone)}` : "UTC+1"} @@ -64,16 +69,16 @@ const ContributorProfileInfo = ({ "I am an open source developer with a passion for music and video games. I strive to improve the open source community and am always looking for new ways to contribute."}

- + {displayLocalTime && Local time: 12:32 PM - + } - + {twitterUsername && - - coming soon... + + {twitterUsername} - + } {/* diff --git a/components/organisms/ContributorProfilePage/contributor-profile-page.tsx b/components/organisms/ContributorProfilePage/contributor-profile-page.tsx index 1f49d6457..4938efb7d 100644 --- a/components/organisms/ContributorProfilePage/contributor-profile-page.tsx +++ b/components/organisms/ContributorProfilePage/contributor-profile-page.tsx @@ -75,7 +75,7 @@ const ContributorProfilePage = ({ const isLoaded = !loading && !error; // eslint-disable-next-line camelcase - const { bio, location, interests, name, twitter_username } = user || {}; + const { bio, location, interests, name, twitter_username, timezone, display_local_time: displayLocalTime } = user || {}; return (
@@ -93,6 +93,8 @@ const ContributorProfilePage = ({ bio={bio} githubName={githubName} isConnected={!!user} + timezone={timezone} + displayLocalTime={displayLocalTime} />
diff --git a/components/organisms/UserSettingsPage/user-settings-page.tsx b/components/organisms/UserSettingsPage/user-settings-page.tsx index 69f6a9b9f..f5bb70872 100644 --- a/components/organisms/UserSettingsPage/user-settings-page.tsx +++ b/components/organisms/UserSettingsPage/user-settings-page.tsx @@ -30,6 +30,8 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => { const { data: insightsUser } = useFetchUser(user?.user_metadata.user_name); const [isValidEmail, setIsValidEmail] = useState(true); + const [displayLocalTime, setDisplayLocalTime] = useState(false); + const [timezone, setTimezone] = useState(""); const [userInfo, setUserInfo] = useState(); const [email, setEmail] = useState(userInfo?.email || user?.email); const [emailPreference, setEmailPreference] = useState({ @@ -55,7 +57,9 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => { // eslint-disable-next-line camelcase receive_collaboration: insightsUser?.receive_collaboration }); - setSelectedInterest(insightsUser?.interests.split(",")); + setSelectedInterest(insightsUser?.interests?.split(",")); + setDisplayLocalTime(insightsUser?.display_local_time); + setTimezone(insightsUser?.timezone); } fetchAuthSession(); }, [user, insightsUser]); @@ -88,10 +92,17 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => { ToastTrigger({ message: "An error occured!!!", type: "error" }); } }; + const handleUpdateProfile = async () => { const data = await updateUser({ - data: { email } + data: { + email, + // eslint-disable-next-line camelcase + display_local_time: displayLocalTime, + timezone + } }); + if (data) { ToastTrigger({ message: "Updated successfully", type: "success" }); } else { @@ -145,20 +156,20 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => {
{ placeholder="USA" label="Location" disabled - value={userInfo?.location || "Canada"} + value={userInfo?.location || "California"} />
- + setDisplayLocalTime(e.target.checked)} + /> Other users will see the time difference from their local time.
- setTimezone(e.target.value)}> Select time zone {timezones.map((timezone, index) => ( @@ -201,7 +217,7 @@ const UserSettingsPage = ({ user }: userSettingsPageProps) => { {interestArray.map((topic, index) => ( handleSelectInterest(topic)} - classNames={`${selectedInterest.includes(topic) && "bg-light-orange-10 text-white"}`} + classNames={`${(selectedInterest || []).includes(topic) && "bg-light-orange-10 text-white"}`} topic={topic} key={index} /> diff --git a/lib/hooks/update-user.ts b/lib/hooks/update-user.ts index e771cebfd..678715ab5 100644 --- a/lib/hooks/update-user.ts +++ b/lib/hooks/update-user.ts @@ -1,7 +1,7 @@ import { supabase } from "lib/utils/supabase"; interface useUpdateUserProps { - data: { email?: string; interests?: string[] }; + data: { email?: string; interests?: string[]; display_local_time?: boolean; timezone?: string }; params?: string; } diff --git a/lib/utils/timezones.ts b/lib/utils/timezones.ts index 737abb42a..8fdc9b66e 100644 --- a/lib/utils/timezones.ts +++ b/lib/utils/timezones.ts @@ -1177,3 +1177,7 @@ export const timezones = [ utc: ["Pacific/Apia"] } ]; + +export const getTimezone = (timezone: string): number => { + return timezones.find(tz => tz.value === timezone)?.offset || +1; +}; \ No newline at end of file diff --git a/next-types.d.ts b/next-types.d.ts index a35dc8775..e573a14f0 100644 --- a/next-types.d.ts +++ b/next-types.d.ts @@ -130,5 +130,5 @@ interface DbUser { readonly interests: string; readonly receive_collaboration: boolean; readonly display_email: boolean; - + readonly timezone: string; }