feat: add context specific search and actions (#1570)

packages/spotlight/src/modes/home/context-specific-group.tsx

@@ -0,0 +1,34 @@
+import { Group, Text } from "@mantine/core";
+
+import { createGroup } from "../../lib/group";
+import type { ContextSpecificItem } from "./context";
+import { useSpotlightContextResults } from "./context";
+
+export const contextSpecificSearchGroups = createGroup<ContextSpecificItem>({
+  title: (t) => t("search.mode.home.group.local.title"),
+  keyPath: "id",
+  Component(option) {
+    const icon =
+      typeof option.icon !== "string" ? (
+        <option.icon size={24} />
+      ) : (
+        <img width={24} height={24} src={option.icon} alt={option.name} />
+      );
+
+    return (
+      <Group w="100%" wrap="nowrap" align="center" px="md" py="xs">
+        {icon}
+        <Text>{option.name}</Text>
+      </Group>
+    );
+  },
+  useInteraction(option) {
+    return option.interaction();
+  },
+  filter(query, option) {
+    return option.name.toLowerCase().includes(query.toLowerCase());
+  },
+  useOptions() {
+    return useSpotlightContextResults();
+  },
+});