feat: dynamic value change for ui.tabs - args fix

ui/src/tabs.tsx

@@ -66,6 +66,7 @@ export const
       onLinkClick = (item?: Fluent.PivotItem) => {
         const name = item?.props.itemKey
         if (!name) return
+        m.value = name
         setSelected(name)
         if (name.startsWith('#')) {
           window.location.hash = name.substring(1)
@@ -84,7 +85,12 @@ export const
       tabs = m.items?.map(t => <Fluent.PivotItem key={t.name} itemIcon={t.icon} itemKey={t.name} headerText={t.label} />),
       [selected, setSelected] = React.useState(m.value)
 
-    React.useEffect(() => setSelected(m.value), [m.value])
+    React.useEffect(() => {
+      setSelected(m.value)
+      if (!m.value) wave.args[m.name] = null
+      else if (m.value.startsWith('#')) window.location.hash = m.value.substring(1)
+      else if (m.name && m.value !== wave.args[m.name]) wave.args[m.name] = m.value
+    }, [m.name, m.value])
 
     return (
       <div className={css.pivot}>