const { autocomplete, getAlgoliaResults } = window['@algolia/autocomplete-js']; const appId = "CWDXLQJ3IB"; const apiKey = "28e718a2fb3db5ca9997d844c6594dce"; const searchClient = algoliasearch(appId, apiKey); // Debounce function function debounce(func, wait) { let timeout; return function executedFunction(...args) { return new Promise((resolve) => { const later = () => { clearTimeout(timeout); resolve(func(...args)); }; clearTimeout(timeout); timeout = setTimeout(later, wait); }); }; } const { setIsOpen } = autocomplete({ container: "#autocomplete", placeholder: "Search ( ⌘ + k )", detachedMediaQuery: '', openOnFocus: true, getSources({ query, state }) { if (!query) { return [ { sourceId: 'commonLinks', getItems() { return [ { label: 'Image', url: '/category/ai-image-generators-from-text-tools', icon: ` `, description: 'Create and manipulate images with AI.', }, { label: 'Design', url: '/category/ai-design-tools', icon: ` `, description: 'Design faster with AI.', }, { label: 'Writing', url: '/category/ai-writing-tools-and-generators', icon: ` `, description: 'Write faster with AI.', }, { label: 'Business', url: '/category/business-ai-tools', icon: ` IcOutlineBusiness-svg`, description: 'Manage your business with AI.', }, { label: 'Assistant', url: '/category/ai-assistant-tools', icon: ` `, description: 'AI assistants for your life.', }, { label: 'Categories', url: '/categories', icon: ` `, description: 'View all categories on Dang', }, ]; }, templates: { item({ item, html }) { return html`
${html([item.icon])}
${item.label}
${item.description}
`; }, header({ html }) { return html`
`; }, }, onSelect({ item }) { window.open(item.url, '_blank'); }, }, ]; } // Debounced function for fetching Algolia results const debouncedFetch = debounce(() => { return [ { sourceId: "Categories", getItems() { return getAlgoliaResults({ searchClient, queries: [ { indexName: 'Categories', query, params: { attributesToSnippet: ['name:10', 'summary:35'], snippetEllipsisText: '...', hitsPerPage: 10 } } ] }); }, templates: { header({ items, html }) { return html`Categories
`; }, item({ item, components, html }) { return html`
${item.Name}
${components.Snippet({ hit: item, attribute: 'name', })}
${components.Snippet({ hit: item, attribute: 'primaryDescription', })}
`; }, noResults() { return "No posts for this query."; } }, getItemUrl({ item }) { return item.wfurl; }, }, { sourceId: "Tools", getItems() { return getAlgoliaResults({ searchClient, queries: [ { indexName: 'Tools', query, params: { attributesToSnippet: ['name:10', 'summary:35'], snippetEllipsisText: '...', hitsPerPage: 10 } } ] }); }, templates: { header({ items, html }) { return html`Tools
`; }, item({ item, components, html }) { return html`
${item.name}
${components.Snippet({ hit: item, attribute: 'name', })}
${components.Snippet({ hit: item, attribute: 'primaryDescription', })}
`; }, noResults() { return "No posts for this query."; } }, getItemUrl({ item }) { return item.wfurl; }, }, ]; }, 1000); // 600ms debounce time, adjust as needed return debouncedFetch(); } }); document.addEventListener('keydown', (event) => { if (event.metaKey && event.key.toLowerCase() === 'k') { setIsOpen(true); } });