Feature/channel deletion mobile

packages/backend/src/registration/functions.ts

@@ -166,7 +166,7 @@ export const sendCertificateRegistrationRequest = async (
  }
  }
 
- const registrarResponse: { certificate: string; peers: string[]; rootCa: string, ownerCert: string } =
+ const registrarResponse: { certificate: string; peers: string[]; rootCa: string; ownerCert: string } =
  await response.json()
 
  log(`Sending user certificate (${communityId})`)

packages/backend/src/storage/storage.ts

@@ -275,7 +275,7 @@ export class Storage extends EventEmitter {
  const isDeleted = !Object.keys(this.channels.all).includes(e as string)
  if (isDeleted) {
  console.log('deleting channel')
- this.deleteChannel({channel: e})
+ void this.deleteChannel({ channel: e })
  }
  })
 
@@ -491,7 +491,7 @@ export class Storage extends EventEmitter {
  await this.channels.load({ fetchEntryTimeout: 15000 })
  const channel = this.channels.get(payload.channel)
  if (channel) {
- this.channels.del(payload.channel)
+ void this.channels.del(payload.channel)
  }
  // Send message to channel that it has been deleted, but how to ensure that everyone replicated
  // Create special channel for mod messages

packages/desktop/src/renderer/components/Channel/DeleteChannel/DeleteChannel.tsx

@@ -13,7 +13,7 @@ export const DeleteChannel: FC = () => {
  const dispatch = useDispatch()
 
  const deleteChannel = useCallback(() => {
- dispatch(publicChannels.actions.deleteChannel({channel: channel.name}))
+ dispatch(publicChannels.actions.deleteChannel({ channel: channel.name }))
  modal.handleClose() // Close self
  }, [modal])
 

packages/desktop/src/rtl-tests/community.create.test.tsx

@@ -182,6 +182,7 @@ describe('User', () => {
  "Network/setLoadingPanelType",
  "Modals/openModal",
  "Identity/registerCertificate",
+ "Communities/addOwnerCertificate",
  "Communities/storePeerList",
  "Identity/storeUserCertificate",
  "Identity/savedOwnerCertificate",

packages/desktop/src/rtl-tests/community.join.test.tsx

@@ -196,6 +196,7 @@ describe('User', () => {
  "Network/setLoadingPanelType",
  "Modals/openModal",
  "Identity/registerCertificate",
+ "Communities/addOwnerCertificate",
  "Communities/storePeerList",
  "Identity/storeUserCertificate",
  "Communities/updateCommunity",

packages/desktop/src/rtl-tests/customProtocol.test.tsx

@@ -35,7 +35,8 @@ describe('Opening app through custom protocol', () => {
  onionAddress: '',
  privateKey: '',
  port: 0,
- registrationAttempts: 0
+ registrationAttempts: 0,
+ ownerCertificate: ''
  }
 
  const _identity: Partial<Identity> = {

packages/mobile/e2e/starter.test.js

@@ -106,10 +106,27 @@ describe('User', () => {
  await waitFor(element(by.id('chat_roll')))
  .toBeVisible()
  .withTimeout(5000)
+
+ await element(by.id('appbar_action_item')).longPress()
+ })
+
+ test.skip('deletes channel', async () => {
+ await element(by.text('#roll')).swipe('right')
+
+ await element(by.text('Delete')).longPress()
+
+ await waitFor(element(by.text('Are you sure?')))
+ .toBeVisible()
+ .withTimeout(5000)
+
+ await element(by.text('Delete channel')).longPress()
+
+ await waitFor(element(by.id('channels_list')))
+ .toBeVisible()
+ .withTimeout(5000)
  })
 
  test('leaves community', async () => {
- await element(by.id('appbar_action_item')).longPress()
  await element(by.id('open_menu')).longPress()
 
  await element(by.id('Leave community')).longPress()

packages/mobile/package.json

@@ -127,7 +127,8 @@
  "<rootDir>/codegen/"
  ],
  "setupFiles": [
- "./src/setupTests.ts"
+ "./src/setupTests.ts",
+ "./node_modules/react-native-gesture-handler/jestSetup.js"
  ],
  "setupFilesAfterEnv": [
  "@testing-library/jest-native/extend-expect"

packages/mobile/src/App.tsx

@@ -22,6 +22,7 @@ import { ErrorScreen } from './screens/Error/Error.screen'
 import { ChannelListScreen } from './screens/ChannelList/ChannelList.screen'
 import { ChannelScreen } from './screens/Channel/Channel.screen'
 import { CreateChannelScreen } from './screens/CreateChannel/CreateChannel.screen'
+import { DeleteChannelScreen } from './screens/DeleteChannel/DeleteChannel.screen'
 import { QRCodeScreen } from './screens/QRCode/QRCode.screen'
 import { LeaveCommunityScreen } from './screens/LeaveCommunity/LeaveCommunity.screen'
 
@@ -99,6 +100,7 @@ export default function App(): JSX.Element {
  <Screen component={ChannelListScreen} name={ScreenNames.ChannelListScreen} />
  <Screen component={ChannelScreen} name={ScreenNames.ChannelScreen} />
  <Screen component={CreateChannelScreen} name={ScreenNames.CreateChannelScreen} />
+ <Screen component={DeleteChannelScreen} name={ScreenNames.DeleteChannelScreen} />
  <Screen component={QRCodeScreen} name={ScreenNames.QRCodeScreen} />
  <Screen component={SuccessScreen} name={ScreenNames.SuccessScreen} />
  <Screen component={ErrorScreen} name={ScreenNames.ErrorScreen} />

packages/mobile/src/components/ChannelList/ChannelList.component.tsx

@@ -7,21 +7,38 @@ import { ChannelTile } from '../ChannelTile/ChannelTile.component'
 import { Spinner } from '../Spinner/Spinner.component'
 import { capitalizeFirstLetter } from '@quiet/common'
 
-export const ChannelList: FC<ChannelListProps> = ({ community, tiles, communityContextMenu }) => {
+export const ChannelList: FC<ChannelListProps> = ({
+ community,
+ tiles,
+ communityContextMenu,
+ deleteChannel,
+ enableDeletion = false
+}) => {
  let communityName = ''
  if (community?.name) {
  communityName = capitalizeFirstLetter(community.name)
  }
  return (
  <View style={{ flex: 1 }}>
- <Appbar title={capitalizeFirstLetter(community?.name)} position={'flex-start'} contextMenu={communityContextMenu} />
+ <Appbar
+ title={capitalizeFirstLetter(community?.name)}
+ position={'flex-start'}
+ contextMenu={communityContextMenu}
+ />
  {tiles.length === 0 ? (
- <Spinner description='Connecting to peers'/>
+ <Spinner description='Connecting to peers' />
  ) : (
  <FlatList
  data={tiles}
  keyExtractor={item => item.name}
- renderItem={({ item }) => <ChannelTile {...item} />}
+ renderItem={({ item }) => <ChannelTile {...item} deleteChannel={deleteChannel} enableDeletion={enableDeletion} />}
+ ItemSeparatorComponent={() => {
+ return (
+ <View
+ style={{ height: 1, backgroundColor: defaultTheme.palette.background.gray06 }}
+ />
+ )
+ }}
  style={{ backgroundColor: defaultTheme.palette.background.white }}
  testID={'channels_list'}
  />

packages/mobile/src/components/ChannelList/ChannelList.stories.tsx

@@ -17,7 +17,9 @@ storiesOf('ChannelList', module).add('Default', () => (
  'Text from latest chat message. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Id massa venenatis id eget massa commodo posuere faucibus aliquam. At scelerisque nisi mauris facilisis.',
  date: '1:55pm',
  unread: false,
- redirect: (address: string) => { console.log(`Clicked ${address}`) }
+ redirect: (address: string) => { console.log(`Clicked ${address}`) },
+ deleteChannel: (channel: string) => { console.log(`Deleted channel ${channel}`) },
+ enableDeletion: true
  },
  {
  name: 'spam',
@@ -26,7 +28,9 @@ storiesOf('ChannelList', module).add('Default', () => (
  'Text from latest chat message. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Id massa venenatis id eget massa commodo posuere faucibus aliquam. At scelerisque nisi mauris facilisis.',
  date: '1:55pm',
  unread: false,
- redirect: (address: string) => { console.log(`Clicked ${address}`) }
+ redirect: (address: string) => { console.log(`Clicked ${address}`) },
+ deleteChannel: (channel: string) => { console.log(`Deleted channel ${channel}`) },
+ enableDeletion: true
  },
  {
  name: 'design',
@@ -35,7 +39,9 @@ storiesOf('ChannelList', module).add('Default', () => (
  'Text from latest chat message. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Id massa venenatis id eget massa commodo posuere faucibus aliquam. At scelerisque nisi mauris facilisis.',
  date: '6/1/22',
  unread: true,
- redirect: (address: string) => { console.log(`Clicked ${address}`) }
+ redirect: (address: string) => { console.log(`Clicked ${address}`) },
+ deleteChannel: (channel: string) => { console.log(`Deleted channel ${channel}`) },
+ enableDeletion: true
  },
  {
  name: 'qa',
@@ -44,7 +50,9 @@ storiesOf('ChannelList', module).add('Default', () => (
  'Text from latest chat message. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Id massa venenatis id eget massa commodo posuere faucibus aliquam. At scelerisque nisi mauris facilisis.',
  date: 'Yesterday',
  unread: false,
- redirect: (address: string) => { console.log(`Clicked ${address}`) }
+ redirect: (address: string) => { console.log(`Clicked ${address}`) },
+ deleteChannel: (channel: string) => { console.log(`Deleted channel ${channel}`) },
+ enableDeletion: true
  }
  ]}
  />