mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
signal-desktop/ts/components/conversation/GroupV2Change.stories.tsx

1632 lines
32 KiB
TypeScript
Raw Normal View History

Remove unused `eslint-disable`s
2022-06-03 21:07:51 +00:00
// Copyright 2020-2022 Signal Messenger, LLC
Add license headers across the project
2020-10-30 20:34:04 +00:00
// SPDX-License-Identifier: AGPL-3.0-only
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
import * as React from 'react';
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
import { action } from '@storybook/addon-actions';
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
Move i18n setup to TypeScript
2021-09-18 00:30:08 +00:00
import { setupI18n } from '../../util/setupI18n';
Use UUIDs in group database schema
2021-10-26 22:59:08 +00:00
import { UUID } from '../../types/UUID';
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
import type { UUIDStringType } from '../../types/UUID';
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
import enMessages from '../../../_locales/en/messages.json';
Prefer `import type` when importing types
2021-10-26 19:15:33 +00:00
import type { GroupV2ChangeType } from '../../groups';
More protobufjs migration
2021-07-09 19:36:10 +00:00
import { SignalService as Proto } from '../../protobuf';
Prefer `import type` when importing types
2021-10-26 19:15:33 +00:00
import type { SmartContactRendererType } from '../../groupChange';
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
import { GroupV2Change } from './GroupV2Change';
Fix groupV2 change rendering in notifications and left pane
2021-12-16 17:44:54 +00:00
import type { FullJSXType } from '../Intl';
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
const i18n = setupI18n('en', enMessages);
Use UUIDs in group database schema
2021-10-26 22:59:08 +00:00
const OUR_ID = UUID.generate().toString();
const CONTACT_A = UUID.generate().toString();
const CONTACT_B = UUID.generate().toString();
const CONTACT_C = UUID.generate().toString();
const ADMIN_A = UUID.generate().toString();
const INVITEE_A = UUID.generate().toString();
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
More protobufjs migration
2021-07-09 19:36:10 +00:00
const AccessControlEnum = Proto.AccessControl.AccessRequired;
const RoleEnum = Proto.Member.Role;
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
Fix groupV2 change rendering in notifications and left pane
2021-12-16 17:44:54 +00:00
const renderContact: SmartContactRendererType<FullJSXType> = (
conversationId: string
) => (
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
<React.Fragment key={conversationId}>
{`Conversation(${conversationId})`}
</React.Fragment>
);
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
const renderChange = (
change: GroupV2ChangeType,
{
groupBannedMemberships,
groupMemberships,
groupName,
areWeAdmin = true,
}: {
groupMemberships?: Array<{
uuid: UUIDStringType;
isAdmin: boolean;
}>;
groupBannedMemberships?: Array<UUIDStringType>;
groupName?: string;
areWeAdmin?: boolean;
} = {}
) => (
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
<GroupV2Change
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
areWeAdmin={areWeAdmin ?? true}
blockGroupLinkRequests={action('blockGroupLinkRequests')}
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
change={change}
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
groupBannedMemberships={groupBannedMemberships}
groupMemberships={groupMemberships}
Group Description: Render newlines, view button in change notification
2021-06-04 16:27:04 +00:00
groupName={groupName}
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
i18n={i18n}
Use UUIDs in group database schema
2021-10-26 22:59:08 +00:00
ourUuid={OUR_ID}
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
renderContact={renderContact}
/>
);
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
export default {
title: 'Components/Conversation/GroupV2Change',
};
export const Multiple = (): JSX.Element => {
return (
<>
{renderChange({
from: CONTACT_A,
details: [
{
type: 'title',
newTitle: 'Saturday Running',
},
{
type: 'avatar',
removed: false,
},
{
type: 'description',
description:
'This is a long description.\n\nWe need a dialog to view it all!\n\nIt has a link to https://example.com',
},
{
type: 'member-add',
uuid: OUR_ID,
},
{
type: 'description',
description: 'Another description',
},
{
type: 'member-privilege',
uuid: OUR_ID,
newPrivilege: RoleEnum.ADMINISTRATOR,
},
],
})}
</>
);
};
export const Create = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'create',
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'create',
},
],
})}
{renderChange({
details: [
{
type: 'create',
},
],
})}
</>
);
};
export const Title = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'title',
newTitle: 'Saturday Running',
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'title',
newTitle: 'Saturday Running',
},
],
})}
{renderChange({
details: [
{
type: 'title',
newTitle: 'Saturday Running',
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'title',
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'title',
},
],
})}
{renderChange({
details: [
{
type: 'title',
},
],
})}
</>
);
};
export const Avatar = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'avatar',
removed: false,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'avatar',
removed: false,
},
],
})}
{renderChange({
details: [
{
type: 'avatar',
removed: false,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'avatar',
removed: true,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'avatar',
removed: true,
},
],
})}
{renderChange({
details: [
{
type: 'avatar',
removed: true,
},
],
})}
</>
);
};
export const AccessAttributes = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'access-attributes',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'access-attributes',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
details: [
{
type: 'access-attributes',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'access-attributes',
newPrivilege: AccessControlEnum.MEMBER,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'access-attributes',
newPrivilege: AccessControlEnum.MEMBER,
},
],
})}
{renderChange({
details: [
{
type: 'access-attributes',
newPrivilege: AccessControlEnum.MEMBER,
},
],
})}
</>
);
};
AccessAttributes.story = {
name: 'Access (Attributes)',
};
export const AccessMembers = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'access-members',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'access-members',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
details: [
{
type: 'access-members',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'access-members',
newPrivilege: AccessControlEnum.MEMBER,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'access-members',
newPrivilege: AccessControlEnum.MEMBER,
},
],
})}
{renderChange({
details: [
{
type: 'access-members',
newPrivilege: AccessControlEnum.MEMBER,
},
],
})}
</>
);
};
AccessMembers.story = {
name: 'Access (Members)',
};
export const AccessInviteLink = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'access-invite-link',
newPrivilege: AccessControlEnum.ANY,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'access-invite-link',
newPrivilege: AccessControlEnum.ANY,
},
],
})}
{renderChange({
details: [
{
type: 'access-invite-link',
newPrivilege: AccessControlEnum.ANY,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'access-invite-link',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'access-invite-link',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
details: [
{
type: 'access-invite-link',
newPrivilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
</>
);
};
AccessInviteLink.story = {
name: 'Access (Invite Link)',
};
export const MemberAdd = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add',
uuid: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'member-add',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add',
uuid: CONTACT_A,
},
],
})}
{renderChange({
from: CONTACT_B,
details: [
{
type: 'member-add',
uuid: CONTACT_A,
},
],
})}
{renderChange({
details: [
{
type: 'member-add',
uuid: CONTACT_A,
},
],
})}
</>
);
};
export const MemberAddFromInvited = (): JSX.Element => {
return (
<>
{/* the strings where someone added you - shown like a normal add */}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add-from-invite',
uuid: OUR_ID,
inviter: CONTACT_B,
},
],
})}
{renderChange({
details: [
{
type: 'member-add-from-invite',
uuid: OUR_ID,
inviter: CONTACT_A,
},
],
})}
{/* the rest of the 'someone added someone else' checks */}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add-from-invite',
uuid: CONTACT_A,
inviter: CONTACT_B,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add-from-invite',
uuid: CONTACT_B,
inviter: CONTACT_C,
},
],
})}
{renderChange({
details: [
{
type: 'member-add-from-invite',
uuid: CONTACT_A,
inviter: CONTACT_B,
},
],
})}
{/* in all of these we know the user has accepted the invite */}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add-from-invite',
uuid: OUR_ID,
inviter: CONTACT_A,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add-from-invite',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add-from-invite',
uuid: CONTACT_A,
inviter: OUR_ID,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add-from-invite',
uuid: CONTACT_A,
inviter: CONTACT_B,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add-from-invite',
uuid: CONTACT_A,
},
],
})}
</>
);
};
MemberAddFromInvited.story = {
name: 'Member Add (from invited)',
};
export const MemberAddFromLink = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add-from-link',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-add-from-link',
uuid: CONTACT_A,
},
],
})}
{renderChange({
details: [
{
type: 'member-add-from-link',
uuid: CONTACT_A,
},
],
})}
</>
);
};
MemberAddFromLink.story = {
name: 'Member Add (from link)',
};
export const MemberAddFromAdminApproval = (): JSX.Element => {
return (
<>
{renderChange({
from: ADMIN_A,
details: [
{
type: 'member-add-from-admin-approval',
uuid: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'member-add-from-admin-approval',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-add-from-admin-approval',
uuid: CONTACT_A,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'member-add-from-admin-approval',
uuid: CONTACT_A,
},
],
})}
{renderChange({
details: [
{
type: 'member-add-from-admin-approval',
uuid: CONTACT_A,
},
],
})}
</>
);
};
MemberAddFromAdminApproval.story = {
name: 'Member Add (from admin approval)',
};
export const MemberRemove = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-remove',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-remove',
uuid: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'member-remove',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-remove',
uuid: CONTACT_A,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-remove',
uuid: CONTACT_A,
},
],
})}
{renderChange({
from: CONTACT_B,
details: [
{
type: 'member-remove',
uuid: CONTACT_A,
},
],
})}
{renderChange({
details: [
{
type: 'member-remove',
uuid: CONTACT_A,
},
],
})}
</>
);
};
export const MemberPrivilege = (): JSX.Element => {
return (
<>
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-privilege',
uuid: OUR_ID,
newPrivilege: RoleEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
details: [
{
type: 'member-privilege',
uuid: OUR_ID,
newPrivilege: RoleEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-privilege',
uuid: CONTACT_A,
newPrivilege: RoleEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'member-privilege',
uuid: CONTACT_A,
newPrivilege: RoleEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
details: [
{
type: 'member-privilege',
uuid: CONTACT_A,
newPrivilege: RoleEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'member-privilege',
uuid: OUR_ID,
newPrivilege: RoleEnum.DEFAULT,
},
],
})}
{renderChange({
details: [
{
type: 'member-privilege',
uuid: OUR_ID,
newPrivilege: RoleEnum.DEFAULT,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'member-privilege',
uuid: CONTACT_A,
newPrivilege: RoleEnum.DEFAULT,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'member-privilege',
uuid: CONTACT_A,
newPrivilege: RoleEnum.DEFAULT,
},
],
})}
{renderChange({
details: [
{
type: 'member-privilege',
uuid: CONTACT_A,
newPrivilege: RoleEnum.DEFAULT,
},
],
})}
</>
);
};
export const PendingAddOne = (): JSX.Element => {
return (
<>
{renderChange({
from: CONTACT_A,
details: [
{
type: 'pending-add-one',
uuid: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'pending-add-one',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-add-one',
uuid: INVITEE_A,
},
],
})}
{renderChange({
from: CONTACT_B,
details: [
{
type: 'pending-add-one',
uuid: INVITEE_A,
},
],
})}
{renderChange({
details: [
{
type: 'pending-add-one',
uuid: INVITEE_A,
},
],
})}
</>
);
};
PendingAddOne.story = {
name: 'Pending Add - one',
};
export const PendingAddMany = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-add-many',
count: 5,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'pending-add-many',
count: 5,
},
],
})}
{renderChange({
details: [
{
type: 'pending-add-many',
count: 5,
},
],
})}
</>
);
};
PendingAddMany.story = {
name: 'Pending Add - many',
};
export const PendingRemoveOne = (): JSX.Element => {
return (
<>
{renderChange({
from: INVITEE_A,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: OUR_ID,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: OUR_ID,
},
],
})}
{renderChange({
from: INVITEE_A,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
},
],
})}
{renderChange({
from: INVITEE_A,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: CONTACT_B,
},
],
})}
{renderChange({
from: CONTACT_B,
details: [
{
type: 'pending-remove-one',
uuid: OUR_ID,
inviter: CONTACT_B,
},
],
})}
{renderChange({
from: CONTACT_A,
details: [
{
type: 'pending-remove-one',
uuid: CONTACT_B,
inviter: CONTACT_A,
},
],
})}
{renderChange({
from: CONTACT_C,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: CONTACT_B,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: CONTACT_B,
},
],
})}
{renderChange({
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
inviter: CONTACT_B,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
},
],
})}
{renderChange({
from: CONTACT_B,
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
},
],
})}
{renderChange({
details: [
{
type: 'pending-remove-one',
uuid: INVITEE_A,
},
],
})}
</>
);
};
PendingRemoveOne.story = {
name: 'Pending Remove - one',
};
export const PendingRemoveMany = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-remove-many',
count: 5,
inviter: OUR_ID,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'pending-remove-many',
count: 5,
inviter: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'pending-remove-many',
count: 5,
inviter: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-remove-many',
count: 5,
inviter: CONTACT_A,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'pending-remove-many',
count: 5,
inviter: CONTACT_A,
},
],
})}
{renderChange({
details: [
{
type: 'pending-remove-many',
count: 5,
inviter: CONTACT_A,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'pending-remove-many',
count: 5,
},
],
})}
GroupsV2: Better group invite behavior
2020-10-06 17:06:34 +00:00
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
{renderChange({
from: CONTACT_A,
details: [
{
type: 'pending-remove-many',
count: 5,
},
],
})}
{renderChange({
details: [
{
type: 'pending-remove-many',
count: 5,
},
],
})}
</>
);
};
GroupsV2: Better group invite behavior
2020-10-06 17:06:34 +00:00
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
PendingRemoveMany.story = {
name: 'Pending Remove - many',
};
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
export const AdminApprovalAdd = (): JSX.Element => {
return (
<>
{renderChange({
details: [
{
type: 'admin-approval-add-one',
uuid: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'admin-approval-add-one',
uuid: CONTACT_A,
},
],
})}
</>
);
};
AdminApprovalAdd.story = {
name: 'Admin Approval (Add)',
};
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
export const AdminApprovalRemove = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'admin-approval-remove-one',
uuid: OUR_ID,
},
],
})}
{renderChange({
details: [
{
type: 'admin-approval-remove-one',
uuid: OUR_ID,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'admin-approval-remove-one',
uuid: CONTACT_A,
},
],
})}
Should show button:
{renderChange(
{
Support for new GroupV2 groups
2020-09-09 02:25:05 +00:00
from: CONTACT_A,
details: [
{
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
type: 'admin-approval-remove-one',
Use UUIDs in group database schema
2021-10-26 22:59:08 +00:00
uuid: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{
groupMemberships: [{ uuid: CONTACT_C, isAdmin: false }],
groupBannedMemberships: [CONTACT_B],
}
)}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'admin-approval-remove-one',
uuid: CONTACT_A,
},
],
})}
Should show button:
{renderChange(
{
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
details: [
{
type: 'admin-approval-remove-one',
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
uuid: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{
groupMemberships: [{ uuid: CONTACT_C, isAdmin: false }],
groupBannedMemberships: [CONTACT_B],
}
)}
Would show button, but we&apos;re not admin:
{renderChange(
{
from: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
details: [
{
type: 'admin-approval-remove-one',
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
uuid: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{ areWeAdmin: false, groupName: 'Group 1' }
)}
Would show button, but user is a group member:
{renderChange(
{
from: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
details: [
{
type: 'admin-approval-remove-one',
Use UUIDs in group database schema
2021-10-26 22:59:08 +00:00
uuid: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{ groupMemberships: [{ uuid: CONTACT_A, isAdmin: false }] }
)}
Would show button, but user is already banned:
{renderChange(
{
from: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
details: [
{
type: 'admin-approval-remove-one',
Use UUIDs in group database schema
2021-10-26 22:59:08 +00:00
uuid: CONTACT_A,
Group V2 invite links: in-conversation messages
2020-12-18 19:27:43 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{ groupBannedMemberships: [CONTACT_A] }
)}
</>
);
};
AdminApprovalRemove.story = {
name: 'Admin Approval (Remove)',
};
export const GroupLinkAdd = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'group-link-add',
privilege: AccessControlEnum.ANY,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'group-link-add',
privilege: AccessControlEnum.ANY,
},
],
})}
{renderChange({
details: [
{
type: 'group-link-add',
privilege: AccessControlEnum.ANY,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'group-link-add',
privilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'group-link-add',
privilege: AccessControlEnum.ADMINISTRATOR,
},
],
})}
{renderChange({
details: [
{
type: 'group-link-add',
privilege: AccessControlEnum.ADMINISTRATOR,
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
},
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
],
})}
</>
);
};
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
GroupLinkAdd.story = {
name: 'Group Link (Add)',
};
export const GroupLinkReset = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'group-link-reset',
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'group-link-reset',
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
},
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
],
})}
{renderChange({
details: [
{
type: 'group-link-reset',
},
],
})}
</>
);
};
Introduce new 'Block request' button in timeline
2022-03-16 00:11:28 +00:00
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
GroupLinkReset.story = {
name: 'Group Link (Reset)',
};
export const GroupLinkRemove = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'group-link-remove',
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'group-link-remove',
},
],
})}
{renderChange({
details: [
{
type: 'group-link-remove',
},
],
})}
</>
);
};
GroupLinkRemove.story = {
name: 'Group Link (Remove)',
};
export const DescriptionRemove = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
removed: true,
type: 'description',
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
removed: true,
type: 'description',
},
],
})}
{renderChange({
details: [
{
removed: true,
type: 'description',
},
],
})}
</>
);
};
DescriptionRemove.story = {
name: 'Description (Remove)',
};
export const DescriptionChange = (): JSX.Element => {
return (
<>
{renderChange(
{
Group Description: Edit/Receive
2021-06-02 00:24:28 +00:00
from: OUR_ID,
details: [
{
type: 'description',
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
description:
'This is a long description.\n\nWe need a dialog to view it all!\n\nIt has a link to https://example.com',
Group Description: Edit/Receive
2021-06-02 00:24:28 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{ groupName: 'We do hikes 🌲' }
)}
{renderChange(
{
Group Description: Edit/Receive
2021-06-02 00:24:28 +00:00
from: ADMIN_A,
details: [
{
type: 'description',
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
description:
'This is a long description.\n\nWe need a dialog to view it all!\n\nIt has a link to https://example.com',
Group Description: Edit/Receive
2021-06-02 00:24:28 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{ groupName: 'We do hikes 🌲' }
)}
{renderChange(
{
Group Description: Edit/Receive
2021-06-02 00:24:28 +00:00
details: [
{
type: 'description',
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
description:
'This is a long description.\n\nWe need a dialog to view it all!\n\nIt has a link to https://example.com',
Group Description: Edit/Receive
2021-06-02 00:24:28 +00:00
},
],
Upgrade react and storybook
2022-06-07 00:48:02 +00:00
},
{ groupName: 'We do hikes 🌲' }
)}
</>
);
};
DescriptionChange.story = {
name: 'Description (Change)',
};
export const AnnouncementGroupChange = (): JSX.Element => {
return (
<>
{renderChange({
from: OUR_ID,
details: [
{
type: 'announcements-only',
announcementsOnly: true,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'announcements-only',
announcementsOnly: true,
},
],
})}
{renderChange({
details: [
{
type: 'announcements-only',
announcementsOnly: true,
},
],
})}
{renderChange({
from: OUR_ID,
details: [
{
type: 'announcements-only',
announcementsOnly: false,
},
],
})}
{renderChange({
from: ADMIN_A,
details: [
{
type: 'announcements-only',
announcementsOnly: false,
},
],
})}
{renderChange({
details: [
{
type: 'announcements-only',
announcementsOnly: false,
},
],
})}
</>
);
};
AnnouncementGroupChange.story = {
name: 'Announcement Group (Change)',
};
Reference in a new issue Copy permalink