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

New Member Model #616

Merged
merged 3 commits into from
Nov 23, 2021
Merged

New Member Model #616

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fed1d99
Create new Member model and apply to simple component.
brandonfancher Nov 19, 2021
e0d92a8
Update participating property name on Member.
brandonfancher Nov 22, 2021
e36194f
Member detail page and inductions use new Member model.
brandonfancher Nov 22, 2021
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
46 changes: 23 additions & 23 deletions packages/webapp/src/_app/ui/nav-profile.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,10 @@ import { Popover } from "@headlessui/react";
import { usePopper } from "react-popper";
import { IoMdLogIn } from "react-icons/io";

import { MemberStatus } from "_app";
import { useCurrentMember, useSignOut } from "_app/hooks";
import { Button, ProfileImage, Text } from "_app/ui";
import { ROUTES } from "_app/routes";
import { useMemberByAccountName } from "members/hooks";
import { useSignOut } from "_app/hooks";
import { Button, ProfileImage, Text } from "_app/ui";
import { Member, useCurrentMember } from "members";

import { useUALAccount } from "../eos";

Expand All @@ -17,15 +16,10 @@ interface Props {
}

export const NavProfile = ({ location }: Props) => {
const [ualAccount, _, ualShowModal] = useUALAccount();
const accountName = ualAccount?.accountName;

const [_ualAccount, _, ualShowModal] = useUALAccount();
const { data: member } = useCurrentMember();
const { data: userProfile } = useMemberByAccountName(member?.account ?? "");

const isActiveMember = member?.status === MemberStatus.ActiveMember;

if (!ualAccount) {
if (!member?.accountName) {
return (
<div className="flex justify-end xs:justify-center md:justify-end xl:justify-start mb-0 xs:mb-8 my-0">
<Button
Expand Down Expand Up @@ -66,16 +60,19 @@ export const NavProfile = ({ location }: Props) => {
// TODO: Handle loaders and error state, non-member state
return (
<div className={WRAPPER_CLASS}>
<PopoverWrapper location={location} isActiveMember={isActiveMember}>
<PopoverWrapper location={location} member={member}>
<div className={CONTAINER_CLASS}>
<div className="cursor-pointer">
<ProfileImage imageCid={userProfile?.image} size={40} />
<ProfileImage
imageCid={member?.profile?.image.cid}
size={40}
/>
</div>
<div className="hidden xl:block text-left">
<Text size="sm" className="font-semibold">
{member?.name ?? "Not a member"}
{member?.profile?.name ?? "Not a member"}
</Text>
<Text size="sm">@{member?.account ?? accountName}</Text>
<Text size="sm">@{member?.accountName}</Text>
</div>
</div>
</PopoverWrapper>
Expand All @@ -85,11 +82,12 @@ export const NavProfile = ({ location }: Props) => {

export default NavProfile;

const PopoverWrapper = ({
children,
location,
isActiveMember,
}: { children: React.ReactNode; isActiveMember: boolean } & Props) => {
interface PopoverProps extends Props {
children: React.ReactNode;
member?: Member;
}

const PopoverWrapper = ({ children, member, location }: PopoverProps) => {
const [
referenceElement,
setReferenceElement,
Expand All @@ -103,10 +101,10 @@ const PopoverWrapper = ({
{ placement: location === "mobile-nav" ? "bottom-end" : "top-start" }
);

const [ualAccount] = useUALAccount();
const accountName = ualAccount?.accountName;
const signOut = useSignOut();

const isActiveMember = Boolean(member?.profile);

return (
<Popover
className={`xl:w-full ${location === "mobile-nav" ? "h-10" : ""}`}
Expand All @@ -129,7 +127,9 @@ const PopoverWrapper = ({
}}
>
{isActiveMember && (
<Link href={`${ROUTES.MEMBERS.href}/${accountName}`}>
<Link
href={`${ROUTES.MEMBERS.href}/${member?.accountName}`}
>
<a className="block p-6 w-full hover:bg-gray-100 text-left">
<Text>My profile</Text>
</a>
Expand Down
10 changes: 5 additions & 5 deletions packages/webapp/src/inductions/components/induction-journeys/common/member-card-preview.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
import { Card } from "_app";
import { MemberData, MemberHoloCard, MemberCard } from "members";
import { Member, MemberHoloCard, MemberCard } from "members";

export const MemberCardPreview = ({
cardTitle = "Invitee information",
memberData,
member,
}: {
cardTitle?: string;
memberData: MemberData;
member: Member;
}) => (
<Card title={cardTitle} titleSize={2}>
<div className="flex justify-center items-center space-y-10 xl:space-y-0 xl:space-x-10 flex-col xl:flex-row">
<div className="max-w-xl">
<MemberHoloCard member={memberData} inducted={false} />
<MemberHoloCard member={member} inducted={false} />
</div>
<MemberCard member={memberData} />
<MemberCard member={member} />
</div>
</Card>
);
20 changes: 10 additions & 10 deletions packages/webapp/src/inductions/components/induction-journeys/invitee-journey.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React, { Dispatch, SetStateAction, useState } from "react";

import { Heading, Link, Text, useIsCommunityActive } from "_app";
import { MemberData } from "members";
import { Member } from "members";

import {
convertPendingProfileToMemberData,
convertPendingProfileToMember,
EndorsementsStatus,
InductionExpiresIn,
InductionStepGenesis,
Expand Down Expand Up @@ -96,7 +96,7 @@ export default InviteeJourney;

interface ContainerProps {
step: InductionStepInvitee | InductionStepGenesis;
memberPreview?: MemberData;
memberPreview?: Member;
children: React.ReactNode;
}

Expand All @@ -105,7 +105,7 @@ const Container = ({ step, memberPreview, children }: ContainerProps) => (
<InductionStepsContainer step={step}>
{children}
</InductionStepsContainer>
{memberPreview && <MemberCardPreview memberData={memberPreview} />}
{memberPreview && <MemberCardPreview member={memberPreview} />}
</>
);

Expand Down Expand Up @@ -188,15 +188,15 @@ const PendingCeremonyVideoStep = ({
induction,
setIsRevisitingProfile,
}: PendingCeremonyVideoStepProps) => {
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
);
return (
<Container
step={InductionStepInvitee.PendingVideoAndEndorsements}
memberPreview={memberData}
memberPreview={member}
>
<WaitingForVideo induction={induction} />
<Text className="my-3">
Expand All @@ -220,15 +220,15 @@ const PendingEndorsementStep = ({
endorsements,
setIsRevisitingProfile,
}: PendingCompletionStepProps) => {
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
);
return (
<Container
step={InductionStepInvitee.PendingVideoAndEndorsements}
memberPreview={memberData}
memberPreview={member}
>
<Heading size={1} className="mb-2">
Endorsements
Expand Down Expand Up @@ -256,7 +256,7 @@ const PendingDonationStep = ({
endorsements,
setIsRevisitingProfile,
}: PendingCompletionStepProps) => {
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
Expand All @@ -269,7 +269,7 @@ const PendingDonationStep = ({
? InductionStepInvitee.Donate
: InductionStepGenesis.Donate
}
memberPreview={memberData}
memberPreview={member}
>
<Heading size={1} className="mb-2">
Pending donation
Expand Down
8 changes: 4 additions & 4 deletions packages/webapp/src/inductions/components/induction-journeys/invitee/profile-preview.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import {
useUALAccount,
} from "_app";
import {
convertPendingProfileToMemberData,
convertPendingProfileToMember,
MemberCardPreview,
setInductionProfileTransaction,
} from "inductions";
Expand Down Expand Up @@ -70,7 +70,7 @@ export const InductionProfilePreview = ({

setDidSubmitProfile(true);
} catch (error) {
onError(error, "Unable to set the profile");
onError(error as Error, "Unable to set the profile");
}
setIsLoading(false);
};
Expand All @@ -81,15 +81,15 @@ export const InductionProfilePreview = ({
const img = URL.createObjectURL(selectedPhoto);
pendingProfile = { ...profileInfo!, img };
}
return convertPendingProfileToMemberData(
return convertPendingProfileToMember(
pendingProfile!,
induction.invitee
);
}, [induction.invitee, profileInfo, selectedPhoto]);

return (
<>
<MemberCardPreview cardTitle="" memberData={memberCardData} />
<MemberCardPreview cardTitle="" member={memberCardData} />
<Card title="Review your profile">
<form
onSubmit={submitInductionProfileTransaction}
Expand Down
24 changes: 12 additions & 12 deletions packages/webapp/src/inductions/components/induction-journeys/inviter-witness-journey.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@ import React, { Dispatch, SetStateAction, useState } from "react";

import { Heading, Link, Text, useIsCommunityActive, useUALAccount } from "_app";

import { MemberData } from "members";
import { Member } from "members";
import {
convertPendingProfileToMemberData,
convertPendingProfileToMember,
EndorsementsStatus,
InductionExpiresIn,
InductionStepGenesis,
Expand Down Expand Up @@ -87,7 +87,7 @@ export default InviterWitnessJourney;

interface ContainerProps {
step: InductionStepInviter | InductionStepGenesis;
memberPreview?: MemberData;
memberPreview?: Member;
children: React.ReactNode;
}

Expand All @@ -96,7 +96,7 @@ const Container = ({ step, memberPreview, children }: ContainerProps) => (
<InductionStepsContainer step={step}>
{children}
</InductionStepsContainer>
{memberPreview && <MemberCardPreview memberData={memberPreview} />}
{memberPreview && <MemberCardPreview member={memberPreview} />}
</>
);

Expand Down Expand Up @@ -125,15 +125,15 @@ const RecommendReview = ({
);

const SubmittedVideoStep = ({ induction }: { induction: Induction }) => {
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
);
return (
<Container
step={InductionStepInviter.VideoAndEndorse}
memberPreview={memberData}
memberPreview={member}
>
<InductionVideoSubmitConfirmation />
</Container>
Expand All @@ -151,15 +151,15 @@ const VideoStep = ({
isRevisitingVideo,
setSubmittedVideo,
}: VideoStepProps) => {
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
);
return (
<Container
step={InductionStepInviter.VideoAndEndorse}
memberPreview={memberData}
memberPreview={member}
>
<InductionVideoFormContainer
induction={induction}
Expand Down Expand Up @@ -197,7 +197,7 @@ const PendingEndorsementStep = ({
setIsRevisitingVideo,
}: PendingCompletionProps) => {
const [ualAccount] = useUALAccount();
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
Expand All @@ -209,7 +209,7 @@ const PendingEndorsementStep = ({
return (
<Container
step={InductionStepInviter.VideoAndEndorse}
memberPreview={memberData}
memberPreview={member}
>
<Heading size={1} className="mb-2">
Endorsements
Expand Down Expand Up @@ -241,7 +241,7 @@ const PendingDonationStep = ({
setIsRevisitingVideo,
}: PendingCompletionProps) => {
const { data: isCommunityActive } = useIsCommunityActive();
const memberData = convertPendingProfileToMemberData(
const member = convertPendingProfileToMember(
induction.new_member_profile,
induction.invitee,
induction.video
Expand All @@ -253,7 +253,7 @@ const PendingDonationStep = ({
? InductionStepInviter.PendingDonation
: InductionStepGenesis.Donate
}
memberPreview={memberData}
memberPreview={member}
>
<Heading size={1} className="mb-2">
Pending donation
Expand Down
Loading