Skip to content

Commit

Permalink
Merge pull request #1670 from ever-co/fix/minor-ui-fixes
Browse files Browse the repository at this point in the history
Reset card UI
  • Loading branch information
evereq authored Oct 27, 2023
2 parents c1eaccc + b262fdd commit ab50e15
Show file tree
Hide file tree
Showing 5 changed files with 75 additions and 75 deletions.
36 changes: 10 additions & 26 deletions apps/web/lib/features/team-members-card-view.tsx
Original file line number Diff line number Diff line change
@@ -1,34 +1,22 @@
import {
useAuthenticateUser,
useModal,
useOrganizationTeams,
useTeamInvitations
} from '@app/hooks';
import { useAuthenticateUser, useModal, useOrganizationTeams, useTeamInvitations } from '@app/hooks';
import { Transition } from '@headlessui/react';
import { InviteFormModal } from './team/invite/invite-form-modal';
import {
InvitedCard,
InviteUserTeamCard
} from './team/invite/user-invite-card';
import { InvitedCard, InviteUserTeamCard } from './team/invite/user-invite-card';
import { InviteUserTeamSkeleton, UserTeamCard, UserTeamCardSkeleton } from '.';
import { OT_Member } from '@app/interfaces';

interface Props {
teamMembers: OT_Member[];
publicTeam: boolean;
currentUser: OT_Member | undefined;
}

const TeamMembersCardView: React.FC<Props> = ({ teamMembers, publicTeam=false }) => {
const { isTeamManager, user } = useAuthenticateUser();
const currentUser = teamMembers.find((m) => {
return m.employee.userId === user?.id;
});
const { activeTeam, teamsFetching } = useOrganizationTeams();
const members = activeTeam?.members || [];

const TeamMembersCardView: React.FC<Props> = ({ teamMembers: members, currentUser, publicTeam = false }) => {
const { isTeamManager } = useAuthenticateUser();
const { teamsFetching } = useOrganizationTeams();
const { teamInvitations } = useTeamInvitations();
const $teamsFetching = teamsFetching && members.length === 0;
return(
return (
<ul className="mt-7">
{/* Current authenticated user members */}
<Transition
Expand Down Expand Up @@ -109,9 +97,8 @@ const TeamMembersCardView: React.FC<Props> = ({ teamMembers, publicTeam=false })
</li>
</Transition>
</ul>
)

}
);
};

