mirror of
https://github.com/ItzCrazyKns/Perplexica.git
synced 2025-09-19 07:41:33 +00:00
feat(opensearch): Add autocomplete functionality to opensearch. This gets proxied to the searxng instance.
This commit is contained in:
@@ -32,9 +32,11 @@ const SearchImages = ({
|
||||
const handleShowMore = () => {
|
||||
// If we're already showing all images, don't do anything
|
||||
if (images && displayLimit >= images.length) return;
|
||||
|
||||
|
||||
// Otherwise, increase the display limit by 10, or show all images
|
||||
setDisplayLimit(prev => images ? Math.min(prev + 10, images.length) : prev);
|
||||
setDisplayLimit((prev) =>
|
||||
images ? Math.min(prev + 10, images.length) : prev,
|
||||
);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
@@ -92,7 +94,6 @@ const SearchImages = ({
|
||||
if (onImagesLoaded && images.length > 0) {
|
||||
onImagesLoaded(images.length);
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error fetching images:', error);
|
||||
} finally {
|
||||
@@ -101,7 +102,6 @@ const SearchImages = ({
|
||||
};
|
||||
|
||||
fetchImages();
|
||||
|
||||
}, [query, messageId, chatHistory, onImagesLoaded]);
|
||||
|
||||
return (
|
||||
@@ -118,7 +118,10 @@ const SearchImages = ({
|
||||
)}
|
||||
{images !== null && images.length > 0 && (
|
||||
<>
|
||||
<div className="grid grid-cols-2 gap-2" key={`image-results-${messageId}`}>
|
||||
<div
|
||||
className="grid grid-cols-2 gap-2"
|
||||
key={`image-results-${messageId}`}
|
||||
>
|
||||
{images.slice(0, displayLimit).map((image, i) => (
|
||||
<img
|
||||
onClick={() => {
|
||||
@@ -142,8 +145,10 @@ const SearchImages = ({
|
||||
onClick={handleShowMore}
|
||||
className="px-4 py-2 bg-light-secondary dark:bg-dark-secondary hover:bg-light-200 dark:hover:bg-dark-200 text-black/70 dark:text-white/70 hover:text-black dark:hover:text-white rounded-md transition duration-200 flex items-center space-x-2"
|
||||
>
|
||||
<span>Show More Images</span>
|
||||
<span className="text-sm opacity-75">({displayLimit} of {images.length})</span>
|
||||
<span>Show More Images</span>
|
||||
<span className="text-sm opacity-75">
|
||||
({displayLimit} of {images.length})
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
@@ -48,9 +48,11 @@ const Searchvideos = ({
|
||||
const handleShowMore = () => {
|
||||
// If we're already showing all videos, don't do anything
|
||||
if (videos && displayLimit >= videos.length) return;
|
||||
|
||||
|
||||
// Otherwise, increase the display limit by 10, or show all videos
|
||||
setDisplayLimit(prev => videos ? Math.min(prev + 10, videos.length) : prev);
|
||||
setDisplayLimit((prev) =>
|
||||
videos ? Math.min(prev + 10, videos.length) : prev,
|
||||
);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
@@ -118,7 +120,6 @@ const Searchvideos = ({
|
||||
};
|
||||
|
||||
fetchVideos();
|
||||
|
||||
}, [query, messageId, chatHistory, onVideosLoaded]);
|
||||
|
||||
return (
|
||||
@@ -135,7 +136,10 @@ const Searchvideos = ({
|
||||
)}
|
||||
{videos !== null && videos.length > 0 && (
|
||||
<>
|
||||
<div className="grid grid-cols-2 gap-2" key={`video-results-${messageId}`}>
|
||||
<div
|
||||
className="grid grid-cols-2 gap-2"
|
||||
key={`video-results-${messageId}`}
|
||||
>
|
||||
{videos.slice(0, displayLimit).map((video, i) => (
|
||||
<div
|
||||
onClick={() => {
|
||||
@@ -167,8 +171,10 @@ const Searchvideos = ({
|
||||
onClick={handleShowMore}
|
||||
className="px-4 py-2 bg-light-secondary dark:bg-dark-secondary hover:bg-light-200 dark:hover:bg-dark-200 text-black/70 dark:text-white/70 hover:text-black dark:hover:text-white rounded-md transition duration-200 flex items-center space-x-2"
|
||||
>
|
||||
<span>Show More Videos</span>
|
||||
<span className="text-sm opacity-75">({displayLimit} of {videos.length})</span>
|
||||
<span>Show More Videos</span>
|
||||
<span className="text-sm opacity-75">
|
||||
({displayLimit} of {videos.length})
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
Reference in New Issue
Block a user