Advanced search form is overwhelming

[Sandravaphilips]

Closes #1714
Loom: https://www.loom.com/share/bbf99e9f4b5646c4a8b57ca1c1979ab7?sid=ed4871aa-cec1-4794-84e9-e02e298d6046

[Sandravaphilips]

@longhotsummer this is what we have now:
https://www.loom.com/share/a2785ac2bb504e8f986f7dbc4519f497?sid=475202ba-d691-4786-bb7a-29386adf0058
I'm looking for ways to optimize the code, so your ideas are very welcome.

[Sandravaphilips]

@longhotsummer New updates: https://www.loom.com/share/99bfba57b67a4cf8a0f4ec78e76c4ffa?sid=facaf053-4045-4b85-aaf4-d2155ad9f257

[longhotsummer]

Looking much better. I still think you're trying to fit the new world too much into how the old world worked. The advanced search UI is no longer field-driven, it's criteria driven, where each criteria is shown as a row, and can apply to one or more fields.

Here's more detail: https://www.loom.com/share/be51337db24e4e06a906aae08e6631e4

And here's some pseudo-code to outline what I think that looks like:

// the rows of the advanced search form
const advancedSearchCriteria = [{
  text: "foo",  // from the input box
  fields: ["title", "content"], // from the fields checkboxes
  condition: "AND",  // from the AND/OR dropdown
  phrase: false,   // from the exact phrase checkbox
}, {
  text: "bar boom",
  fields: [],      // default is ALL
  condition: "NOT",
  phrase: true, 
}];

const advancedSearchDateCriteria = { ... };   // treat the dates separately to the rows above, they're different beasts


// the advanced search params to send to the server
const params = { ... (facets, etc.) }

function formatFieldQuery(criterion, params) {
  let q = "";
  
  if (criterion.condition == "AND") { ... }
  else if (criterion.condition == "NOT" { ... }
  // etc.
  
  // add q to each of the search fields that its applicable to
  // TODO: handle fields is empty therefore ALL fields
  for (const fld of criterion.fields) {
    params[`search_{fld}`] = (params[`search_{fld}`] || "") + " " + q
  }
}


advancedSearchCriteria.forEach(c => addSearchParams(c, params));