Skip to content

Commit 3b394ed

Browse files
aseckinelisescu
aseckin
authored and
elisescu
committed
Applied prettier
1 parent 54595ca commit 3b394ed

2 files changed

Lines changed: 218 additions & 218 deletions

File tree

‎front_end/src/app/(main)/components/global_search.tsx‎

Lines changed: 115 additions & 115 deletions
Original file line numberDiff line numberDiff line change
@@ -1,115 +1,115 @@
1-
"use client";
2-
3-
import { debounce } from "lodash";
4-
import { useRouter } from "next/navigation";
5-
import { useTranslations } from "next-intl";
6-
import React, { useState, useEffect, useCallback } from "react";
7-
8-
import RandomButton from "@/components/random_button";
9-
import SearchInput from "@/components/search_input";
10-
import {
11-
POST_ORDER_BY_FILTER,
12-
POST_TEXT_SEARCH_FILTER,
13-
} from "@/constants/posts_feed";
14-
import { useGlobalSearchContext } from "@/contexts/global_search_context";
15-
import { QuestionOrder } from "@/types/question";
16-
import { sendAnalyticsEvent } from "@/utils/analytics";
17-
import cn from "@/utils/core/cn";
18-
import { encodeQueryParams } from "@/utils/navigation";
19-
20-
interface GlobalSearchProps {
21-
className?: string;
22-
isMobile?: boolean;
23-
onSubmit?: () => void;
24-
}
25-
26-
const GlobalSearch: React.FC<GlobalSearchProps> = ({
27-
className,
28-
isMobile = false,
29-
onSubmit,
30-
}) => {
31-
const t = useTranslations();
32-
const router = useRouter();
33-
const [isHidden, setIsHidden] = useState(true);
34-
35-
// eslint-disable-next-line react-hooks/exhaustive-deps
36-
const debouncedAnalyticsEvent = useCallback(
37-
debounce(() => {
38-
sendAnalyticsEvent("feedSearch", {
39-
event_category: "fromNavbar",
40-
});
41-
}, 2000),
42-
[]
43-
);
44-
45-
const {
46-
globalSearch,
47-
updateGlobalSearch,
48-
isVisible: otherSearchIsVisible,
49-
isSearched,
50-
setIsSearched,
51-
} = useGlobalSearchContext();
52-
53-
useEffect(() => {
54-
setIsHidden(otherSearchIsVisible);
55-
}, [otherSearchIsVisible]);
56-
57-
const eraseSearch = () => {
58-
updateGlobalSearch("");
59-
setIsSearched(false);
60-
};
61-
62-
const handleSearchSubmit = (searchQuery: string) => {
63-
debouncedAnalyticsEvent();
64-
onSubmit?.();
65-
setIsSearched(true);
66-
router.push(
67-
`/questions` +
68-
encodeQueryParams({
69-
[POST_TEXT_SEARCH_FILTER]: searchQuery,
70-
[POST_ORDER_BY_FILTER]: QuestionOrder.RankDesc,
71-
})
72-
);
73-
};
74-
75-
const visibilityClass = isMobile
76-
? "flex md:hidden"
77-
: isHidden
78-
? "hidden"
79-
: "hidden md:flex";
80-
81-
return (
82-
<div
83-
className={cn(
84-
"ml-2.5 items-center self-center xl:items-center",
85-
visibilityClass,
86-
className
87-
)}
88-
>
89-
<SearchInput
90-
value={globalSearch}
91-
onChange={(e) => updateGlobalSearch(e.target.value)}
92-
onErase={eraseSearch}
93-
onSubmit={handleSearchSubmit}
94-
placeholder={t("questionSearchPlaceholder")}
95-
size="base"
96-
className="w-full min-w-[220px]"
97-
inputClassName={cn(
98-
"text-white",
99-
"bg-blue-800 dark:bg-blue-800 hover:bg-blue-600 dark:hover:bg-blue-600 focus:bg-blue-900 dark:focus:bg-blue-900",
100-
"border border-blue-700 dark:border-blue-700 hover:border-blue-600 dark:hover:border-blue-600 focus:border-blue-600 dark:focus:border-blue-600",
101-
"outline-none focus:outline-1 focus:outline-offset-0 focus:outline-blue-600 dark:focus:outline-blue-600",
102-
"placeholder:text-blue-500 dark:placeholder:text-blue-500 focus:placeholder:text-blue-500/30 dark:focus:placeholder:text-blue-500/30",
103-
"outline-none focus:outline-none",
104-
{ "bg-blue-700 dark:bg-blue-700": isSearched }
105-
)}
106-
eraseButtonClassName="text-white dark:text-white hover:text-white"
107-
submitButtonClassName="hidden md:block"
108-
submitIconClassName="text-blue-500 dark:text-blue-500"
109-
/>
110-
<RandomButton />
111-
</div>
112-
);
113-
};
114-
115-
export default GlobalSearch;
1+
"use client";
2+
3+
import { debounce } from "lodash";
4+
import { useRouter } from "next/navigation";
5+
import { useTranslations } from "next-intl";
6+
import React, { useState, useEffect, useCallback } from "react";
7+
8+
import RandomButton from "@/components/random_button";
9+
import SearchInput from "@/components/search_input";
10+
import {
11+
POST_ORDER_BY_FILTER,
12+
POST_TEXT_SEARCH_FILTER,
13+
} from "@/constants/posts_feed";
14+
import { useGlobalSearchContext } from "@/contexts/global_search_context";
15+
import { QuestionOrder } from "@/types/question";
16+
import { sendAnalyticsEvent } from "@/utils/analytics";
17+
import cn from "@/utils/core/cn";
18+
import { encodeQueryParams } from "@/utils/navigation";
19+
20+
interface GlobalSearchProps {
21+
className?: string;
22+
isMobile?: boolean;
23+
onSubmit?: () => void;
24+
}
25+
26+
const GlobalSearch: React.FC<GlobalSearchProps> = ({
27+
className,
28+
isMobile = false,
29+
onSubmit,
30+
}) => {
31+
const t = useTranslations();
32+
const router = useRouter();
33+
const [isHidden, setIsHidden] = useState(true);
34+
35+
// eslint-disable-next-line react-hooks/exhaustive-deps
36+
const debouncedAnalyticsEvent = useCallback(
37+
debounce(() => {
38+
sendAnalyticsEvent("feedSearch", {
39+
event_category: "fromNavbar",
40+
});
41+
}, 2000),
42+
[]
43+
);
44+
45+
const {
46+
globalSearch,
47+
updateGlobalSearch,
48+
isVisible: otherSearchIsVisible,
49+
isSearched,
50+
setIsSearched,
51+
} = useGlobalSearchContext();
52+
53+
useEffect(() => {
54+
setIsHidden(otherSearchIsVisible);
55+
}, [otherSearchIsVisible]);
56+
57+
const eraseSearch = () => {
58+
updateGlobalSearch("");
59+
setIsSearched(false);
60+
};
61+
62+
const handleSearchSubmit = (searchQuery: string) => {
63+
debouncedAnalyticsEvent();
64+
onSubmit?.();
65+
setIsSearched(true);
66+
router.push(
67+
`/questions` +
68+
encodeQueryParams({
69+
[POST_TEXT_SEARCH_FILTER]: searchQuery,
70+
[POST_ORDER_BY_FILTER]: QuestionOrder.RankDesc,
71+
})
72+
);
73+
};
74+
75+
const visibilityClass = isMobile
76+
? "flex md:hidden"
77+
: isHidden
78+
? "hidden"
79+
: "hidden md:flex";
80+
81+
return (
82+
<div
83+
className={cn(
84+
"ml-2.5 items-center self-center xl:items-center",
85+
visibilityClass,
86+
className
87+
)}
88+
>
89+
<SearchInput
90+
value={globalSearch}
91+
onChange={(e) => updateGlobalSearch(e.target.value)}
92+
onErase={eraseSearch}
93+
onSubmit={handleSearchSubmit}
94+
placeholder={t("questionSearchPlaceholder")}
95+
size="base"
96+
className="w-full min-w-[220px]"
97+
inputClassName={cn(
98+
"text-white",
99+
"bg-blue-800 dark:bg-blue-800 hover:bg-blue-600 dark:hover:bg-blue-600 focus:bg-blue-900 dark:focus:bg-blue-900",
100+
"border border-blue-700 dark:border-blue-700 hover:border-blue-600 dark:hover:border-blue-600 focus:border-blue-600 dark:focus:border-blue-600",
101+
"outline-none focus:outline-1 focus:outline-offset-0 focus:outline-blue-600 dark:focus:outline-blue-600",
102+
"placeholder:text-blue-500 dark:placeholder:text-blue-500 focus:placeholder:text-blue-500/30 dark:focus:placeholder:text-blue-500/30",
103+
"outline-none focus:outline-none",
104+
{ "bg-blue-700 dark:bg-blue-700": isSearched }
105+
)}
106+
eraseButtonClassName="text-white dark:text-white hover:text-white"
107+
submitButtonClassName="hidden md:block"
108+
submitIconClassName="text-blue-500 dark:text-blue-500"
109+
/>
110+
<RandomButton />
111+
</div>
112+
);
113+
};
114+
115+
export default GlobalSearch;

0 commit comments

Comments
 (0)