Подгонка regexp к серверной валидации

app/components/GroupDialog/GroupDialog.tsx

@@ -17,6 +17,8 @@ import { useDialogContextMenu } from "@/app/hooks/useDialogContextMenu";
 import { useDialogMute } from "@/app/providers/DialogStateProvider.tsx/useDialogMute";
 import { useDialogPin } from "@/app/providers/DialogStateProvider.tsx/useDialogPin";
 import { useMentions } from "@/app/providers/DialogStateProvider.tsx/useMentions";
+import { useProtocolState } from "@/app/providers/ProtocolProvider/useProtocolState";
+import { ProtocolState } from "@/app/providers/ProtocolProvider/ProtocolProvider";
 
 export interface DialogProps extends DialogRow {
     onClickDialog: (dialog: string) => void;
@@ -54,6 +56,7 @@ export function GroupDialog(props : DialogProps) {
     const currentDialogColor = computedTheme == 'dark' ? '#2a6292' :'#438fd1';
     const {openContextMenu} = useDialogContextMenu();
     const {isMentioned} = useMentions();
+    const [protocolState] = useProtocolState();
 
 
     useEffect(() => {
@@ -156,7 +159,7 @@ export function GroupDialog(props : DialogProps) {
                         {!loading && (lastMessage.delivered == DeliveredMessageState.ERROR || (!isMessageDeliveredByTime(lastMessage.timestamp, lastMessage.attachments.length) && lastMessage.delivered != DeliveredMessageState.DELIVERED)) && (
                             <IconAlertCircle stroke={3} size={15} color={colors.error}></IconAlertCircle>
                         )}
-                        {unreaded > 0 && !lastMessageFromMe && !isMentioned(props.dialog_id) && <Badge 
+                        {unreaded > 0 && !lastMessageFromMe && protocolState != ProtocolState.SYNCHRONIZATION && !isMentioned(props.dialog_id) && <Badge 
                             color={isInCurrentDialog ? 'white' : (isMuted ? colors.chevrons.active : colors.brandColor)} 
                             c={isInCurrentDialog ? colors.brandColor : 'white'} 
                             size={'sm'} circle={unreaded < 10}>{unreaded > 99 ? '99+' : unreaded}</Badge>}

app/components/MessageAttachments/MessageImage.tsx

@@ -150,7 +150,7 @@ export function MessageImage(props: AttachmentProps) {
                     </Box>
                     </Flex>
             </Portal>}
-            {(props.delivered == DeliveredMessageState.ERROR || (props.delivered != DeliveredMessageState.DELIVERED &&
+            {(props.delivered == DeliveredMessageState.ERROR || error || (props.delivered != DeliveredMessageState.DELIVERED &&
                 !isMessageDeliveredByTime(props.timestamp || 0, props.attachments.length)
             )) && (
                     <Overlay center h={'100%'} radius={8} color="#000" opacity={0.85}>

app/components/SettingsInput/SettingsInput.tsx

@@ -24,6 +24,8 @@ export interface SettingsInputDefaultProps {
     mt?: StyleProp<MantineSpacing>;
     rightSection?: ReactNode;
     type?: HTMLInputTypeAttribute;
+    onErrorStateChange?: (error: boolean) => void;
+    regexp?: RegExp;
 }
 export interface SettingsInputGroupProps {
     mt?: StyleProp<MantineSpacing>;
@@ -260,7 +262,6 @@ function SettingsInputClickable(
 function SettingsInputDefault(props : SettingsInputDefaultProps) {
     const colors = useRosettaColors();
     const input = useRef<any>(undefined);
-
     const onClick = (e : MouseEvent) => {
         e.stopPropagation();
         if(!props.disabled){
@@ -268,6 +269,19 @@ function SettingsInputDefault(props : SettingsInputDefaultProps) {
             return;
         }
     }
+
+    const onChange = (e) => {
+        let value = e.target.value;
+        if(props.regexp && !props.regexp.test(value)) {
+            props.onErrorStateChange && props.onErrorStateChange(true);
+            props.onChange && props.onChange(e);
+        }else{
+            props.onErrorStateChange && props.onErrorStateChange(false);
+            console.info('fa');
+            props.onChange && props.onChange(e);
+        }
+    }
+
     return (<>
         <Paper mt={props.mt} style={props.style} withBorder styles={{
                 root: {
@@ -298,7 +312,7 @@ function SettingsInputDefault(props : SettingsInputDefaultProps) {
                 {!props.rightSection && (
                     <Input type={props.type} defaultValue={!props.onChange ? props.value : undefined} value={!props.onChange ? undefined : props.value} ref={input} disabled={props.disabled} onClick={(e) => {
                          onClick(e)
-                    }} onChange={props.onChange} variant={'unstyled'} spellCheck={false} color="gray" classNames={{
+                    }} onChange={onChange} variant={'unstyled'} spellCheck={false} color="gray" classNames={{
                     input: classes.input
                 }} placeholder={props.placeholder}></Input>)
                 }

app/components/TextParser/TextParser.tsx

@@ -72,7 +72,7 @@ export function TextParser(props: TextParserProps) {
                 return <Anchor style={{
                     userSelect: 'auto',
                     color: props.__reserved_2 ? theme.colors.blue[2] : undefined
-                }} fz={14} href={match.startsWith('http') ? match : 'https://' + match} target="_blank" rel="noopener noreferrer">{match}</Anchor>;
+                }} fz={13} href={match.startsWith('http') ? match : 'https://' + match} target="_blank" rel="noopener noreferrer">{match}</Anchor>;
             },
             flush: (match: string) => {
                 return <>{match}</>;

app/components/UserButton/UserButton.tsx

@@ -5,15 +5,23 @@ import { useNavigate } from 'react-router-dom';
 import { useUserInformation } from '@/app/providers/InformationProvider/useUserInformation';
 import { usePublicKey } from '@/app/providers/AccountProvider/usePublicKey';
 import { useAvatars } from '@/app/providers/AvatarProvider/useAvatars';
+import { useEffect } from 'react';
 
 export function UserButton() {
     const navigate = useNavigate();
     const publicKey = usePublicKey();
-    const [userInfo] = useUserInformation(publicKey);
+    const [userInfo, _, forceUpdateUserInformation] = useUserInformation(publicKey);
     const avatars = useAvatars(publicKey);
 
     const loading = userInfo.publicKey !== publicKey;
 
+    useEffect(() => {
+        /**
+         * Обновляем информацию о пользователе принудительно при рендере левого меню
+         */
+        forceUpdateUserInformation();
+    }, []);
+
     return (
         <UnstyledButton p={'sm'} className={classes.user} onClick={() => navigate("/main/profile/me")}>
             <Group>

app/providers/AttachmentProvider/useAttachment.ts

@@ -36,7 +36,7 @@ export function useAttachment(attachment: Attachment, parentMessage: MessageProp
     const publicKey = usePublicKey();
     const privatePlain = usePrivatePlain();
     const {updateAttachmentInDialogCache} = useDialogsCache();
-    const {info} = useConsoleLogger('useAttachment');
+    const { info, error } = useConsoleLogger('useAttachment');
     const {updateAttachmentsInMessagesByAttachmentId} = useDialog();
     const {getDownloadsPath} = useCore();
     const {hasGroup} = useGroups();
@@ -137,8 +137,7 @@ export function useAttachment(attachment: Attachment, parentMessage: MessageProp
             downloadedBlob = await downloadFile(attachment.id,
                 downloadTag, attachment.transport.transport_server);
         } catch (e) {
-            console.info(e);
+            error("Error downloading attachment: " + attachment.id);
-            info("Error downloading attachment: " + attachment.id);
             setDownloadStatus(DownloadStatus.ERROR);
             return;
         } 

app/providers/AttachmentProvider/usePrepareAttachment.ts

@@ -17,7 +17,7 @@ export function usePrepareAttachment() {
     const {uploadFile} = useTransport();
     const {updateDialog} = useDialogsList();
     const {runQuery, getQuery} = useDatabase();
-    const {info} = useConsoleLogger('usePrepareAttachment');
+    const {info, error} = useConsoleLogger('usePrepareAttachment');
     const {getDialogCache} = useDialogsCache();
     const context = useContext(DialogContext);
     const transportServer = useTransportServer();
@@ -197,11 +197,19 @@ export function usePrepareAttachment() {
                 const upid = attachment.id;
                 info(`Uploading attachment with upid: ${upid}`);
                 info(`Attachment content length: ${content.length}`);
-                let tag = await uploadFile(upid, content);
+                let tag = await uploadFile(upid, content).catch(() => {
-                info(`Uploaded attachment with upid: ${upid}, received tag: ${tag}`);
+                    error(`Network error while uploading attachment ${upid}`);
-                if(intervalsRef.current != null){
+                });
-                    clearInterval(intervalsRef.current);
+                if(!tag){
+                    /**
+                     * При ошибке загрузки по сети
+                     */
+                    stopUpdateTimeInUpAttachment();
+                    console.info("stop upd")
+                    continue;
                 }
+                info(`Uploaded attachment with upid: ${upid}, received tag: ${tag}`);
+                stopUpdateTimeInUpAttachment();
                 const preparedAttachment : Attachment = {
                     ...attachment,
                     transport: {
@@ -220,6 +228,12 @@ export function usePrepareAttachment() {
         }
     }
 
+    const stopUpdateTimeInUpAttachment = () => {
+        if(intervalsRef.current != null){
+            clearInterval(intervalsRef.current);
+        }
+    }
+
     return {
         prepareAttachmentsToSend
     }

app/providers/DialogProvider/useDialog.ts

@@ -148,7 +148,10 @@ export function useDialog() : {
         console.info("Sending key for message ", key.toString('hex'));
         console.info(attachemnts);
         let preparedToNetworkSendAttachements : Attachment[] = await prepareAttachmentsToSend(messageId, dialog, key.toString('hex'), attachemnts);
-        if(attachemnts.length <= 0 && message.trim() == ""){
+        if(preparedToNetworkSendAttachements.length < attachemnts.length){
+            /**
+             * Если не удалось нормально загрузить все вложения - тогда не отправляем сообщение
+             */
             runQuery("UPDATE messages SET delivered = ? WHERE message_id = ?", [DeliveredMessageState.ERROR, messageId]);
             updateDialog(dialog);
             return;

app/views/Profile/MyProfile.tsx

@@ -1,4 +1,4 @@
-import { ColorSwatch, Text, useComputedColorScheme } from "@mantine/core";
+import { Button, ColorSwatch, Flex, Text, useComputedColorScheme } from "@mantine/core";
 import { SettingsInput } from "@/app/components/SettingsInput/SettingsInput";
 import { useState } from "react";
 import { Breadcrumbs } from "@/app/components/Breadcrumbs/Breadcrumbs";
@@ -17,6 +17,7 @@ import { SettingsIcon } from "@/app/components/SettingsIcon/SettingsIcon";
 import { IconBrush, IconHomeCog, IconLogout, IconRefresh } from "@tabler/icons-react";
 import { useLogout } from "@/app/providers/AccountProvider/useLogout";
 import { RosettaPower } from "@/app/components/RosettaPower/RosettaPower";
+import { modals } from "@mantine/modals";
 
 export function MyProfile() {
     const publicKey = usePublicKey();
@@ -28,8 +29,34 @@ export function MyProfile() {
     const navigate = useNavigate();
     const send = useSender();
     const logout = useLogout();
+    const [usernameError, setUsernameError] = useState(false);
+
+    const openProfileModal = (text : string) => {
+        modals.open({
+            centered: true,
+            children: (
+                <>
+                    <Text size="sm">
+                        {text}
+                    </Text>
+                    <Flex align={'center'} justify={'flex-end'}>
+                        <Button style={{
+                            outline: 'none'
+                        }} color={'red'} variant={'subtle'} onClick={() => modals.closeAll()} mt="md">
+                            Close
+                        </Button>
+                    </Flex>
+                </>
+            ),
+            withCloseButton: false
+        });        
+    }
 
     const saveProfileData = () => {
+        if(usernameError) {
+            openProfileModal("You enter invalid username. Username must be a latin chars in lowercase.");
+            return;
+        }
         let packet = new PacketUserInfo();
         packet.setUsername(username);
         packet.setTitle(title);
@@ -70,10 +97,13 @@ export function MyProfile() {
                     <SettingsInput.Default
                         hit="Username"
                         value={username}
+                        onErrorStateChange={(error) => setUsernameError(error)}
                         placeholder="ex. freddie871"
                         onChange={(e) => setUsername(e.target.value)}
+                        regexp={new RegExp(/^([a-z][a-z0-9_]{4,15})?$/)}
                     ></SettingsInput.Default>
                 </SettingsInput.Group>
+                {usernameError && <Text c={'red'} fz={10} pl={'xs'} mt={3}>Invalid username.</Text>}
                 <SettingsInput.Copy mt={'sm'} hit="Public Key" value={
                     publicKey
                 } placeholder="Public"></SettingsInput.Copy>