Skip to content

Commit 6bd3dbc

Browse files
authored
ENG-1491: Part of the discourse context query settings blocks appears in the page if you select "hide interface" in the discourse context menu at the top of the page (#953)
* ENG-1491 Hide settings UI in ResultsView when preventSavingSettings is true Discourse context renders ResultsView with preventSavingSettings={true} but the kebab menu still showed settings items (Layout, Alias, Hide Interface, etc.). Clicking them wrote Roam blocks onto the page. Hide the Results submenu, Alias, Hide Interface, and Copy Query items when preventSavingSettings is true. Menu collapses to "Share Data" in discourse context and overlays. * void 3 floating promises in ResultsView handlers Pre-existing no-floating-promises warnings on setInputSetting / navigator.clipboard.writeText calls. The previous commit re-indented these lines due to JSX wrapping, so reviewdog now flags them as added. Mark them void — they're fire-and-forget side effects. * Revert Copy Query hide; keep scope on settings only Copy Query is read-only — it doesn't save settings, so gating it behind preventSavingSettings was a misuse of the flag. It is still broken in discourse context (copies whole page tree wrapped in {{query block}}) but that's a separate bug for a separate ticket. Also restores the trailing Divider to unconditional since the only reason it was conditional was the Copy Query wrap. * Forward preventSavingSettings to ResultsTable * Guard onDragEnd column-width persistence behind preventSavingSettings Mirrors the existing guard in resultHeaderSetFilters so dragging column borders in ResultsView no longer writes layout widths to Roam blocks when the flag is on. Addresses review comment on onDragEnd.
1 parent d70a335 commit 6bd3dbc

2 files changed

Lines changed: 110 additions & 100 deletions

File tree

apps/roam/src/components/results-view/ResultsTable.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -624,6 +624,7 @@ const ResultsTable = ({
624624
});
625625
setColumnWidths(finalWidths);
626626

627+
if (preventSavingSettings) return;
627628
const layoutUid = getSubTree({ parentUid, key: "layout" }).uid;
628629
if (layoutUid) {
629630
setInputSettings({
@@ -632,7 +633,7 @@ const ResultsTable = ({
632633
values: Object.entries(finalWidths).map(([k, v]) => `${k} - ${v}`),
633634
});
634635
}
635-
}, [parentUid, columnWidths, visibleColumns]);
636+
}, [parentUid, columnWidths, visibleColumns, preventSavingSettings]);
636637

