diff --git a/package.json b/package.json
index 7d5ddde..979fe8e 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,7 @@
"scripts": {
"dev": "vite",
"build": "vite build",
- "lint": "npx @biomejs/biome lint . --write --unsafe && npx @biomejs/biome format . --write && npx @biomejs/biome check . --write --unsafe && npx @biomejs/biome ci . --formatter-enabled=true --linter-enabled=true --organize-imports-enabled=true",
+ "lint": "npx @biomejs/biome lint . --write --unsafe && npx @biomejs/biome format . --write && npx @biomejs/biome check . --write --unsafe && npx @biomejs/biome ci . --formatter-enabled=true --linter-enabled=true",
"preview": "vite preview"
},
"dependencies": {
diff --git a/src/pages/homepage/components/Search/Search.tsx b/src/pages/homepage/components/Search/Search.tsx
index fe36a4f..eed9711 100644
--- a/src/pages/homepage/components/Search/Search.tsx
+++ b/src/pages/homepage/components/Search/Search.tsx
@@ -1,8 +1,11 @@
-import { type OptionsFilter, Select, Stack, Text } from '@mantine/core';
+import { Group, type OptionsFilter, Select, Stack, Text } from '@mantine/core';
import { useDisclosure } from '@mantine/hooks';
import { HelpModal, WeatherModal } from 'components';
import { useCommonHooks, useMutationAPI, useQueryAPI } from 'hooks';
import { useEffect, useState } from 'react';
+import * as fa6 from 'react-icons/fa6';
+import * as si from 'react-icons/si';
+import * as vsc from 'react-icons/vsc';
import { selectClasses } from 'styles';
import type {
Application,
@@ -11,7 +14,7 @@ import type {
Provider,
SearchHistoryItem,
} from 'types';
-import SearchSelectItem from './SearchHistoryItem';
+import SearchSelectItem from './SearchSelectItem';
export default function Search({
current,
@@ -26,6 +29,7 @@ export default function Search({
closeWeatherModal: () => void;
openWeatherModal: () => void;
}) {
+ const allIcons: any = { ...fa6, ...vsc, ...si };
const { data: providerData, isFetched: providerDataIsFetched } = useQueryAPI({
endpoint: 'api/providers',
});
@@ -67,6 +71,14 @@ export default function Search({
open(`${url}${option.searchTerm}`, '_self');
};
+ const handleAppLaunchItem = ({ option }: { option: any }) => {
+ const validUrl =
+ option.url.startsWith('http://') || option.url.startsWith('https://')
+ ? option.url
+ : `http://${option.url}`;
+ open(validUrl, '_self');
+ };
+
const handleKeyPress = (item: any) => {
let option = '';
let subtext = '';
@@ -286,7 +298,7 @@ export default function Search({
}, [historyData, historyDataIsFetched]);
useEffect(() => {
- if (dropdownOpened) {
+ if (dropdownOpened && listIndex >= 0) {
setPlaceholderValue(
searchHistory.length > 0
? `${searchHistory[listIndex].prefix} ${searchHistory[listIndex].searchTerm}`
@@ -346,13 +358,46 @@ export default function Search({
autoFocus={!isMobile}
leftSection={providerLabel}
rightSection={}
- renderOption={(item: any) => (
-
- )}
+ renderOption={(item: any) => {
+ const Icon = allIcons[item.option.icon];
+ return !searchValue.startsWith('!') ? (
+
+ ) : (
+ {
+ e.preventDefault();
+ e.stopPropagation();
+ handleAppLaunchItem(item);
+ }}
+ >
+
+ Launch
+
+ {Icon && (
+
+ )}
+
+ {item.option.name}
+
+
+ );
+ }}
onBlur={() => {
setPlaceholderValue('');
setListIndex(0);
diff --git a/src/pages/homepage/components/Search/SearchHistoryItem.tsx b/src/pages/homepage/components/Search/SearchSelectItem.tsx
similarity index 100%
rename from src/pages/homepage/components/Search/SearchHistoryItem.tsx
rename to src/pages/homepage/components/Search/SearchSelectItem.tsx