refactor of menus

begin work on settings

src/menus/SideMenuWithCategories.vue

@@ -77,10 +77,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
 </template>
 
 <script setup>
-import { ref, useTemplateRef, onMounted } from 'vue'
+import { ref, useTemplateRef, onMounted, watch } from 'vue'
 import { useNavStore } from '../store/nav.js'
 import { useConfigStore } from '../store/config.js'
 import { getActiveAppId } from '../lib/app.js'
+import { focusActiveApp } from '../lib/menu.js'
 import { containsAppsMatchingSearch, isAppMatchingSearch } from '../lib/search.js'
 
 import OpenerButton from '../components/OpenerButton'
@@ -108,6 +109,12 @@ const openerHover = ref(false)
 const menu = useTemplateRef('menu')
 const isTouchDevice = window.matchMedia('(pointer: coarse)').matches
 
+watch(() => open, (val) => {
+  if (val) {
+    focusActiveApp(menu.value)
+  }
+})
+
 onMounted(async () => {
   const config = await configStore.getConfig()