[improvement][headless-fe] Revamped the interaction for semantic modeling routing and successfully implemented the switching between dimension and dataset management. (#1934)

Co-authored-by: tristanliu <tristanliu@tencent.com>

webapp/packages/supersonic-fe/src/pages/SemanticModel/models/domainData.ts

@@ -1,16 +1,37 @@
 import { ISemantic } from '../data';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
+import { useModel } from '@umijs/max';
 
 export default function Domain() {
-  const [selectDomain, setSelectDomain] = useState<ISemantic.IDomainItem>();
+  const [selectDomain, setSelectDomain] = useState<ISemantic.IDomainItem>(
+    {} as ISemantic.IDomainItem,
+  );
+  const [selectDataSet, setSelectDataSet] = useState<ISemantic.IDatasetItem>();
   const [domainList, setDomainList] = useState<ISemantic.IDomainItem[]>([]);
 
+  const modelModel = useModel('SemanticModel.modelData');
+  const metricModel = useModel('SemanticModel.metricData');
+  const dimensionModel = useModel('SemanticModel.dimensionData');
+
+  const { setSelectModel } = modelModel;
+  const { setSelectDimension } = dimensionModel;
+  const { setSelectMetric } = metricModel;
+
+  useEffect(() => {
+    setSelectModel(undefined);
+    setSelectDimension(undefined);
+    setSelectMetric(undefined);
+    setSelectDataSet(undefined);
+  }, [selectDomain]);
+
   return {
     selectDomain,
+    selectDataSet,
     selectDomainId: selectDomain?.id,
     selectDomainName: selectDomain?.name,
     domainList,
     setSelectDomain,
+    setSelectDataSet,
     setDomainList,
   };
 }