fix #7930 -- chat: sometimes when you try to edit the message you jus…

…t wrote, it is blank
sagemathinc · Oct 12, 2024 · 427e813 · 427e813
1 parent b94d7a7
commit 427e813
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 9 deletions.
diff --git a/src/packages/frontend/chat/input.tsx b/src/packages/frontend/chat/input.tsx
@@ -67,7 +67,8 @@ export default function ChatInput({
  [],
  );
 
- const [input, setInput] = useState<string>(() => {
+ const [input, setInput] = useState<string>("");
+ useEffect(() => {
  const dbInput = syncdb
  ?.get_one({
  event: "draft",
@@ -79,9 +80,9 @@ export default function ChatInput({
  // the db version is used when you refresh your browser while editing, or scroll up and down
  // thus unmounting and remounting the currently editing message (due to virtualization).
  // See https://github.com/sagemathinc/cocalc/issues/6415
- const input = dbInput ?? propsInput;
-  return input;
- });
+ setInput(dbInput ?? propsInput);
+ }, [date, sender_id, propsInput]);
+
  const currentInputRef = useRef<string>(input);
  const saveOnUnmountRef = useRef<boolean>(true);
 

diff --git a/src/packages/frontend/chat/message.tsx b/src/packages/frontend/chat/message.tsx
@@ -54,11 +54,10 @@ const DELETE_BUTTON = false;
 const BLANK_COLUMN = (xs) => <Col key={"blankcolumn"} xs={xs}></Col>;
 
 const MARKDOWN_STYLE = undefined;
-// const MARKDOWN_STYLE = { maxHeight: "300px", overflowY: "auto" };
 
 const BORDER = "2px solid #ccc";
 
-const SHOW_EDIT_BUTTON_MS = 45000;
+const SHOW_EDIT_BUTTON_MS = 15000;
 
 const TRHEAD_STYLE_SINGLE: CSS = {
  marginLeft: "15px",
@@ -448,7 +447,13 @@ export default function Message(props: Readonly<Props>) {
  <Space direction="horizontal" size="small" wrap>
  {showEditButton ? (
  <Tooltip
- title="Edit this message. You can edit any past message by anybody at any time by double clicking on it. Previous versions are in the history."
+ title={
+ <>
+ Edit this message. You can edit <b>any</b> past message at
+ any time by double clicking on it. Fix other people's typos.
+ All versions are stored.
+ </>
+ }
  placement="left"
  >
  <Button
@@ -613,7 +618,7 @@ export default function Message(props: Readonly<Props>) {
  <Icon
  name="thumbs-up"
  style={{
- color: showOtherFeedback ? "darkred" : undefined,
+ color: showOtherFeedback ? "darkblue" : undefined,
  }}
  />
  </Button>
@@ -627,7 +632,6 @@ export default function Message(props: Readonly<Props>) {
  size="small"
  type={"text"}
  style={{
- marginRight: "5px",
  float: "right",
  marginTop: "-4px",
  color: is_viewers_message ? "white" : "#888",