ui: fix t&w add and watch option

frontend/app/components/Session/Player/TagWatch/SaveModal.tsx

@@ -5,13 +5,17 @@ import { withSiteId, sessions } from 'App/routes';
 import { useStore } from 'App/mstore';
 
 interface Props {
-  onSave: (name: string, ignoreClRage: boolean, ignoreDeadCl: boolean) => Promise<any>;
+  onSave: (
+    name: string,
+    ignoreClRage: boolean,
+    ignoreDeadCl: boolean
+  ) => Promise<any>;
   hideModal: () => void;
 }
 
 function SaveModal({ onSave, hideModal }: Props) {
   const history = useHistory();
-  const { projectsStore } = useStore();
+  const { projectsStore, searchStore } = useStore();
   const [name, setName] = React.useState('');
   const [ignoreClRage, setIgnoreClRage] = React.useState(false);
   const [ignoreDeadCl, setIgnoreDeadCl] = React.useState(false);
@@ -24,7 +28,16 @@ function SaveModal({ onSave, hideModal }: Props) {
     onSave(name, ignoreClRage, ignoreDeadCl).then((tagId) => {
       hideModal();
       const siteId = projectsStore.getSiteId() as unknown as string;
-      history.push(withSiteId(sessions({ tnw: `is|${tagId}`, range: 'LAST_24_HOURS' }), siteId));
+      searchStore.addFilterByKeyAndValue(
+        'tag',
+        tagId.toString(),
+      )
+      history.push(
+        withSiteId(
+          sessions(),
+          siteId
+        )
+      );
     });
   };
   return (
@@ -41,12 +54,20 @@ function SaveModal({ onSave, hideModal }: Props) {
         />
       </div>
       <div>
-        <div className={'font-semibold'}>Ignore following actions on this element</div>
+        <div className={'font-semibold'}>
+          Ignore following actions on this element
+        </div>
         <div className={'flex gap-2'}>
-          <Checkbox checked={ignoreClRage} onChange={(e) => setIgnoreClRage(e.target.checked)}>
+          <Checkbox
+            checked={ignoreClRage}
+            onChange={(e) => setIgnoreClRage(e.target.checked)}
+          >
             Click Rage
           </Checkbox>
-          <Checkbox checked={ignoreDeadCl} onChange={(e) => setIgnoreDeadCl(e.target.checked)}>
+          <Checkbox
+            checked={ignoreDeadCl}
+            onChange={(e) => setIgnoreDeadCl(e.target.checked)}
+          >
             Dead Click
           </Checkbox>
         </div>

frontend/app/components/Session/Player/TagWatch/TagWatch.tsx

@@ -8,9 +8,11 @@ import { SearchOutlined, ZoomInOutlined } from '@ant-design/icons';
 import { observer } from 'mobx-react-lite';
 import { useModal } from 'App/components/Modal';
 import { toast } from 'react-toastify';
+import { FilterKey } from "App/types/filter/filterType";
+import { addOptionsToFilter } from "App/types/filter/newFilter";
 
 function TagWatch() {
-  const { tagWatchStore } = useStore();
+  const { tagWatchStore, searchStore } = useStore();
   const [selector, setSelector] = React.useState('');
   const { store, player } = React.useContext(PlayerContext);
   const { showModal, hideModal } = useModal();
@@ -48,6 +50,14 @@ function TagWatch() {
         ignoreClickRage: ignoreClRage,
         ignoreDeadClick: ignoreDeadCl,
       });
+      const tags = await tagWatchStore.getTags()
+      if (tags) {
+        addOptionsToFilter(
+          FilterKey.TAGGED_ELEMENT,
+          tags.map((tag) => ({ label: tag.name, value: tag.tagId.toString() }))
+        );
+        searchStore.refreshFilterOptions();
+      }
       // @ts-ignore
       toast.success('Tag created');
       setSelector('');

frontend/app/utils/search.ts

@@ -111,7 +111,6 @@ export class JsonUrlConverter {
     params.append(this.keyMap.endDate, rangeValues[1].toString());
     params.append(this.keyMap.sort, json.sort);
     params.append(this.keyMap.order, json.order);
-    params.append(this.keyMap.strict, json.strict.toString());
     params.append(this.keyMap.eventsOrder, json.eventsOrder);
 
     return decodeURIComponent(params.toString());