Skip to content
This repository has been archived by the owner on Feb 23, 2022. It is now read-only.

Lakehead - CEM-2602 Profile list with counter #423

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Lakehead - CEM-2602 Profile list with counter #423

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
9148b9a
Functions but does not adjust position dynamically
percypie Nov 24, 2021
cb8190c
Implemented the counter on the existing component
percypie Nov 24, 2021
15feb92
Added a boolean that can be turned on to display counter
percypie Nov 25, 2021
26ae7e1
meeting fixes
percypie Nov 26, 2021
6f34cb1
Changed counterBool to isCounterShowing
percypie Nov 26, 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
25 changes: 18 additions & 7 deletions src/Containers/FeaturesProfileCard/FeaturedProfilesCard.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,15 +87,26 @@ const profiles = [
export default {
title: createStoryTitle('Featured Profiles Card'),
component: FeaturedProfilesCard,
args: {
profileData: profiles,
alt: 'Profile Image',
counterBool: false,
},
} as Meta;

export const Demo: Story<IFeaturedProfilesCardProps> = (args) => (
const Template: Story<IFeaturedProfilesCardProps> = (args) => (
<FeaturedProfilesCard {...args} />
);

//todo different use cases presets.
export const Basic = Template.bind({});
Basic.args = {
profileData: profiles,
counterBool: false,
Copy link
Member

Choose a reason for hiding this comment

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

Don't put Types in the Name

We dont say NameString, we just say Name.

Rename this to isCounterShowing or isCounterDisplayed or isProfileCountShowing

the prefix is denotes a Boolean value

};

export const NoProfiles = Template.bind({});
NoProfiles.args = {
profileData: [],
counterBool: false,
};

export const CounterOn = Template.bind({});
CounterOn.args = {
profileData: profiles,
counterBool: true,
};
37 changes: 16 additions & 21 deletions src/Containers/FeaturesProfileCard/FeaturedProfilesCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,32 +59,27 @@ export const FeaturedProfilesCard: React.FC<IFeaturedProfilesCardProps> = ({
profile: IProfile,
index: number,
): React.ReactElement => {
const featuredProfileProps = {
key: profile.id,
background: 'none'
};

switch (true) {
case index < determineProfilePictureLimit():
return (
<FeaturedProfile
key={profile.id}
image={profile.image}
background="none"
/>
);
featuredProfileProps['image'] = profile.image;

case index < profileInitialsEndIndex:
return (
<FeaturedProfile
key={profile.id}
initials={profile.initials}
background="orange"
/>
);
featuredProfileProps['initials'] = profile.initials;
featuredProfileProps['background'] = "orange";

default:
return (
<FeaturedProfile
key={profile.id}
remainingProfiles={remainingProfiles}
background="gray"
/>
);
featuredProfileProps['remainingProfiles'] = {remainingProfiles};
featuredProfileProps['background'] = "gray";
}

return (
<FeaturedProfile {...featuredProfileProps}/>
)
};

return profiles.map(
Expand Down