function Invite() {
const { user } = useAuthenticateUser();
Expand All @@ -120,10 +107,7 @@ function Invite() {
return (
<>
<InviteUserTeamCard active={user?.isEmailVerified} onClick={openModal} />
<InviteFormModal
open={isOpen && !!user?.isEmailVerified}
closeModal={closeModal}
/>
<InviteFormModal open={isOpen && !!user?.isEmailVerified} closeModal={closeModal} />
</>
);
}
Expand Down
10 changes: 9 additions & 1 deletion apps/web/lib/features/team-members-table-view.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,12 @@ import { InviteFormModal } from './team/invite/invite-form-modal';

const TeamMembersTableView = ({
teamMembers,
currentUser,
publicTeam = false,
active = false
}: {
teamMembers: OT_Member[];
currentUser: OT_Member | undefined;
publicTeam?: boolean;
active?: boolean;
}) => {
Expand Down Expand Up @@ -55,10 +57,16 @@ const TeamMembersTableView = ({

const footerRows = React.useMemo<React.ReactNode[]>(() => [<Invite key={0} />], []);

const sortedTeamMembers: OT_Member[] = [];
if (currentUser) {
sortedTeamMembers.push(currentUser);
}
sortedTeamMembers.push(...teamMembers);

return (
<DataTable
columns={columns as Column<OT_Member>[]}
data={teamMembers}
data={sortedTeamMembers}
footerRows={footerRows}
noResultsMessage={{
heading: 'No team members found',
Expand Down
101 changes: 54 additions & 47 deletions apps/web/lib/features/team-members.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,57 +9,64 @@ import TeamMembersCardView from './team-members-card-view';
import { IssuesView } from '@app/constants';

type TeamMembersProps = {
publicTeam?: boolean;
kabanView?: IssuesView;
publicTeam?: boolean;
kabanView?: IssuesView;

Check warning on line 13 in apps/web/lib/features/team-members.tsx

View workflow job for this annotation

GitHub Actions / Cspell

Unknown word (kaban)
};

export function TeamMembers({ publicTeam = false, kabanView = IssuesView.CARDS }: TeamMembersProps) {

Check warning on line 16 in apps/web/lib/features/team-members.tsx

View workflow job for this annotation

GitHub Actions / Cspell

Unknown word (kaban)
const { user } = useAuthenticateUser();
const { activeTeam } = useOrganizationTeams();
const { user } = useAuthenticateUser();
const { activeTeam } = useOrganizationTeams();

const members = activeTeam?.members || [];
const currentUser = members.find((m) => m.employee.userId === user?.id);
const members = activeTeam?.members || [];
const currentUser = members.find((m) => m.employee.userId === user?.id);
const $members = members.filter((member) => member.id !== currentUser?.id);

const $members = members.filter((m) => m.employee.user?.id !== user?.id);
let teamMembersView;


let teamMembersView;

switch (true) {
case members.length === 0:
teamMembersView = (
<div className="">
<div className="lg:block hidden">
<UserTeamCardSkeletonCard />
<InviteUserTeamCardSkeleton />
</div>
<div className="block lg:hidden">
<UserCard />
<UserCard />
</div>
</div>
);
break;
case kabanView === IssuesView.CARDS:
teamMembersView = <TeamMembersCardView teamMembers={$members} publicTeam={publicTeam} />;
break;
case kabanView === IssuesView.TABLE:
teamMembersView = (
<Transition
show={!!currentUser}
enter="transition-opacity duration-75"
enterFrom="opacity-0"
enterTo="opacity-100"
leave="transition-opacity duration-150"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<TeamMembersTableView teamMembers={members} publicTeam={publicTeam} active={user?.isEmailVerified} />
</Transition>
);
break;
default:
teamMembersView = <TeamMembersCardView teamMembers={members} publicTeam={publicTeam} />;
}
return teamMembersView;
switch (true) {
case members.length === 0:
teamMembersView = (
<div className="">
<div className="lg:block hidden">
<UserTeamCardSkeletonCard />
<InviteUserTeamCardSkeleton />
</div>
<div className="block lg:hidden">
<UserCard />
<UserCard />
</div>
</div>
);
break;
case kabanView === IssuesView.CARDS:

Check warning on line 41 in apps/web/lib/features/team-members.tsx

View workflow job for this annotation

GitHub Actions / Cspell

Unknown word (kaban)
teamMembersView = (
<TeamMembersCardView teamMembers={members} currentUser={currentUser} publicTeam={publicTeam} />
);
break;
case kabanView === IssuesView.TABLE:

Check warning on line 46 in apps/web/lib/features/team-members.tsx

View workflow job for this annotation

GitHub Actions / Cspell

Unknown word (kaban)
teamMembersView = (
<Transition
show={!!currentUser}
enter="transition-opacity duration-75"
enterFrom="opacity-0"
enterTo="opacity-100"
leave="transition-opacity duration-150"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<TeamMembersTableView
teamMembers={$members}
currentUser={currentUser}
publicTeam={publicTeam}
active={user?.isEmailVerified}
/>
</Transition>
);
break;
default:
teamMembersView = (
<TeamMembersCardView teamMembers={$members} currentUser={currentUser} publicTeam={publicTeam} />
);
}
return teamMembersView;
}
1 change: 1 addition & 0 deletions apps/web/lib/i18n/en.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
export const en = {
TITLE: 'Ever Teams',
common: {
COPY_NUMBER: 'Copy Number',
VERIFY: 'verify',
PLEASE: 'please',
HERE: 'here',
Expand Down
2 changes: 1 addition & 1 deletion apps/web/pages/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import { TableCellsIcon, QueueListIcon } from '@heroicons/react/24/solid';
function MainPage() {
const { t } = useTranslation();
const { isTeamMember, isTrackingEnabled, activeTeam } = useOrganizationTeams();
const breadcrumb = [...t('pages.home.BREADCRUMB', { returnObjects: true }), activeTeam?.name || ''];
const breadcrumb = [...(t('pages.home.BREADCRUMB', { returnObjects: true }) as any), activeTeam?.name || ''];
const [view, setView] = useState<IssuesView>(IssuesView.CARDS);

return (
Expand Down

0 comments on commit ab50e15

Please sign in to comment.