Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 1b4e679

Browse files
committed
create an enum for query params, change search to q
1 parent 43bcf18 commit 1b4e679

File tree

3 files changed

+15
-9
lines changed

3 files changed

+15
-9
lines changed

‎src/components/SearchInput.tsx‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { useCallback, useEffect, useRef, useState } from "react";
22
import { useSearchParams } from "react-router-dom";
33

44
import { useAppContext } from "@contexts/AppContext";
5+
import { QueryParams } from "@utils/enums";
56

67
import { SearchIcon } from "./Icons";
78

@@ -28,7 +29,7 @@ const SearchInput = () => {
2829
const clearSearch = useCallback(() => {
2930
setInputVal("");
3031
setSearchText("");
31-
searchParams.delete("search");
32+
searchParams.delete(QueryParams.SEARCH);
3233
setSearchParams(searchParams);
3334
}, [searchParams, setSearchParams, setSearchText]);
3435

@@ -63,10 +64,10 @@ const SearchInput = () => {
6364

6465
setSearchText(formattedVal);
6566
if (!formattedVal) {
66-
searchParams.delete("search");
67+
searchParams.delete(QueryParams.SEARCH);
6768
setSearchParams(searchParams);
6869
} else {
69-
searchParams.set("search", formattedVal);
70+
searchParams.set(QueryParams.SEARCH, formattedVal);
7071
setSearchParams(searchParams);
7172
}
7273
},
@@ -89,9 +90,9 @@ const SearchInput = () => {
8990
* Set the input value and search text to the search query from the URL
9091
*/
9192
useEffect(() => {
92-
const search = searchParams.get("search") || "";
93-
setInputVal(search);
94-
setSearchText(search);
93+
const searchQuery = searchParams.get(QueryParams.SEARCH) || "";
94+
setInputVal(searchQuery);
95+
setSearchText(searchQuery);
9596
// eslint-disable-next-line react-hooks/exhaustive-deps
9697
}, []);
9798

‎src/components/SnippetList.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { useSearchParams } from "react-router-dom";
55
import { useAppContext } from "@contexts/AppContext";
66
import { useSnippets } from "@hooks/useSnippets";
77
import { SnippetType } from "@types";
8+
import { QueryParams } from "@utils/enums";
89
import { slugify } from "@utils/slugify";
910

1011
import { LeftAngleArrowIcon } from "./Icons";
@@ -22,22 +23,22 @@ const SnippetList = () => {
2223
const handleOpenModal = (selected: SnippetType) => () => {
2324
setIsModalOpen(true);
2425
setSnippet(selected);
25-
searchParams.set("snippet", slugify(selected.title));
26+
searchParams.set(QueryParams.SNIPPET, slugify(selected.title));
2627
setSearchParams(searchParams);
2728
};
2829

2930
const handleCloseModal = () => {
3031
setIsModalOpen(false);
3132
setSnippet(null);
32-
searchParams.delete("snippet");
33+
searchParams.delete(QueryParams.SNIPPET);
3334
setSearchParams(searchParams);
3435
};
3536

3637
/**
3738
* open the relevant modal if the snippet is in the search params
3839
*/
3940
useEffect(() => {
40-
const snippetSlug = searchParams.get("snippet");
41+
const snippetSlug = searchParams.get(QueryParams.SNIPPET);
4142
if (!snippetSlug) {
4243
return;
4344
}

‎src/utils/enums.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export enum QueryParams {
2+
SEARCH = "q",
3+
SNIPPET = "snippet",
4+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /