s:CMS

Example of Search component using a static CSV file

This example shows how to use the Search component to search data from a static CSV file. The Search component takes a source prop that specifies the source of the data to search. In this example, the source is a CSV file that provides data from a file named ksa.csv. The fieldList prop specifies the fields to search in the data, and the resultItemTemplate prop specifies the template to use to display the search results.

<Search
  source={{
        path2data: {
          path: "/data/ksa.csv"
        }
      }}
  fieldList={{
        Item_Label: "Label",
        Site_Name: "Site name",
        Site_Description: "Site description"
      }}
  resultItemTemplate={item=>{return<div
    key={item.Item_Label}
    className="border-bottom py-3">
    <strong>{item.Item_Label} — {item.Site_Name}</strong>
    <p>{item.Site_Description}</p>
    </div>;}}
/>