) => {
const navigate = useNavigate();
const [isNegative, setIsNegative] = useState(false);
const parsed = parseSearchQuery(query);
-
- useEffect(() => {
- if (!parsed.keywords) {
- setIsNegative(false);
- return;
- }
-
- let isMounted = true;
- analyzeSentiment(parsed.keywords)
- .then((result) => {
- if (isMounted) {
- setIsNegative(result.label === "negative");
- }
- })
- .catch(() => {
- if (isMounted) {
- setIsNegative(false);
- }
- });
-
- return () => {
- isMounted = false;
- };
- }, [parsed.keywords]);
+ const keywords = parsed.keywords;
+
+ useDebounceEffect(
+ () => {
+ if (keywords == null || keywords.trim().length === 0) {
+ setIsNegative(false);
+ return;
+ }
+
+ let isMounted = true;
+ fetchNegaposi(keywords)
+ .then((result) => {
+ if (isMounted) {
+ setIsNegative(result.label === "negative");
+ }
+ })
+ .catch(() => {
+ if (isMounted) {
+ setIsNegative(false);
+ }
+ });
+
+ return () => {
+ isMounted = false;
+ };
+ },
+ 100,
+ [keywords],
+ );
const searchConditionText = useMemo(() => {
const parts: string[] = [];
@@ -86,7 +99,12 @@ const SearchPageComponent = ({
const onSubmit = (values: SearchFormData) => {
const sanitizedText = sanitizeSearchText(values.searchText.trim());
- navigate(`/search?q=${encodeURIComponent(sanitizedText)}`);
+ navigate({
+ to: "/search",
+ search: {
+ q: sanitizedText,
+ },
+ });
};
return (
@@ -108,7 +126,7 @@ const SearchPageComponent = ({
{query && (
- {searchConditionText} の検索結果 ({results.length} 件)
+ {searchConditionText} の検索結果 ({total} 件)
)}
@@ -117,8 +135,12 @@ const SearchPageComponent = ({
-
どしたん話聞こうか?
-
言わなくてもいいけど、言ってもいいよ。
+
+ どしたん話聞こうか?
+
+
+ 言わなくてもいいけど、言ってもいいよ。
+
diff --git a/application/client/src/components/auth_modal/AuthModalPage.tsx b/application/client/src/components/auth_modal/AuthModalPage.tsx
index 08996f9afd..abecb27a3b 100644
--- a/application/client/src/components/auth_modal/AuthModalPage.tsx
+++ b/application/client/src/components/auth_modal/AuthModalPage.tsx
@@ -1,7 +1,12 @@
import { useSelector } from "react-redux";
-import { Field, formValueSelector, InjectedFormProps, reduxForm } from "redux-form";
+import {
+ Field,
+ formValueSelector,
+ type InjectedFormProps,
+ reduxForm,
+} from "redux-form";
-import { AuthFormData } from "@web-speed-hackathon-2026/client/src/auth/types";
+import type { AuthFormData } from "@web-speed-hackathon-2026/client/src/auth/types";
import { validate } from "@web-speed-hackathon-2026/client/src/auth/validation";
import { FormInputField } from "@web-speed-hackathon-2026/client/src/components/foundation/FormInputField";
import { Link } from "@web-speed-hackathon-2026/client/src/components/foundation/Link";
@@ -36,7 +41,9 @@ const AuthModalPageComponent = ({
{type === "signup" ? (
-
+
利用規約
に同意して
diff --git a/application/client/src/components/crok/ChatInput.tsx b/application/client/src/components/crok/ChatInput.tsx
index 6f8c17796b..a629cc7fed 100644
--- a/application/client/src/components/crok/ChatInput.tsx
+++ b/application/client/src/components/crok/ChatInput.tsx
@@ -1,7 +1,4 @@
-import Bluebird from "bluebird";
-import kuromoji, { type Tokenizer, type IpadicFeatures } from "kuromoji";
import {
- useEffect,
useLayoutEffect,
useRef,
useState,
@@ -9,13 +6,8 @@ import {
type FormEvent,
type KeyboardEvent,
} from "react";
-
-import { FontAwesomeIcon } from "@web-speed-hackathon-2026/client/src/components/foundation/FontAwesomeIcon";
-import {
- extractTokens,
- filterSuggestionsBM25,
-} from "@web-speed-hackathon-2026/client/src/utils/bm25_search";
-import { fetchJSON } from "@web-speed-hackathon-2026/client/src/utils/fetchers";
+import { useDebounceEffect } from "../../hooks/use_debounce_effect";
+import { fetchSuggestions } from "../../utils/fetch_with_cache";
interface Props {
isStreaming: boolean;
@@ -23,7 +15,10 @@ interface Props {
}
// トークン単位でハイライト
-function highlightMatchByTokens(text: string, queryTokens: string[]): React.ReactNode {
+function highlightMatchByTokens(
+ text: string,
+ queryTokens: string[],
+): React.ReactNode {
if (queryTokens.length === 0) return text;
const lowerText = text.toLowerCase();
@@ -79,7 +74,6 @@ function highlightMatchByTokens(text: string, queryTokens: string[]): React.Reac
export const ChatInput = ({ isStreaming, onSendMessage }: Props) => {
const textareaRef = useRef(null);
const suggestionsRef = useRef(null);
- const [tokenizer, setTokenizer] = useState | null>(null);
const [inputValue, setInputValue] = useState("");
const [suggestions, setSuggestions] = useState([]);
const [queryTokens, setQueryTokens] = useState([]);
@@ -92,79 +86,42 @@ export const ChatInput = ({ isStreaming, onSendMessage }: Props) => {
}
}, [suggestions, showSuggestions]);
- // 初回にkuromojiトークナイザーを構築
- useEffect(() => {
- let mounted = true;
-
- const init = async () => {
- const builder = Bluebird.promisifyAll(kuromoji.builder({ dicPath: "/dicts" }));
- const nextTokenizer = await builder.buildAsync();
- if (mounted) {
- setTokenizer(nextTokenizer);
- }
- };
- init();
-
- return () => {
- mounted = false;
- };
- }, []);
-
- useEffect(() => {
- let cancelled = false;
-
- const updateSuggestions = async () => {
- if (!tokenizer || !inputValue.trim()) {
- setSuggestions([]);
- setQueryTokens([]);
- setShowSuggestions(false);
- return;
- }
-
- const { suggestions: candidates } = await fetchJSON<{ suggestions: string[] }>(
- "/api/v1/crok/suggestions",
- );
- if (cancelled) {
- return;
- }
-
- const tokens = extractTokens(tokenizer.tokenize(inputValue));
- const results = filterSuggestionsBM25(tokenizer, candidates, tokens);
-
- if (cancelled) {
- return;
- }
-
- setQueryTokens(tokens);
- setSuggestions(results);
- setShowSuggestions(results.length > 0);
- };
-
- void updateSuggestions();
-
- return () => {
- cancelled = true;
- };
- }, [inputValue, tokenizer]);
-
- const adjustTextareaHeight = () => {
- const textarea = textareaRef.current;
- if (textarea) {
- textarea.style.height = "auto";
- textarea.style.height = `${Math.min(textarea.scrollHeight, 200)}px`;
- }
- };
-
- const resetTextareaHeight = () => {
- if (textareaRef.current) {
- textareaRef.current.style.height = "auto";
- }
- };
+ useDebounceEffect(
+ () => {
+ let cancelled = false;
+
+ const updateSuggestions = async () => {
+ if (!inputValue.trim()) {
+ setSuggestions([]);
+ setQueryTokens([]);
+ setShowSuggestions(false);
+ return;
+ }
+
+ const { suggestions: candidates, tokens } =
+ await fetchSuggestions(inputValue);
+ if (cancelled) {
+ return;
+ }
+
+ setQueryTokens(tokens);
+ setSuggestions(candidates);
+ setShowSuggestions(candidates.length > 0);
+ };
+
+ void updateSuggestions();
+
+ return () => {
+ cancelled = true;
+ };
+ },
+ 100,
+ [inputValue],
+ );
const handleInputChange = (e: ChangeEvent) => {
const value = e.target.value;
setInputValue(value);
- adjustTextareaHeight();
};
const handleSuggestionClick = (suggestion: string) => {
@@ -182,7 +139,6 @@ export const ChatInput = ({ isStreaming, onSendMessage }: Props) => {
setSuggestions([]);
setQueryTokens([]);
setShowSuggestions(false);
- resetTextareaHeight();
}
};
@@ -218,7 +174,7 @@ export const ChatInput = ({ isStreaming, onSendMessage }: Props) => {