diff --git a/components/SearchBar/SearchBar.tsx b/components/SearchBar/SearchBar.tsx index aa852b8b6..383db31b9 100644 --- a/components/SearchBar/SearchBar.tsx +++ b/components/SearchBar/SearchBar.tsx @@ -1,4 +1,5 @@ import { Input, TextInput, Text, ActionIcon, useMantineTheme } from '@mantine/core'; +import { useForm } from '@mantine/hooks'; import { showNotification } from '@mantine/notifications'; import { useState, useEffect } from 'react'; import { Search, ArrowRight, ArrowLeft } from 'tabler-icons-react'; @@ -8,6 +9,13 @@ export default function SearchBar(props: any) { const theme = useMantineTheme(); const [config, setConfig] = useState({ searchBar: true, + searchUrl : 'https://www.google.com/search?q=', + }); + const querryUrl = config.searchUrl || 'https://www.google.com/search?q='; + const form = useForm({ + initialValues: { + querry: '', + }, }); useEffect(() => { @@ -21,21 +29,22 @@ export default function SearchBar(props: any) { setConfig(config); } }, []); + + if (!config.searchBar) { + return null; + } + return ( - } - radius="xl" - size="md" - placeholder="Search the web" - onChange={(e) => { - showNotification({ - autoClose: 1000, - title: Searching for {e.target.value}, - message: undefined, - }); - }} - rightSectionWidth={42} - {...props} - /> +
window.open(`${querryUrl}${values.querry}`))}> + } + radius="xl" + size="md" + placeholder="Search the web" + rightSectionWidth={42} + {...props} + {...form.getInputProps('querry')} + /> + ); } diff --git a/components/Settings/SettingsMenu.tsx b/components/Settings/SettingsMenu.tsx index 87911dd53..9267fbc76 100644 --- a/components/Settings/SettingsMenu.tsx +++ b/components/Settings/SettingsMenu.tsx @@ -1,4 +1,4 @@ -import { ActionIcon, Group, Modal, Switch, Title, Text, Tooltip } from '@mantine/core'; +import { ActionIcon, Group, Modal, Switch, Title, Text, Tooltip, TextInput } from '@mantine/core'; import { showNotification } from '@mantine/notifications'; import { motion } from 'framer-motion'; import { CSSProperties, useEffect, useState } from 'react'; @@ -8,6 +8,7 @@ import SaveConfigComponent from '../Config/SaveConfig'; function SettingsMenu(props: any) { const [config, setConfig] = useState({ + searchUrl: 'https://www.google.com/search?q=', searchBar: true, }); @@ -18,24 +19,42 @@ function SettingsMenu(props: any) { } }, []); return ( - - { + + + { setConfig({ ...config, - searchBar: e.target.checked, + searchUrl: e.target.value }); localStorage.setItem( 'settings', JSON.stringify({ ...config, - searchBar: e.target.checked, + searchUrl: e.target.value, }) ); - }} - checked={config.searchBar} - label="Enable search bar" - /> + } + } /> + + { + setConfig({ + ...config, + searchBar: e.target.checked, + }); + localStorage.setItem( + 'settings', + JSON.stringify({ + ...config, + searchBar: e.target.checked, + }) + ); + }} + checked={config.searchBar} + label="Enable search bar" + /> + Settings} opened={props.opened || opened} onClose={() => setOpened(false)} diff --git a/tools/config.ts b/tools/config.ts index 3e8244e51..14eb1ec06 100644 --- a/tools/config.ts +++ b/tools/config.ts @@ -12,5 +12,6 @@ export function loadConfig(path: string): Config | null { } export interface Config { + searchUrl: string; searchBar: boolean, } \ No newline at end of file