revite

revite copied to clipboard

What happened?

Issue

Where https://app.revolt.chat/server/<ServerID>/settings/categories

When on Firefox and Edge, Adding Categories text input cancels with an empty string during category creation.

How to recreate Click the + for a new Category Erase all text from input State changes out of editing

--- Version a190a51 (master)Nightly 0.5.3-7API: 0.5.3-7revolt.js: 6.0.2

Branch

Production (app.revolt.chat)

Commit hash

a190a51d0b597370e66de96f7c94592debb7705c

What browsers are you seeing the problem on?

Firefox, Microsoft Edge

Relevant log output

No response

Desktop

• [ ] Yes, this bug is specific to Revolt Desktop and is not an issue with Revolt Desktop itself.

PWA

• [ ] Yes, this bug is specific to the PWA.

I believe that this is happening under the /src/pages/settings/server/Categories.tsx

At line 334 setTitle?: (title: string) => void; Does not permit a nullable string at any point. My guess is that once the edited value reaches empty, it exits the function for editing without saving and returns to the previous state.

If this is the case, then it should be possible to prevent the state from changing to saved if null, but allow it if !null

I believe the issue is in line 375 https://github.com/revoltchat/revite/blob/a190a51d0b597370e66de96f7c94592debb7705c/src/pages/settings/server/Categories.tsx#L375-L392 where the input element goes back to a span if editing (which holds the current category title) is falsy, and an empty string is falsy

Changing line 375 from editing ? to editing !== undefined ? solves the issue, but it makes it possible to submit an empty string as a category name which is invalid.

Replacing the current save() function https://github.com/revoltchat/revite/blob/a190a51d0b597370e66de96f7c94592debb7705c/src/pages/settings/server/Categories.tsx#L345-L348 with the following:

const save = useCallback(() => {
    setEditing(undefined);
    if (editing !== "") {
        setTitle!(editing!);
    }
}, [editing, setTitle]);

solves the empty string submission issue.

an alternative would be:

const save = useCallback(() => {
    setEditing(undefined);
    if (editing) {
        setTitle!(editing);
    }
}, [editing, setTitle]);

but I believe the first one is clearer.

---

Another bug is that entering any category name then switching to edit another category name does save() the name, except if the name is empty, then the UI keeps the category name as empty but it never submits it, and that's because of the following: https://github.com/revoltchat/revite/blob/a190a51d0b597370e66de96f7c94592debb7705c/src/pages/settings/server/Categories.tsx#L351 which should be changed to

if (editing === undefined) return;

Preview:

Closing due to rewrite, marking as potential issue in future by linking to https://github.com/revoltchat/frontend/issues/134.