From 40a503d50275947bf0bab333d04edfa1778213f7 Mon Sep 17 00:00:00 2001
From: ivan-aksamentov <ivan.aksamentov@gmail.com>
Date: Tue, 12 Dec 2023 15:58:37 +0100
Subject: [PATCH] feat(web): allow clearing current dataset selection

---
 .../components/Main/DatasetCurrentSummary.tsx | 26 +++++++++++++++++--
 .../src/state/autodetect.state.ts             |  2 ++
 .../nextclade-web/src/state/dataset.state.ts  |  6 ++---
 3 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/packages_rs/nextclade-web/src/components/Main/DatasetCurrentSummary.tsx b/packages_rs/nextclade-web/src/components/Main/DatasetCurrentSummary.tsx
index 6194f1dd2..128f5e697 100644
--- a/packages_rs/nextclade-web/src/components/Main/DatasetCurrentSummary.tsx
+++ b/packages_rs/nextclade-web/src/components/Main/DatasetCurrentSummary.tsx
@@ -1,7 +1,10 @@
 import React from 'react'
 import { Col, Row } from 'reactstrap'
-import { useRecoilState } from 'recoil'
+import { useRecoilValue, useResetRecoilState } from 'recoil'
+import { MdClear as IconClearBase } from 'react-icons/md'
+import { ButtonTransparent } from 'src/components/Common/ButtonTransparent'
 import { ButtonLoadExample } from 'src/components/Main/ButtonLoadExample'
+import { useTranslationSafe } from 'src/helpers/useTranslationSafe'
 import styled from 'styled-components'
 import { useUpdatedDataset } from 'src/io/fetchDatasets'
 import { datasetCurrentAtom } from 'src/state/dataset.state'
@@ -12,7 +15,10 @@ export function DatasetCurrentSummary() {
   // Periodically checks if there's local update for the current dataset
   useUpdatedDataset()
 
-  const [dataset, _0] = useRecoilState(datasetCurrentAtom)
+  const { t } = useTranslationSafe()
+
+  const dataset = useRecoilValue(datasetCurrentAtom)
+  const resetDataset = useResetRecoilState(datasetCurrentAtom)
 
   if (!dataset) {
     return null
@@ -25,6 +31,9 @@ export function DatasetCurrentSummary() {
       <Row noGutters className="w-100">
         <Col className="d-flex">
           <DatasetInfo dataset={dataset} showSuggestions />
+          <ButtonClear onClick={resetDataset} title={t('Reset dataset')}>
+            <IconClear size={20} />
+          </ButtonClear>
         </Col>
       </Row>
       <Row noGutters>
@@ -43,3 +52,16 @@ const Container = styled.div`
   border: 1px #ccc9 solid;
   border-radius: 5px;
 `
+
+const ButtonClear = styled(ButtonTransparent)`
+  display: inline;
+  margin: 0 auto;
+  height: 20px;
+  width: 20px;
+`
+
+const IconClear = styled(IconClearBase)`
+  * {
+    color: ${(props) => props.theme.gray500};
+  }
+`
diff --git a/packages_rs/nextclade-web/src/state/autodetect.state.ts b/packages_rs/nextclade-web/src/state/autodetect.state.ts
index 5f8e2bd5e..45a567040 100644
--- a/packages_rs/nextclade-web/src/state/autodetect.state.ts
+++ b/packages_rs/nextclade-web/src/state/autodetect.state.ts
@@ -90,6 +90,8 @@ export const autodetectResultsAtom = selector<MinimizerSearchRecord[] | undefine
     // If the operation is not 'reset', add the new items
     if (!isDefaultValue(results) && !isNil(results)) {
       results.forEach((result) => set(autodetectResultByIndexAtom(result.fastaRecord.index), result))
+    } else {
+      reset(autodetectRunStateAtom)
     }
   },
 })
diff --git a/packages_rs/nextclade-web/src/state/dataset.state.ts b/packages_rs/nextclade-web/src/state/dataset.state.ts
index 7b9038360..946fdfc42 100644
--- a/packages_rs/nextclade-web/src/state/dataset.state.ts
+++ b/packages_rs/nextclade-web/src/state/dataset.state.ts
@@ -1,6 +1,6 @@
 import { isNil } from 'lodash'
 import { atom, DefaultValue, selector } from 'recoil'
-
+import { autodetectResultsAtom } from 'src/state/autodetect.state'
 import type { Dataset, MinimizerIndexVersion } from 'src/types'
 import { persistAtom } from 'src/state/persist/localStorage'
 import { isDefaultValue } from 'src/state/utils/isDefaultValue'
@@ -30,10 +30,10 @@ export const datasetCurrentAtom = selector<Dataset | undefined>({
     return get(datasetCurrentStorageAtom)
   },
   set({ get, set, reset }, dataset: Dataset | undefined | DefaultValue) {
-    const datasetCurrent = get(datasetCurrentStorageAtom)
     if (isDefaultValue(dataset) || isNil(dataset)) {
+      reset(autodetectResultsAtom)
       reset(datasetCurrentStorageAtom)
-    } else if (!areDatasetsEqual(datasetCurrent, dataset)) {
+    } else if (!areDatasetsEqual(get(datasetCurrentStorageAtom), dataset)) {
       set(datasetCurrentStorageAtom, dataset)
     }
   },