@qoretechnologies/reqraft 0.10.61 → 0.10.62-pr.137.g86641aa

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qoretechnologies/reqraft",
-  "version": "0.10.61",
+  "version": "0.10.62-pr.137.g86641aa",
   "description": "ReQraft is a collection of React components and hooks that are used across Qore Technologies' products made using the ReQore component library from Qore.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/dpqlEditor/DpqlEditor.tsx

@@ -12,14 +12,7 @@
 // There is intentionally no client-side "Templates" button — it would
 // duplicate what the server already returns on `$`.
 
-import {
-  forwardRef,
-  useEffect,
-  useImperativeHandle,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
+import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { SmartEditor } from '../smartEditor/SmartEditor';
 import { ISlateConverter, ISlateElement } from '../smartEditor/types';
 import { dpqlSlateConverter, richtextResponseToSlate } from './dpqlHelpers';
@@ -58,6 +51,7 @@ export const DpqlEditor = forwardRef<IDpqlEditorRef, IDpqlEditorProps>(
       fields,
       alertPayloadContext = false,
       fsmContext,
+      onUnavailable,
     },
     ref
   ) => {
@@ -79,12 +73,8 @@ export const DpqlEditor = forwardRef<IDpqlEditorRef, IDpqlEditorProps>(
     // reuse it without another roundtrip. `null` until the first
     // response arrives (or when the request errored — caller falls
     // back to the client-side regex parser via `dpqlSlateConverter`).
-    const [serverParsedNodes, setServerParsedNodes] = useState<
-      ISlateElement[] | null
-    >(null);
-    const [serverParsedFor, setServerParsedFor] = useState<string | null>(
-      null
-    );
+    const [serverParsedNodes, setServerParsedNodes] = useState<ISlateElement[] | null>(null);
+    const [serverParsedFor, setServerParsedFor] = useState<string | null>(null);
     const [isParsing, setIsParsing] = useState(false);
     // Tracks the most recent in-flight request so a slow response
     // can't overwrite a newer one (the user typed faster than the
@@ -163,10 +153,7 @@ export const DpqlEditor = forwardRef<IDpqlEditorRef, IDpqlEditorProps>(
       return {
         ...dpqlSlateConverter,
         toSlateNodes: (text: string) => {
-          if (
-            text === serverParsedFor &&
-            serverParsedNodes
-          ) {
+          if (text === serverParsedFor && serverParsedNodes) {
             return serverParsedNodes;
           }
           return dpqlSlateConverter.toSlateNodes(text);
@@ -174,6 +161,12 @@ export const DpqlEditor = forwardRef<IDpqlEditorRef, IDpqlEditorProps>(
       };
     }, [useServerParse, serverParsedFor, serverParsedNodes]);
 
+    // no language server to talk to: said once, for the host to show what works without one
+    const unavailable = dpql.session.isUnavailable;
+    useEffect(() => {
+      if (unavailable) onUnavailable?.();
+    }, [unavailable]);
+
     const tagRenderer = useMemo(
       () => makeDpqlTagRenderer(dpql.fieldMeta, { templateTagsUseIntent, templates }),
       [dpql.fieldMeta, templateTagsUseIntent, templates]

package/src/components/dpqlEditor/types.ts

@@ -114,6 +114,11 @@ export interface IDpqlEditorProps {
   templates?: IReqoreFormTemplates;
   /** Called when the editor loses focus. */
   onBlur?: () => void;
+  /**
+   * Called once when there is no language server to talk to (connecting failed): the editor can show the
+   * text but not parse, serialize or complete it, so a host that needs those offers what works without it.
+   */
+  onUnavailable?: () => void;
   /**
    * Opt-in to server-driven plain-text → Slate parsing via the LSP's
    * `dpql/toRichtext` custom method. When `true`, the editor calls

package/src/components/form/engine/CompactRow.tsx

@@ -166,6 +166,9 @@ export const richtextItemText = (item: unknown): string | undefined =>
     richtextToString((item as { value?: Parameters<typeof richtextToString>[0] }).value)
   : undefined;
 
+/** The status boxes by name, as their headers say them. */
+const BOX_NAMES = { attention: 'Needs attention', set: 'Set', optional: 'Optional' } as const;
+
 export const CompactRow = memo(
   ({
     optionName,
@@ -210,6 +213,8 @@ export const CompactRow = memo(
     const isExpanded = useContextSelector(CompactRowContext, (v) =>
       v.expandedOptions.includes(optionName)
     );
+    // the box this open field moves to when it is closed, when that is not the one it is shown in
+    const movesTo = useContextSelector(CompactRowContext, (v) => v.heldOptions?.[optionName]);
     const isHighlighted = useContextSelector(CompactRowContext, (v) =>
       v.highlightedOptions.includes(optionName)
     );
@@ -222,10 +227,7 @@ export const CompactRow = memo(
     );
     const setFocusedEditing = useContextSelector(CompactRowContext, (v) => v.setFocusedEditing);
     const readRowHeights = useContextSelector(CompactRowContext, (v) => v.readRowHeights);
-    const onReadOnlyActivate = useContextSelector(
-      CompactRowContext,
-      (v) => v.onReadOnlyActivate
-    );
+    const onReadOnlyActivate = useContextSelector(CompactRowContext, (v) => v.onReadOnlyActivate);
 
     /**
      * The floor recorded when a row is opened lasts until the author changes
@@ -401,7 +403,11 @@ export const CompactRow = memo(
         );
       }
 
-      if (valueType === 'bool' || valueType === 'boolean') {
+      // a yes/no holding a template reads as the template, below, not as Yes (qorus#646)
+      if (
+        (valueType === 'bool' || valueType === 'boolean') &&
+        !(typeof field?.value === 'string' && isValueTemplate(field.value))
+      ) {
         const truthy = field?.value === true || field?.value === 'true';
         return (
           <ReqoreTag
@@ -1245,6 +1251,7 @@ export const CompactRow = memo(
     const panelMessages = schemaMessages;
     const inlineMessages: TInfoMsg[] = [
       ...fieldMessages,
+
       ...(infoActive && schema?.default_value_desc ?
         [
           {
@@ -1587,6 +1594,18 @@ export const CompactRow = memo(
                   {renderOption(optionName, optionField, 'small', true)}
                 </RowMenuContext.Provider>
               </RowOpenPickerContext.Provider>
+              {/* Why a value already right is still in this box: an open field stays where it was opened
+                  (moving it would take the focus), and says where it goes when it is closed. */}
+              {movesTo ?
+                <ReqoreP
+                  size='small'
+                  className='options-readfirst-moves-to'
+                  intent={movesTo === 'attention' ? 'warning' : 'success'}
+                  style={{ marginTop: 4 }}
+                >
+                  {`Moves to "${BOX_NAMES[movesTo]}" when you close it (✓)`}
+                </ReqoreP>
+              : null}
             </div>
             <StyledRowActions>
               {draftChip}
@@ -1674,9 +1693,12 @@ export const CompactRow = memo(
           $border={schemaIntentColor ? `${schemaIntentColor}66` : `${cInfo}66`}
         >
           <div
+            className='options-readfirst-card-header'
             style={{
               display: 'flex',
-              alignItems: 'flex-start',
+              // a heading of one line is centred on the card's actions; one with a description or tags under
+              // its name lines up by its top (David's review of qorus#646: the name sat above the buttons)
+              alignItems: schema?.short_desc || cardTags.length ? 'flex-start' : 'center',
               justifyContent: 'space-between',
               gap: 12,
             }}
@@ -1893,9 +1915,7 @@ export const CompactRow = memo(
       !Array.isArray(optionField.value) &&
       !isExpression;
     const hashEntries =
-      !hidden && (isPlainHashType || isObjectValuedType) ?
-        getHashEntries(optionField, schema)
-      : [];
+      !hidden && (isPlainHashType || isObjectValuedType) ? getHashEntries(optionField, schema) : [];
     // A LIST OF HASHES/objects gets the same expandable structured preview a hash
     // does — the flat "N items" summary can't convey object contents (and must
     // never print "[object Object]"). StructuredDataView unwraps each item's
@@ -2231,7 +2251,8 @@ export const CompactRow = memo(
         tabIndex={actsOnClick ? 0 : undefined}
         aria-label={
           readOnlyIsAWayIn ? `Edit ${label}`
-          : readOnly ? undefined
+          : readOnly ?
+            undefined
           : label
         }
         className={`readfirst-row options-readfirst-value${readOnly ? ' readfirst-row-read' : ''}${readOnlyIsAWayIn ? ' readfirst-row-way-in' : ''}${hidden ? ' readfirst-row-hidden' : ''}${fieldDisabled ? ' readfirst-row-disabled' : ''}${isHighlighted ? ' readfirst-row-group-highlight' : ''}${isFlashed ? ' readfirst-row-flash' : ''}${showLabelDesc ? ' readfirst-row-info-open' : ''}${panelMessages.length || showStructuredPreview || showCodePreview || showMarkdownPreview || showLongTextInset ? ' readfirst-row-tall' : ''}${clusterBlockClass ? ' ' + clusterBlockClass : ''}`}