637638
const resultHeaderSetFilters = React.useCallback(
638639
(fs: FilterData) => {

apps/roam/src/components/results-view/ResultsView.tsx

Lines changed: 108 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1149,120 +1149,128 @@ const ResultsView: ResultsViewComponent = ({
11491149
}}
11501150
/>
11511151
)}
1152-
<Divider />
1153-
<MenuItem
1154-
icon={"list"}
1155-
text={"Results"}
1156-
className={isMenuIconDirty ? "roamjs-item-dirty" : ""}
1157-
>
1158-
<MenuItem
1159-
icon={"layout"}
1160-
text={"Layout"}
1161-
onClick={() => {
1162-
setIsEditLayout(true);
1163-
}}
1164-
/>
1165-
<MenuItem
1166-
icon={"eye-open"}
1167-
text={"Column Views"}
1168-
className={isColumnViewsDirty ? "roamjs-item-dirty" : ""}
1169-
onClick={() => {
1170-
setIsEditViews(true);
1171-
}}
1172-
/>
1152+
{(!preventSavingSettings || onEdit) && <Divider />}
1153+
{!preventSavingSettings && (
11731154
<MenuItem
1174-
icon={showSearchFilter ? "zoom-out" : "search"}
1175-
text={showSearchFilter ? "Hide Search" : "Search"}
1176-
className={
1177-
searchFilter && !showSearchFilter
1178-
? "roamjs-item-dirty"
1179-
: ""
1180-
}
1181-
onClick={() => {
1182-
setMoreMenuOpen(false);
1183-
setShowSearchFilter((s) => !s);
1184-
if (!preventSavingSettings) {
1155+
icon={"list"}
1156+
text={"Results"}
1157+
className={isMenuIconDirty ? "roamjs-item-dirty" : ""}
1158+
>
1159+
<MenuItem
1160+
icon={"layout"}
1161+
text={"Layout"}
1162+
onClick={() => {
1163+
setIsEditLayout(true);
1164+
}}
1165+
/>
1166+
<MenuItem
1167+
icon={"eye-open"}
1168+
text={"Column Views"}
1169+
className={
1170+
isColumnViewsDirty ? "roamjs-item-dirty" : ""
1171+
}
1172+
onClick={() => {
1173+
setIsEditViews(true);
1174+
}}
1175+
/>
1176+
<MenuItem
1177+
icon={showSearchFilter ? "zoom-out" : "search"}
1178+
text={showSearchFilter ? "Hide Search" : "Search"}
1179+
className={
1180+
searchFilter && !showSearchFilter
1181+
? "roamjs-item-dirty"
1182+
: ""
1183+
}
1184+
onClick={() => {
1185+
setMoreMenuOpen(false);
1186+
setShowSearchFilter((s) => !s);
1187+
if (!preventSavingSettings) {
1188+
void setInputSetting({
1189+
blockUid: settings.resultNodeUid,
1190+
key: "showSearchFilter",
1191+
value: showSearchFilter ? "hide" : "show",
1192+
});
1193+
}
1194+
}}
1195+
/>
1196+
<MenuItem
1197+
icon={showInputs ? "minus" : "plus"}
1198+
text={showInputs ? "Hide Inputs" : "Inputs"}
1199+
onClick={() => {
1200+
setMoreMenuOpen(false);
1201+
setShowInputs(!showInputs);
11851202
setInputSetting({
11861203
blockUid: settings.resultNodeUid,
1187-
key: "showSearchFilter",
1188-
value: showSearchFilter ? "hide" : "show",
1204+
key: "showInputs",
1205+
value: showInputs ? "hide" : "show",
11891206
});
1207+
}}
1208+
/>
1209+
<MenuItem
1210+
icon={"filter"}
1211+
text={"Filters"}
1212+
className={
1213+
columnFilters.length ? "roamjs-item-dirty" : ""
11901214
}
1191-
}}
1192-
/>
1215+
onClick={() => {
1216+
setIsEditColumnFilter(true);
1217+
}}
1218+
/>
1219+
<MenuItem
1220+
icon={"sort"}
1221+
text={"Sort"}
1222+
className={activeSort.length ? "roamjs-item-dirty" : ""}
1223+
onClick={() => {
1224+
setIsEditColumnSort(true);
1225+
}}
1226+
/>
1227+
<MenuItem
1228+
icon={"random"}
1229+
text={"Get Random"}
1230+
className={random.count ? "roamjs-item-dirty" : ""}
1231+
onClick={() => setIsEditRandom(true)}
1232+
/>
1233+
<MenuItem
1234+
icon={"numbered-list"}
1235+
text={"Rows per page"}
1236+
onClick={() => setIsEditPageSize(true)}
1237+
/>
1238+
</MenuItem>
1239+
)}
1240+
{!preventSavingSettings && (
11931241
<MenuItem
1194-
icon={showInputs ? "minus" : "plus"}
1195-
text={showInputs ? "Hide Inputs" : "Inputs"}
1242+
icon={"tag"}
1243+
text={showAlias ? "Hide Alias" : "Alias"}
11961244
onClick={() => {
1197-
setMoreMenuOpen(false);
1198-
setShowInputs(!showInputs);
11991245
setInputSetting({
12001246
blockUid: settings.resultNodeUid,
1201-
key: "showInputs",
1202-
value: showInputs ? "hide" : "show",
1247+
key: "showAlias",
1248+
value: showAlias ? "hide" : "show",
12031249
});
1250+
setShowAlias(!showAlias);
1251+
setMoreMenuOpen(false);
12041252
}}
12051253
/>
1254+
)}
1255+
{!preventSavingSettings && (
12061256
<MenuItem
1207-
icon={"filter"}
1208-
text={"Filters"}
1209-
className={
1210-
columnFilters.length ? "roamjs-item-dirty" : ""
1211-
}
1212-
onClick={() => {
1213-
setIsEditColumnFilter(true);
1214-
}}
1215-
/>
1216-
<MenuItem
1217-
icon={"sort"}
1218-
text={"Sort"}
1219-
className={activeSort.length ? "roamjs-item-dirty" : ""}
1257+
icon={showInterface ? "th-disconnect" : "th"}
1258+
text={showInterface ? "Hide Interface" : "Show Interface"}
12201259
onClick={() => {
1221-
setIsEditColumnSort(true);
1260+
const resultNode = getSubTree({
1261+
key: "results",
1262+
parentUid,
1263+
});
1264+
void setInputSetting({
1265+
key: "interface",
1266+
value: showInterface ? "hide" : "show",
1267+
blockUid: resultNode.uid,
1268+
});
1269+
setShowInterface((s) => !s);
1270+
setMoreMenuOpen(false);
12221271
}}
12231272
/>
1224-
<MenuItem
1225-
icon={"random"}
1226-
text={"Get Random"}
1227-
className={random.count ? "roamjs-item-dirty" : ""}
1228-
onClick={() => setIsEditRandom(true)}
1229-
/>
1230-
<MenuItem
1231-
icon={"numbered-list"}
1232-
text={"Rows per page"}
1233-
onClick={() => setIsEditPageSize(true)}
1234-
/>
1235-
</MenuItem>
1236-
<MenuItem
1237-
icon={"tag"}
1238-
text={showAlias ? "Hide Alias" : "Alias"}
1239-
onClick={() => {
1240-
setInputSetting({
1241-
blockUid: settings.resultNodeUid,
1242-
key: "showAlias",
1243-
value: showAlias ? "hide" : "show",
1244-
});
1245-
setShowAlias(!showAlias);
1246-
setMoreMenuOpen(false);
1247-
}}
1248-
/>
1249-
<MenuItem
1250-
icon={showInterface ? "th-disconnect" : "th"}
1251-
text={showInterface ? "Hide Interface" : "Show Interface"}
1252-
onClick={() => {
1253-
const resultNode = getSubTree({
1254-
key: "results",
1255-
parentUid,
1256-
});
1257-
setInputSetting({
1258-
key: "interface",
1259-
value: showInterface ? "hide" : "show",
1260-
blockUid: resultNode.uid,
1261-
});
1262-
setShowInterface((s) => !s);
1263-
setMoreMenuOpen(false);
1264-
}}
1265-
/>
1273+
)}
12661274
<MenuItem
12671275
icon={"export"}
12681276
text={"Share Data"}
@@ -1324,7 +1332,7 @@ const ResultsView: ResultsViewComponent = ({
13241332
.join("");
13251333
};
13261334
const tree = getBasicTreeByParentUid(parentUid);
1327-
navigator.clipboard.writeText(
1335+
void navigator.clipboard.writeText(
13281336
"- {{query block}}\n" + getTextFromTreeToPaste(tree, 1),
13291337
);
13301338
renderToast({
@@ -1369,6 +1377,7 @@ const ResultsView: ResultsViewComponent = ({
13691377
setActiveSort={resultViewSetActiveSort}
13701378
filters={filters}
13711379
setFilters={setFilters}
1380+
preventSavingSettings={preventSavingSettings}
13721381
views={views}
13731382
onRefresh={onRefresh}
13741383
allResults={results}

0 commit comments

Comments
 (0)