diff --git a/packages/desktop/CHANGELOG.md b/packages/desktop/CHANGELOG.md index 4f3cc56e31..b507b626ad 100644 --- a/packages/desktop/CHANGELOG.md +++ b/packages/desktop/CHANGELOG.md @@ -1,19 +1,3 @@ -# Change Log - -All notable changes to this project will be documented in this file. -See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. - -## [2.2.1-alpha.1](https://github.com/TryQuiet/quiet/compare/@quiet/desktop@2.2.1-alpha.0...@quiet/desktop@2.2.1-alpha.1) (2024-07-29) - - -### Bug Fixes - -* **2576:** Update hover and selected contrast and modify sidebar color in dark mode ([#2579](https://github.com/TryQuiet/quiet/issues/2579)) ([d7bf1b9](https://github.com/TryQuiet/quiet/commit/d7bf1b938bce3096fbb9a67296fdca3fc4a157dc)) - - - - - [unreleased] # New features: @@ -33,6 +17,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline * Fixes issue with reconnecting to peers on resume on iOS ([#2424](https://github.com/TryQuiet/quiet/issues/2424)) * Fixes references to 'invite code' to be 'invite link' in UI ([#2441](https://github.com/TryQuiet/quiet/issues/2441)) * Fixes issue with image messages not displaying/throwing errors on iOS ([#2526](https://github.com/TryQuiet/quiet/issues/2526)) +* Removing parsing from channel and community naming ([#2302](https://github.com/TryQuiet/quiet/issues/2302)) # Chores diff --git a/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannel.test.tsx b/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannel.test.tsx index 02f457fb6d..58571122e0 100644 --- a/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannel.test.tsx +++ b/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannel.test.tsx @@ -67,7 +67,7 @@ describe('Add new channel', () => { function* testSubmittedChannelName(): Generator { const createChannelAction = yield* take(publicChannels.actions.createChannel) - expect(createChannelAction.payload.channel.name).toEqual('some-channel-name--') + expect(createChannelAction.payload.channel.name).toEqual('Some channel NAME ') } }) @@ -87,26 +87,4 @@ describe('Add new channel', () => { await userEvent.type(input, 'happy-path') expect(warning).toBeNull() }) - - it.each([ - ['UpperCaseToLowerCase', 'uppercasetolowercase'], - ['spaces to hyphens', 'spaces-to-hyphens'], - ['!@#$%^&*()', '----------'], - ])('user inserting wrong channel name "%s" gets corrected "%s"', async (name: string, corrected: string) => { - renderComponent( - {}} - handleClose={() => {}} - clearErrorsDispatch={() => {}} - /> - ) - - const input = screen.getByPlaceholderText('Enter a channel name') - - await userEvent.type(input, name) - expect(screen.getByTestId('createChannelNameWarning')).toHaveTextContent( - `Your channel will be created as #${corrected}` - ) - }) }) diff --git a/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannelComponent.tsx b/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannelComponent.tsx index 7d43e11e55..08aeeea447 100644 --- a/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannelComponent.tsx +++ b/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannelComponent.tsx @@ -1,19 +1,15 @@ -import React, { useState } from 'react' +import React, { useEffect } from 'react' import { styled } from '@mui/material/styles' import { Controller, useForm } from 'react-hook-form' import { Grid, Typography } from '@mui/material' -import WarningIcon from '@mui/icons-material/Warning' - import Modal from '../../ui/Modal/Modal' import LoadingButton from '../../ui/LoadingButton/LoadingButton' import { TextField } from '../../ui/TextField/TextField' import { channelNameField } from '../../../forms/fields/createChannelFields' -import { parseName } from '@quiet/common' - const PREFIX = 'CreateChannelComponent' const classes = { @@ -21,12 +17,6 @@ const classes = { gutter: `${PREFIX}gutter`, button: `${PREFIX}button`, title: `${PREFIX}title`, - iconDiv: `${PREFIX}iconDiv`, - warningIcon: `${PREFIX}warningIcon`, - warningMessage: `${PREFIX}warningMessage`, - rootBar: `${PREFIX}rootBar`, - progressBar: `${PREFIX}progressBar`, - info: `${PREFIX}info`, } const StyledModalContent = styled(Grid)(({ theme }) => ({ @@ -58,35 +48,6 @@ const StyledModalContent = styled(Grid)(({ theme }) => ({ [`& .${classes.title}`]: { marginBottom: 24, }, - - [`& .${classes.iconDiv}`]: { - width: 24, - height: 28, - marginRight: 8, - }, - - [`& .${classes.warningIcon}`]: { - color: theme.palette.warning.main, - }, - - [`& .${classes.warningMessage}`]: { - wordBreak: 'break-word', - }, - - [`& .${classes.rootBar}`]: { - width: 350, - marginTop: 32, - marginBottom: 16, - }, - - [`& .${classes.progressBar}`]: { - backgroundColor: theme.palette.colors.linkBlue, - }, - - [`& .${classes.info}`]: { - lineHeight: '19px', - color: theme.palette.colors.darkGray, - }, })) const createChannelFields = { @@ -112,9 +73,6 @@ export const CreateChannelComponent: React.FC = ({ handleClose, clearErrorsDispatch, }) => { - const [channelName, setChannelName] = useState('') - const [parsedNameDiffers, setParsedNameDiffers] = useState(false) - const { handleSubmit, formState: { errors }, @@ -131,33 +89,29 @@ export const CreateChannelComponent: React.FC = ({ } const submitForm = (handleSubmit: (value: string) => void, values: CreateChannelFormValues) => { - handleSubmit(parseName(values.channelName)) + handleSubmit(values.channelName) } const onChange = (name: string) => { setValue('channelName', name) - const parsedName = parseName(name) - setChannelName(parsedName) - setParsedNameDiffers(name !== parsedName) } - React.useEffect(() => { + useEffect(() => { if (!open) { setValue('channelName', '') - setChannelName('') clearErrors() clearErrorsDispatch() } }, [open]) - React.useEffect(() => { + useEffect(() => { if (channelCreationError) { setError('channelName', { message: channelCreationError }) } }, [channelCreationError]) return ( - +
@@ -167,16 +121,16 @@ export const CreateChannelComponent: React.FC = ({ Channel name ( { @@ -190,28 +144,11 @@ export const CreateChannelComponent: React.FC = ({ field.onBlur() }} value={field.value} - data-testid={'createChannelInput'} + data-testid='createChannelInput' /> )} /> -
- {!errors.channelName && channelName.length > 0 && parsedNameDiffers && ( - - - - - - - Your channel will be created as {`#${channelName}`} - - - - )} -
+
{ await waitFor(() => expect(handleCommunityAction).toBeCalledWith(communityName)) }) - it.each([ - ['UpperCaseToLowerCase', 'uppercasetolowercase'], - ['spaces to hyphens', 'spaces-to-hyphens'], - ['!@#$%^&*()', '----------'], - ])('user inserting wrong community name "%s" gets corrected "%s"', async (name: string, corrected: string) => { - renderComponent( - {}} - communityOwnership={CommunityOwnership.Owner} - handleCommunityAction={() => {}} - handleRedirection={() => {}} - isConnectionReady={true} - isCloseDisabled={true} - hasReceivedResponse={false} - /> - ) - - const input = screen.getByPlaceholderText('Community name') - - await userEvent.type(input, name) - expect(screen.getByTestId('createCommunityNameWarning')).toHaveTextContent( - `Your community will be created as #${corrected}` - ) - }) - it('user inserting invalid community name should see an error', async () => { const handleCommunityAction = jest.fn() const name = 'too-long-community-name' diff --git a/packages/desktop/src/renderer/components/CreateJoinCommunity/PerformCommunityActionComponent.tsx b/packages/desktop/src/renderer/components/CreateJoinCommunity/PerformCommunityActionComponent.tsx index 4a7b91aedd..a6d469e9b2 100644 --- a/packages/desktop/src/renderer/components/CreateJoinCommunity/PerformCommunityActionComponent.tsx +++ b/packages/desktop/src/renderer/components/CreateJoinCommunity/PerformCommunityActionComponent.tsx @@ -5,14 +5,12 @@ import classNames from 'classnames' import Typography from '@mui/material/Typography' import Grid from '@mui/material/Grid' -import WarningIcon from '@mui/icons-material/Warning' - import Modal from '../ui/Modal/Modal' import { LoadingButton } from '../ui/LoadingButton/LoadingButton' import { CreateCommunityDictionary, JoinCommunityDictionary } from '../CreateJoinCommunity/community.dictionary' -import { CommunityOwnership, ErrorPayload } from '@quiet/types' +import { CommunityOwnership } from '@quiet/types' import { Controller, useForm } from 'react-hook-form' import { TextField } from '../ui/TextField/TextField' @@ -20,7 +18,6 @@ import { InviteLinkErrors } from '../../forms/fieldsErrors' import { IconButton, InputAdornment } from '@mui/material' import VisibilityOff from '@mui/icons-material/VisibilityOff' import Visibility from '@mui/icons-material/Visibility' -import { parseName } from '@quiet/common' import { getInvitationCodes } from '@quiet/state-manager' import { createLogger } from '../../logger' @@ -36,12 +33,6 @@ const classes = { gutter: `${PREFIX}gutter`, button: `${PREFIX}button`, title: `${PREFIX}title`, - iconDiv: `${PREFIX}iconDiv`, - warrningIcon: `${PREFIX}warrningIcon`, - warrningMessage: `${PREFIX}warrningMessage`, - rootBar: `${PREFIX}rootBar`, - progressBar: `${PREFIX}progressBar`, - info: `${PREFIX}info`, } const StyledModalContent = styled(Grid)(({ theme }) => ({ @@ -94,35 +85,6 @@ const StyledModalContent = styled(Grid)(({ theme }) => ({ [`& .${classes.title}`]: { marginBottom: 24, }, - - [`& .${classes.iconDiv}`]: { - width: 24, - height: 28, - marginRight: 8, - }, - - [`& .${classes.warrningIcon}`]: { - color: theme.palette.warning.main, - }, - - [`& .${classes.warrningMessage}`]: { - wordBreak: 'break-word', - }, - - [`& .${classes.rootBar}`]: { - width: 350, - marginTop: 32, - marginBottom: 16, - }, - - [`& .${classes.progressBar}`]: { - backgroundColor: theme.palette.colors.linkBlue, - }, - - [`& .${classes.info}`]: { - lineHeight: '19px', - color: theme.palette.colors.darkGray, - }, })) interface PerformCommunityActionFormValues { @@ -156,9 +118,6 @@ export const PerformCommunityActionComponent: React.FC { const [formSent, setFormSent] = useState(false) - const [communityName, setCommunityName] = useState('...') - const [parsedNameDiffers, setParsedNameDiffers] = useState(false) - const waitingForResponse = formSent && !hasReceivedResponse const dictionary = @@ -186,7 +145,7 @@ export const PerformCommunityActionComponent: React.FC { if (communityOwnership === CommunityOwnership.Owner) { setFormSent(true) - handleSubmit(parseName(values.name)) + handleSubmit(values.name) return } @@ -210,16 +169,12 @@ export const PerformCommunityActionComponent: React.FC { if (communityOwnership === CommunityOwnership.User) return - // Check community name against naming policy if user creates community - const parsedName = parseName(name) - setCommunityName(parsedName) - setParsedNameDiffers(name !== parsedName) + setValue('name', name) } useEffect(() => { if (!open) { setValue('name', '') - setCommunityName('') clearErrors('name') } }, [open]) @@ -236,9 +191,9 @@ export const PerformCommunityActionComponent: React.FC{dictionary.label} ( -
- {!errors.name && communityName.length > 0 && parsedNameDiffers && ( - - - - - - - Your community will be created as {`#${communityName}`} - - - - )} -
+
{dictionary.redirection} diff --git a/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsListItem.tsx b/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsListItem.tsx index 920acbc359..d9dce2469a 100644 --- a/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsListItem.tsx +++ b/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsListItem.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useRef } from 'react' +import React, { useRef } from 'react' import { styled } from '@mui/material/styles' import classNames from 'classnames' import { Typography, Grid, ListItemButton } from '@mui/material' @@ -51,7 +51,6 @@ const StyledListItemButton = styled(ListItemButton)(({ theme }) => ({ textOverflow: 'ellipsis', maxWidth: 215, whiteSpace: 'nowrap', - textTransform: 'lowercase', }, [`& .${classes.newMessages}`]: { diff --git a/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsPanel.test.tsx b/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsPanel.test.tsx index cea9516723..e75b455b15 100644 --- a/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsPanel.test.tsx +++ b/packages/desktop/src/renderer/components/Sidebar/ChannelsPanel/ChannelsPanel.test.tsx @@ -134,7 +134,7 @@ describe('Channels panel', () => { data-testid="channelsList" >
{ />
{ />
{ />
{ />
{ />
{ data-testid="channelsList" >
{ />
{ />
{ />
{ />
{ />
{ data-testid="channelsList" >
{ value: 20, message: CommunityNameErrors.NameTooLong, }, - pattern: { - value: /^[-a-zA-Z0-9 ]+$/g, - message: CommunityNameErrors.WrongCharacter, - }, }, } } diff --git a/packages/desktop/src/renderer/forms/fieldsErrors.ts b/packages/desktop/src/renderer/forms/fieldsErrors.ts index d0bd9ceb9d..d9562e1fc8 100644 --- a/packages/desktop/src/renderer/forms/fieldsErrors.ts +++ b/packages/desktop/src/renderer/forms/fieldsErrors.ts @@ -9,7 +9,6 @@ export enum UsernameErrors { export enum CommunityNameErrors { NameTooLong = 'Community name must have less than 20 characters', - WrongCharacter = 'Community name must be lowercase and cannot contain any special characters', } export enum InviteLinkErrors { @@ -18,5 +17,4 @@ export enum InviteLinkErrors { export enum ChannelNameErrors { NameTooLong = 'Channel name must have less than 20 characters', - WrongCharacter = 'Channel name cannot contain any special characters', } diff --git a/packages/desktop/src/rtl-tests/channel.add.test.tsx b/packages/desktop/src/rtl-tests/channel.add.test.tsx index f46b81f31d..cfce741181 100644 --- a/packages/desktop/src/rtl-tests/channel.add.test.tsx +++ b/packages/desktop/src/rtl-tests/channel.add.test.tsx @@ -90,7 +90,7 @@ describe('Add new channel', () => { const alice = await factory.create['payload']>('Identity', { nickname: 'alice', }) - const channelName = { input: 'my-Super Channel ', output: 'my-super-channel-' } + const channelName = { input: 'my-Super Channel ', output: 'my-Super Channel ' } const mockImpl = async (...input: [SocketActionTypes, ...socketEventData<[any]>]) => { const action = input[0] @@ -161,7 +161,12 @@ describe('Add new channel', () => { expect(createChannelModal).toBeNull() // Check if newly created channel is present and selected - expect(screen.getByTestId('channelTitle')).toHaveTextContent(`#${channelName.output}`) + console.log( + screen.getByTestId('channelTitle').textContent, + `#${channelName.output}`, + screen.getByTestId('channelTitle').textContent === `#${channelName.output}` + ) + expect(screen.getByTestId('channelTitle').textContent).toEqual(`#${channelName.output}`) // Check if sidebar item displays as selected const link = screen.getByTestId(`${channelName.output}-link`) expect(link).toHaveClass('ChannelsListItemselected') @@ -290,7 +295,7 @@ describe('Add new channel', () => { expect(isErrorStillExist).toBeNull() }) - it('Bug reproduction - create channel and open modal again without requierd field error', async () => { + it('Bug reproduction - create channel and open modal again without required field error', async () => { const channelName = 'las-venturas' const { store, runSaga } = await prepareStore( diff --git a/packages/mobile/CHANGELOG.md b/packages/mobile/CHANGELOG.md index 7cb8981663..28b464b865 100644 --- a/packages/mobile/CHANGELOG.md +++ b/packages/mobile/CHANGELOG.md @@ -1,16 +1,3 @@ -# Change Log - -All notable changes to this project will be documented in this file. -See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. - -## [2.2.1-alpha.1](https://github.com/TryQuiet/quiet/compare/@quiet/mobile@2.2.1-alpha.0...@quiet/mobile@2.2.1-alpha.1) (2024-07-29) - -**Note:** Version bump only for package @quiet/mobile - - - - - [unreleased] # New features: @@ -30,6 +17,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline * Fixes issue with reconnecting to peers on resume on iOS ([#2424](https://github.com/TryQuiet/quiet/issues/2424)) * Fixes references to 'invite code' to be 'invite link' in UI ([#2441](https://github.com/TryQuiet/quiet/issues/2441)) * Fixes issue with image messages not displaying/throwing errors on iOS ([#2526](https://github.com/TryQuiet/quiet/issues/2526)) +* * Removing parsing from channel and community naming ([#2302](https://github.com/TryQuiet/quiet/issues/2302)) # Chores diff --git a/packages/mobile/src/components/CreateChannel/CreateChannel.component.tsx b/packages/mobile/src/components/CreateChannel/CreateChannel.component.tsx index 4ce31cc5a8..9223882edd 100644 --- a/packages/mobile/src/components/CreateChannel/CreateChannel.component.tsx +++ b/packages/mobile/src/components/CreateChannel/CreateChannel.component.tsx @@ -1,17 +1,13 @@ import React, { FC, useState, useRef, useEffect } from 'react' -import { Keyboard, KeyboardAvoidingView, TextInput, View, Image } from 'react-native' +import { Keyboard, KeyboardAvoidingView, TextInput, View } from 'react-native' import { defaultTheme } from '../../styles/themes/default.theme' -import { Typography } from '../Typography/Typography.component' import { Input } from '../Input/Input.component' import { Button } from '../Button/Button.component' -import { parseName } from '@quiet/common' import { Appbar } from '../Appbar/Appbar.component' -import { appImages } from '../../assets' - export interface CreateChannelProps { createChannelAction: (name: string) => void channelCreationError?: string @@ -26,7 +22,6 @@ export const CreateChannel: FC = ({ handleBackButton, }) => { const [createChannelInput, setCreateChannelInput] = useState() - const [parsedNameDiffers, setParsedNameDiffers] = useState(false) const [inputError, setInputError] = useState() const [loading, setLoading] = useState(false) @@ -35,12 +30,7 @@ export const CreateChannel: FC = ({ const onChangeText = (value: string) => { setInputError(undefined) - // inputRef.current?.setNativeProps({ text: value }) - - const parsedName = parseName(value) - - setCreateChannelInput(parsedName) - setParsedNameDiffers(value !== parsedName) + setCreateChannelInput(value) } const onPress = () => { @@ -70,14 +60,9 @@ export const CreateChannel: FC = ({ } }, [clearComponent]) - const warning_icon = appImages.icon_warning - return ( - - + + = ({ > - {!inputError && - createChannelInput?.length !== undefined && - createChannelInput.length > 0 && - parsedNameDiffers && ( - - - - - - {'Your channel will be created as'} - - {`#${createChannelInput}`} - - - - )} -