Merge branch 'master' into course

src/packages/frontend/account/upgrades/upgrades-page.tsx

@@ -46,8 +46,13 @@ class UpgradesPage extends Component<reduxProps> {
  return (
  <div>
  <h3>Upgrades are no longer available</h3>
- Please visit <A href={join(appBasePath, "store")}>the new store</A> and
- the <A href="https://cocalc.com/pricing">pricing pages</A>.
+ Please visit <A href={join(appBasePath, "store")}>
+ the new store
+ </A>, explore <A href={join(appBasePath, "pricing")}>our products</A>, or{" "}
+ <A href={join(appBasePath, "billing/subscriptions")}>
+ view your legacy upgrade subscriptions
+ </A>
+ .
  <Footer />
  </div>
  );
@@ -179,15 +184,17 @@ class UpgradesPage extends Component<reduxProps> {
  redux.getActions("projects").load_all_projects();
  return <Loading theme={"medium"} />;
  }
- if (!DEBUG && !this.props.stripe_customer?.getIn(["subscriptions", "total_count"])) {
+ if (
+ !DEBUG &&
+ !this.props.stripe_customer?.getIn(["subscriptions", "total_count"])
+ ) {
  return this.render_no_upgrades();
  } else {
  return (
  <div>
  {this.render_have_upgrades()}
  {this.render_upgrades()}
  <ProjectUpgradesTable />
- <Footer />
  </div>
  );
  }

src/packages/frontend/chat/input.tsx

@@ -66,8 +66,9 @@ export default function ChatInput({
  () => redux.getStore("account").get_account_id(),
  [],
  );
-
- const [input, setInput] = useState<string>(() => {
+ const controlRef = useRef<any>(null);
+ const [input, setInput] = useState<string>("");
+ useEffect(() => {
  const dbInput = syncdb
  ?.get_one({
  event: "draft",
@@ -80,11 +81,19 @@ export default function ChatInput({
  // 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(input);
+ if (input?.trim()) {
+ // have to wait until it's all rendered -- i hate code like this...
+ for (const n of [1, 10, 50]) {
+ setTimeout(() => {
+ controlRef.current?.moveCursorToEndOfLine();
+ }, n);
+ }
+ }
+ }, [date, sender_id, propsInput]);
+
  const currentInputRef = useRef<string>(input);
  const saveOnUnmountRef = useRef<boolean>(true);
-
  const isMountedRef = useIsMountedRef();
  const lastSavedRef = useRef<string>(input);
  const saveChat = useDebouncedCallback(
@@ -141,7 +150,7 @@ export default function ChatInput({
  // Note: it is still slightly annoying, due to loss of focus... however, data
  // loss is NOT ok, whereas loss of focus is.
  const input = currentInputRef.current;
- if (input == null || syncdb == null) {
+ if (!input || syncdb == null) {
  return;
  }
  if (
@@ -211,6 +220,7 @@ export default function ChatInput({
  onBlur={onBlur}
  cacheId={cacheId}
  value={input}
+ controlRef={controlRef}
  enableUpload={true}
  enableMentions={true}
  submitMentionsRef={submitMentionsRef}

src/packages/frontend/chat/llm-msg-summarize.tsx

@@ -69,7 +69,7 @@ export function SummarizeThread({
  a {short ? "short" : "detailed"} summary of the conversation.
  </Paragraph>
  <Paragraph>
- Summary lenght:{" "}
+ Summary length:{" "}
  <Switch
  checked={!short}
  onChange={(v) => setShort(!v)}

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",
@@ -764,6 +768,17 @@ export default function Message(props: Readonly<Props>) {
  return;
  }
  const replyDate = -getThreadRootDate({ date, messages });
+ let input;
+ if (isLLMThread) {
+ input = "";
+ } else {
+ const replying_to = message.get("history")?.first()?.get("author_id");
+ if (!replying_to || replying_to == props.account_id) {
+ input = "";
+ } else {
+ input = `<span class="user-mention" account-id=${replying_to} >@${editor_name}</span> `;
+ }
+ }
  return (
  <div style={{ marginLeft: mode === "standalone" ? "30px" : "0" }}>
  <ChatInput
@@ -774,7 +789,7 @@ export default function Message(props: Readonly<Props>) {
  height: "auto" /* for some reason the default 100% breaks things */,
  }}
  cacheId={`${props.path}${props.project_id}${date}-reply`}
- input={""}
+ input={input}
  submitMentionsRef={replyMentionsRef}
  on_send={sendReply}
  height={"auto"}

src/packages/frontend/editors/markdown-input/multimode.tsx

@@ -134,54 +134,56 @@ interface Props {
  overflowEllipsis?: boolean; // if true, show "..." button popping up all menu entries
 
  dirtyRef?: MutableRefObject<boolean>; // a boolean react ref that gets set to true whenever document changes for any reason (client should explicitly set this back to false).
+
+ controlRef?: MutableRefObject<any>;
 }
 
-export default function MultiMarkdownInput(props: Props) {
- const {
-  autoFocus,
-  cacheId,
-  cmOptions,
-  compact,
-  cursors,
-  defaultMode,
-  dirtyRef,
-  editBarStyle,
-  editorDivRef,
-  enableMentions,
-  enableUpload = true,
-  extraHelp,
-  fixedMode,
-  fontSize,
-  getValueRef,
-  height = "auto",
-  hideHelp,
-  isFocused,
-  minimal,
-  modeSwitchStyle,
-  noVfill,
-  onBlur,
-  onChange,
-  onCursorBottom,
-  onCursors,
-  onCursorTop,
-  onFocus,
-  onModeChange,
-  onRedo,
-  onSave,
-  onShiftEnter,
-  onUndo,
-  onUploadEnd,
-  onUploadStart,
-  overflowEllipsis = false,
-  placeholder,
-  refresh,
-  registerEditor,
-  saveDebounceMs = SAVE_DEBOUNCE_MS,
-  style,
-  submitMentionsRef,
-  unregisterEditor,
-  value,
- } = props;
+export default function MultiMarkdownInput({
+ autoFocus,
+ cacheId,
+ cmOptions,
+ compact,
+ cursors,
+ defaultMode,
+ dirtyRef,
+ editBarStyle,
+ editorDivRef,
+ enableMentions,
+ enableUpload = true,
+ extraHelp,
+ fixedMode,
+ fontSize,
+ getValueRef,
+ height = "auto",
+ hideHelp,
+ isFocused,
+ minimal,
+ modeSwitchStyle,
+ noVfill,
+ onBlur,
+ onChange,
+ onCursorBottom,
+ onCursors,
+ onCursorTop,
+ onFocus,
+ onModeChange,
+ onRedo,
+ onSave,
+ onShiftEnter,
+ onUndo,
+ onUploadEnd,
+ onUploadStart,
+ overflowEllipsis = false,
+ placeholder,
+ refresh,
+ registerEditor,
+ saveDebounceMs = SAVE_DEBOUNCE_MS,
+ style,
+ submitMentionsRef,
+ unregisterEditor,
+ value,
+ controlRef,
+}: Props) {
  const {
  isFocused: isFocusedFrame,
  isVisible,
@@ -204,10 +206,10 @@ export default function MultiMarkdownInput(props: Props) {
 
  const editBar2 = useRef<JSX.Element | undefined>(undefined);
 
+ const getKey = () => `${project_id}${path}:${cacheId}`;
+
  function getCache() {
- return cacheId === undefined
- ? undefined
- : multimodeStateCache.get(`${project_id}${path}:${cacheId}`);
+ return cacheId == null ? undefined : multimodeStateCache.get(getKey());
  }
 
  const [mode, setMode0] = useState<Mode>(
@@ -248,23 +250,34 @@ export default function MultiMarkdownInput(props: Props) {
  } | null>(null);
 
  useEffect(() => {
- if (cacheId == null) return;
+ if (cacheId == null) {
+ return;
+ }
  const cache = getCache();
  if (cache?.[mode] != null && selectionRef.current != null) {
  // restore selection on mount.
  try {
  selectionRef.current.setSelection(cache?.[mode]);
  } catch (_err) {
- // console.warn(_err); // definitely don't need this.
- // This is expected to fail, since the selection from last
- // use will be invalid now if another user changed the
- // document, etc., or you did in a different mode, possibly.
+ // it might just be that the document isn't initialized yet
+ setTimeout(() => {
+ try {
+ selectionRef.current?.setSelection(cache?.[mode]);
+ } catch (_err2) {
+ // console.warn(_err2); // definitely don't need this.
+ // This is expected to fail, since the selection from last
+ // use will be invalid now if another user changed the
+ // document, etc., or you did in a different mode, possibly.
+ }
+ }, 100);
  }
  }
  return () => {
- if (selectionRef.current == null || cacheId == null) return;
+ if (selectionRef.current == null || cacheId == null) {
+ return;
+ }
  const selection = selectionRef.current.getSelection();
- multimodeStateCache.set(`${project_id}${path}:${cacheId}`, {
+ multimodeStateCache.set(getKey(), {
  ...getCache(),
  [mode]: selection,
  });
@@ -518,6 +531,7 @@ export default function MultiMarkdownInput(props: Props) {
  submitMentionsRef={submitMentionsRef}
  editBar2={editBar2}
  dirtyRef={dirtyRef}
+ controlRef={controlRef}
  />
  </div>
  ) : undefined}

src/packages/frontend/editors/slate/editable-markdown.tsx

@@ -33,6 +33,7 @@ import { markdown_to_html } from "@cocalc/frontend/markdown";
 import Fragment, { FragmentId } from "@cocalc/frontend/misc/fragment-id";
 import { Descendant, Editor, Range, Transforms, createEditor } from "slate";
 import { resetSelection } from "./control";
+import * as control from "./control";
 import { useBroadcastCursors, useCursorDecorate } from "./cursors";
 import { EditBar, useLinkURL, useListProperties, useMarks } from "./edit-bar";
 import { Element } from "./element";
@@ -121,6 +122,9 @@ interface Props {
  editBar2?: MutableRefObject<JSX.Element | undefined>;
  dirtyRef?: MutableRefObject<boolean>;
  minimal?: boolean;
+ controlRef?: MutableRefObject<{
+ moveCursorToEndOfLine: () => void;
+ } | null>;
 }
 
 export const EditableMarkdown: React.FC<Props> = React.memo((props: Props) => {
@@ -159,6 +163,7 @@ export const EditableMarkdown: React.FC<Props> = React.memo((props: Props) => {
  submitMentionsRef,
  unregisterEditor,
  value,
+ controlRef,
  } = props;
  const { project_id, path, desc, isVisible } = useFrameContext();
  const isMountedRef = useIsMountedRef();
@@ -246,6 +251,12 @@ export const EditableMarkdown: React.FC<Props> = React.memo((props: Props) => {
  };
  }
 
+ if (controlRef != null) {
+ controlRef.current = {
+ moveCursorToEndOfLine: () => control.moveCursorToEndOfLine(ed),
+ };
+ }
+
  ed.onCursorBottom = onCursorBottom;
  ed.onCursorTop = onCursorTop;
 

src/packages/hub/package.json

@@ -67,8 +67,8 @@
  "underscore": "^1.12.1",
  "uuid": "^8.3.2",
  "validator": "^13.6.0",
- "webpack-dev-middleware": "^6.1.2",
- "webpack-hot-middleware": "^2.25.4",
+ "webpack-dev-middleware": "^7.4.2",
+ "webpack-hot-middleware": "^2.26.1",
  "ws": "^8.18.0"
  },
  "devDependenicesNotes": "For license and size reasons, we make @cocalc/crm a dev dependency so it is NOT installed unless explicitly installed as a separate step.",