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.

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

Actions menu in Subspace List * #6885

Merged
merged 14 commits into from
Sep 25, 2024
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
Prev Previous commit
small fixes
  • Loading branch information
ccanos committed Sep 25, 2024
commit f877871dcddce32b3504450727799bc950142b72
8 changes: 4 additions & 4 deletions src/core/ui/avatar/Avatar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,22 @@ import { AvatarProps, Box } from '@mui/material';
import ErrorHandlingAvatar from './ErrorHandlingAvatar';
import { gutters } from '../grid/utils';

export type Size = 'small' | 'medium' | 'regular' | 'large';
export type AvatarSize = 'small' | 'medium' | 'regular' | 'large';

const AvatarSize: Record<Size, number> = {
const AvatarSizes: Record<AvatarSize, number> = {
small: 1.5,
medium: 2,
regular: 3,
large: 4,
};

export interface SizeableAvatarProps {
size?: Size;
size?: AvatarSize;
overlay?: ReactNode;
}

const Avatar = forwardRef<HTMLDivElement, AvatarProps & SizeableAvatarProps>(({ size, sx, overlay, ...props }, ref) => {
const avatarSize = size && AvatarSize[size];
const avatarSize = size && AvatarSizes[size];

if (overlay) {
return (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -174,7 +174,7 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
return;
}

deleteSpaceMutation({
return deleteSpaceMutation({
variables: {
input: {
ID: selectedId,
Expand Down Expand Up @@ -203,7 +203,7 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
return;
}

deleteVCMutation({
return deleteVCMutation({
variables: {
virtualContributorData: {
ID: selectedId,
Expand Down Expand Up @@ -232,7 +232,7 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
return;
}

deletePackMutation({
return deletePackMutation({
variables: {
innovationPackId: selectedId,
},
Expand All @@ -259,7 +259,7 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
return;
}

deleteHubMutation({
return deleteHubMutation({
variables: {
innovationHubId: selectedId,
},
Expand All @@ -275,17 +275,13 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
const deleteEntity = () => {
switch (entity) {
case Entities.Space:
deleteSpace();
break;
return deleteSpace();
case Entities.VirtualContributor:
deleteVC();
break;
return deleteVC();
case Entities.InnovationPack:
deletePack();
break;
return deletePack();
case Entities.InnovationHub:
deleteHub();
break;
return deleteHub();
}
};

Expand Down Expand Up @@ -369,7 +365,7 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
seamless
sx={{ display: 'inline-block', maxWidth: '100%', padding: 0 }}
actions={getSpaceActions(space.id)}
whitHoverState={false}
disableHoverState
/>
))}
</Gutters>
Expand Down Expand Up @@ -459,7 +455,6 @@ export const ContributorAccountView: FC<ContributorAccountViewProps> = ({ accoun
open={deleteDialogOpen}
onClose={clearDeleteState}
onDelete={deleteEntity}
submitting={deleteSpaceLoading || deletePackLoading || deleteVCLoading}
description={entity === Entities.Space ? undefined : SHORT_NON_SPACE_DESCRIPTION}
/>
)}
Expand Down
4 changes: 2 additions & 2 deletions src/domain/journey/common/JourneyAvatar/JourneyAvatar.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import React, { forwardRef } from 'react';
import { SxProps, Theme } from '@mui/material';
import Avatar, { Size, SizeableAvatarProps } from '../../../../core/ui/avatar/Avatar';
import Avatar, { AvatarSize, SizeableAvatarProps } from '../../../../core/ui/avatar/Avatar';
import defaultJourneyAvatar from '../../defaultVisuals/Avatar.jpg';

interface JourneyAvatarProps extends SizeableAvatarProps {
src: string | undefined;
sx?: SxProps<Theme> | undefined;
size?: Size;
size?: AvatarSize;
}

const JourneyAvatar = forwardRef<HTMLDivElement, JourneyAvatarProps>(({ src, size = 'large', ...props }, ref) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import { intersection } from 'lodash';
import FlexSpacer from '../../../../core/ui/utils/FlexSpacer';
import JourneyAvatar from '../JourneyAvatar/JourneyAvatar';
import ActionsMenu from '../../../../core/ui/card/ActionsMenu';
import { Size } from '../../../../core/ui/avatar/Avatar';
import { AvatarSize } from '../../../../core/ui/avatar/Avatar';

export const JourneyCardHorizontalSkeleton = () => (
<ElevatedPaper sx={{ padding: gutters() }}>
Expand Down Expand Up @@ -55,15 +55,15 @@ export interface JourneyCardHorizontalProps {
journeyTypeName: JourneyTypeName;
sx?: PaperProps['sx'];
actions?: ReactNode;
size?: Size;
whitHoverState?: boolean;
size?: AvatarSize;
disableHoverState?: boolean;
}

const ElevatedPaper = withElevationOnHover(Paper) as typeof Paper;

const VISIBLE_COMMUNITY_ROLES = [CommunityRole.Admin, CommunityRole.Lead] as const;

const Wrapper = <D extends React.ElementType = ListItemButtonTypeMap['defaultComponent'], P = {}>(
const Wrapper = <D extends React.ElementType = ListItemButtonTypeMap['defaultComponent'], P = Record<string, unknown>>(
props: ListItemButtonProps<D, P> & RouterLinkProps
) => <ListItemButton component={RouterLink} {...props} />;

Expand All @@ -75,7 +75,7 @@ const JourneyCardHorizontal = ({
sx,
actions,
size,
whitHoverState = true,
disableHoverState = false,
}: JourneyCardHorizontalProps) => {
const Icon = JourneyIcon[journeyTypeName];

Expand All @@ -94,7 +94,7 @@ const JourneyCardHorizontal = ({
<ElevatedPaper sx={mergedSx} elevation={seamless ? 0 : undefined}>
<BadgeCardView
visual={<JourneyAvatar size={size} src={journey.profile.avatar?.uri || journey.profile.cardBanner?.uri} />}
component={whitHoverState ? Wrapper : RouterLink}
component={disableHoverState ? RouterLink : Wrapper}
to={journey.profile.url}
actions={actions && <ActionsMenu>{actions}</ActionsMenu>}
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ const SpaceAccountView: FC<SpaceAccountPageProps> = ({ journeyId }) => {
};
}, [data]);

const [deleteSpace, { loading: deletingSpace }] = useDeleteSpaceMutation({
const [deleteSpace] = useDeleteSpaceMutation({
refetchQueries: [refetchAdminSpacesListQuery()],
awaitRefetchQueries: true,
onCompleted: data => {
Expand All @@ -165,7 +165,7 @@ const SpaceAccountView: FC<SpaceAccountPageProps> = ({ journeyId }) => {
});

const handleDelete = (id: string) => {
deleteSpace({
return deleteSpace({
variables: {
input: {
ID: id,
Expand Down Expand Up @@ -303,7 +303,6 @@ const SpaceAccountView: FC<SpaceAccountPageProps> = ({ journeyId }) => {
open={deleteDialogOpen}
onClose={() => setDeleteDialogOpen(false)}
onDelete={() => handleDelete(journeyId)}
submitting={deletingSpace}
/>
)}
</>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,14 @@ import { Actions } from '../../../../../core/ui/actions/Actions';
import { Caption } from '../../../../../core/ui/typography';
import { gutters } from '../../../../../core/ui/grid/utils';
import TranslationKey from '../../../../../core/i18n/utils/TranslationKey';
import useLoadingState from '../../../../shared/utils/useLoadingState';

interface EntityConfirmDeleteDialogProps {
entity: string;
description?: TranslationKey;
open: boolean;
onClose: () => void;
onDelete: () => void;
submitting: boolean;
onDelete: () => Promise<unknown> | void;
}

const EntityConfirmDeleteDialog: FC<EntityConfirmDeleteDialogProps> = ({
Expand All @@ -24,14 +24,24 @@ const EntityConfirmDeleteDialog: FC<EntityConfirmDeleteDialogProps> = ({
open,
onClose,
onDelete,
submitting,
}) => {
const { t } = useTranslation();
const [checked, setChecked] = useState(false);
const handleClose = () => {
setChecked(false);
onClose();
};
const [handleDelete, loading] = useLoadingState(async () => {
await onDelete();
setChecked(false);
});

return (
<Dialog open={open} onClose={onClose}>
<DialogHeader onClose={onClose} title={t('components.deleteEntity.confirmDialog.title', { entity: entity })} />
<Dialog open={open} onClose={handleClose}>
<DialogHeader
onClose={handleClose}
title={t('components.deleteEntity.confirmDialog.title', { entity: entity })}
/>
<DialogContent>
<Gutters disablePadding>
<Box sx={{ wordWrap: 'break-word' }}>
Expand All @@ -43,14 +53,12 @@ const EntityConfirmDeleteDialog: FC<EntityConfirmDeleteDialogProps> = ({
label={<Caption>{t('components.deleteEntity.confirmDialog.checkbox', { entity: entity })}</Caption>}
/>
<Actions justifyContent="flex-end" paddingTop={gutters()}>
<Button onClick={onClose}>{t('buttons.cancel')}</Button>
<Button onClick={handleClose}>{t('buttons.cancel')}</Button>
<LoadingButton
variant="contained"
value={'SPACE'}
disabled={!checked}
loading={submitting}
loadingIndicator={`${t('components.deleteEntity.confirmDialog.confirm')}...`}
onClick={onDelete}
loading={loading}
onClick={handleDelete}
sx={{ textWrap: 'nowrap' }}
>
{t('components.deleteEntity.confirmDialog.confirm')}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ export const SpaceSettingsView: FC<SpaceSettingsViewProps> = ({ journeyId, journ
const openDialog = () => setOpenDeleteDialog(true);
const closeDialog = () => setOpenDeleteDialog(false);

const [deleteSpace, { loading: deletingSpace }] = useDeleteSpaceMutation({
const [deleteSpace] = useDeleteSpaceMutation({
refetchQueries: [
refetchAdminSpaceSubspacesPageQuery({
spaceId: spaceNameId,
Expand All @@ -97,7 +97,7 @@ export const SpaceSettingsView: FC<SpaceSettingsViewProps> = ({ journeyId, journ
const canDelete = privileges?.includes(AuthorizationPrivilege.Delete);

const handleDelete = (id: string) => {
deleteSpace({
return deleteSpace({
variables: {
input: {
ID: id,
Expand Down Expand Up @@ -386,7 +386,6 @@ export const SpaceSettingsView: FC<SpaceSettingsViewProps> = ({ journeyId, journ
open={openDeleteDialog}
onClose={closeDialog}
onDelete={() => handleDelete(subspaceId)}
submitting={deletingSpace}
/>
)}
</>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ export const SubspaceListView: FC = () => {
},
})) || [];

const [deleteSubspace, { loading: deleteLoading }] = useDeleteSpaceMutation({
const [deleteSubspace] = useDeleteSpaceMutation({
refetchQueries: [
refetchAdminSpaceSubspacesPageQuery({
spaceId: spaceNameId,
Expand All @@ -78,7 +78,7 @@ export const SubspaceListView: FC = () => {
});

const handleDelete = (item: { id: string }) => {
deleteSubspace({
return deleteSubspace({
variables: {
input: {
ID: item.id,
Expand Down Expand Up @@ -154,9 +154,9 @@ export const SubspaceListView: FC = () => {
setSelectedItem(undefined);
};

const onDeleteConfirmation = () => {
const onDeleteConfirmation = async () => {
if (selectedItem) {
handleDelete(selectedItem);
await handleDelete(selectedItem);
setDeleteDialogOpen(false);
}
};
Expand Down Expand Up @@ -244,7 +244,6 @@ export const SubspaceListView: FC = () => {
open={deleteDialogOpen}
onClose={clearDeleteState}
onDelete={onDeleteConfirmation}
submitting={deleteLoading}
description={'components.deleteEntity.confirmDialog.descriptionShort'}
/>
</>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ export const OpportunityList: FC = () => {
},
})) || [];

const [deleteOpportunity, { loading: deleteLoading }] = useDeleteSpaceMutation({
const [deleteOpportunity] = useDeleteSpaceMutation({
refetchQueries: [
refetchSubspacesInSpaceQuery({
spaceId: subspaceId,
Expand All @@ -65,7 +65,7 @@ export const OpportunityList: FC = () => {
});

const handleDelete = (item: SearchableListItem) => {
deleteOpportunity({
return deleteOpportunity({
variables: {
input: {
ID: item.id,
Expand Down Expand Up @@ -184,7 +184,6 @@ export const OpportunityList: FC = () => {
open={deleteDialogOpen}
onClose={clearDeleteState}
onDelete={onDeleteConfirmation}
submitting={deleteLoading}
description={'components.deleteEntity.confirmDialog.descriptionShort'}
/>
</>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ const OpportunitySettingsView: FC = () => {
const openDialog = () => setOpenDeleteDialog(true);
const closeDialog = () => setOpenDeleteDialog(false);

const [deleteOpportunity, { loading }] = useDeleteSpaceMutation({
const [deleteOpportunity] = useDeleteSpaceMutation({
refetchQueries: [
refetchSubspacesInSpaceQuery({
spaceId: spaceId,
Expand All @@ -57,7 +57,7 @@ const OpportunitySettingsView: FC = () => {
const subspacePriviledges = data?.lookup.space?.authorization?.myPrivileges ?? [];
const canDelete = subspacePriviledges.includes(AuthorizationPrivilege.Delete);
const handleDelete = () => {
deleteOpportunity({
return deleteOpportunity({
variables: {
input: {
ID: subspaceId,
Expand All @@ -83,7 +83,6 @@ const OpportunitySettingsView: FC = () => {
open={openDeleteDialog}
onClose={closeDialog}
onDelete={handleDelete}
submitting={loading}
/>
)}
</PageContent>
Expand Down