Merge pull request #857 from neo4j-labs/issue/856-auto-sorting

#856 Disable auto-sorting of Cypher query Parameter Select

Author: mariusconjeaud

src/chart/parameter/ParameterSelectionChart.tsx

@@ -94,6 +94,7 @@ export const NeoParameterSelectionChart = (props: ChartProps) => {
           compatibilityMode={compatibilityMode}
           multiSelector={multiSelector}
           manualParameterSave={manualParameterSave}
+          autoSort={true}
         />
       );
     } else if (type == 'Relationship Property') {
@@ -112,6 +113,7 @@ export const NeoParameterSelectionChart = (props: ChartProps) => {
           compatibilityMode={compatibilityMode}
           multiSelector={multiSelector}
           manualParameterSave={manualParameterSave}
+          autoSort={true}
         />
       );
     } else if (type == 'Date Picker') {
@@ -147,6 +149,7 @@ export const NeoParameterSelectionChart = (props: ChartProps) => {
           compatibilityMode={compatibilityMode}
           multiSelector={multiSelector}
           manualParameterSave={manualParameterSave}
+          autoSort={false}
         />
       );
     }

src/chart/parameter/component/NodePropertyParameterSelect.tsx

@@ -165,12 +165,14 @@ const NodePropertyParameterSelectComponent = (props: ParameterSelectProps) => {
       />
     );
   }
+  let options = extraRecords?.map((r) => r?._fields?.[displayValueRowIndex] || '(no data)');
+  options = props.autoSort ? options.sort() : options;
   return (
     <div className={'n-flex n-flex-row n-flex-wrap n-items-center'}>
       <Autocomplete
         id='autocomplete'
         multiple={multiSelector}
-        options={extraRecords?.map((r) => r?._fields?.[displayValueRowIndex] || '(no data)').sort()}
+        options={options}
         disabled={disabled}
         limitTags={multiSelectLimit}
         style={{
@@ -198,7 +200,8 @@ const NodePropertyParameterSelectComponent = (props: ParameterSelectProps) => {
           if (autoSelectFirstValue && paramValueDisplayLocal == '') {
             debouncedQueryCallback(props.query, { input: '', ...allParameters }, (records) => {
               if (records && records.length > 0 && records[0] && records[0]._fields) {
-                const values = records?.map((r) => r?._fields?.[displayValueRowIndex] || '(no data)').sort();
+                let values = records?.map((r) => r?._fields?.[displayValueRowIndex] || '(no data)');
+                values = props.autoSort ? values.sort() : values;
                 setExtraRecords(records);
                 propagateSelection(undefined, values[0]);
               }

src/chart/parameter/component/ParameterSelect.ts

@@ -62,4 +62,8 @@ export interface ParameterSelectProps {
    * Add the possibility for manual selection confirmation
    */
   manualParameterSave?: boolean;
+  /**
+   * Pass true if results should be sorted automatically
+   */
+  autoSort?: boolean;
 }

src/chart/parameter/component/QueryParameterSelect.tsx

@@ -17,6 +17,7 @@ const QueryParameterSelectComponent = (props: ParameterSelectProps) => {
       allParameters={props.allParameters}
       compatibilityMode={props.compatibilityMode}
       multiSelector={props.multiSelector}
+      autoSort={props.autoSort}
     />
   );
 };