From 766b86e7d80464f509c653fab0fc0d3c13bb963e Mon Sep 17 00:00:00 2001 From: ari7946 Date: Sun, 28 Aug 2022 12:27:09 -0700 Subject: [PATCH 1/8] Update changes to cypress tests --- cypress/integration/issue-list.spec.ts | 2 +- cypress/integration/navigation.spec.ts | 14 +-- cypress/integration/project-list.spec.ts | 6 +- cypress/tsconfig.json | 20 ++-- package.json | 119 +++++++++++------------ tsconfig.json | 41 ++++++-- 6 files changed, 113 insertions(+), 89 deletions(-) diff --git a/cypress/integration/issue-list.spec.ts b/cypress/integration/issue-list.spec.ts index 360a34a..d7941f8 100644 --- a/cypress/integration/issue-list.spec.ts +++ b/cypress/integration/issue-list.spec.ts @@ -19,7 +19,7 @@ describe("Issue List", () => { }); // open issues page - cy.visit("http://localhost:3000/issues"); + cy.visit(`http://localhost:3000/dashboard/issues`); // wait for request to resolve cy.wait("@getProjects"); diff --git a/cypress/integration/navigation.spec.ts b/cypress/integration/navigation.spec.ts index 1c19319..0f7749a 100644 --- a/cypress/integration/navigation.spec.ts +++ b/cypress/integration/navigation.spec.ts @@ -1,6 +1,6 @@ describe("Sidebar Navigation", () => { beforeEach(() => { - cy.visit("http://localhost:3000"); + cy.visit("http://localhost:3000/dashboard"); }); context("desktop resolution", () => { @@ -11,19 +11,19 @@ describe("Sidebar Navigation", () => { it("links are working", () => { // check that each link leads to the correct page cy.get("nav").contains("Issues").click(); - cy.url().should("eq", "http://localhost:3000/issues"); + cy.url().should("eq", "http://localhost:3000/dashboard/issues"); cy.get("nav").contains("Projects").click(); - cy.url().should("eq", "http://localhost:3000/"); + cy.url().should("eq", "http://localhost:3000/dashboard"); cy.get("nav").contains("Alerts").click(); - cy.url().should("eq", "http://localhost:3000/alerts"); + cy.url().should("eq", "http://localhost:3000/dashboard/alerts"); cy.get("nav").contains("Users").click(); - cy.url().should("eq", "http://localhost:3000/users"); + cy.url().should("eq", "http://localhost:3000/dashboard/users"); cy.get("nav").contains("Settings").click(); - cy.url().should("eq", "http://localhost:3000/settings"); + cy.url().should("eq", "http://localhost:3000/dashboard/settings"); }); it("is collapsible", () => { @@ -32,7 +32,7 @@ describe("Sidebar Navigation", () => { // check that links still exist and are functionable cy.get("nav").find("a").should("have.length", 5).eq(1).click(); - cy.url().should("eq", "http://localhost:3000/issues"); + cy.url().should("eq", "http://localhost:3000/dashboard/issues"); // check that text is not rendered cy.get("nav").contains("Issues").should("not.exist"); diff --git a/cypress/integration/project-list.spec.ts b/cypress/integration/project-list.spec.ts index e6fa28c..da4dc43 100644 --- a/cypress/integration/project-list.spec.ts +++ b/cypress/integration/project-list.spec.ts @@ -9,7 +9,7 @@ describe("Project List", () => { }).as("getProjects"); // open projects page - cy.visit("http://localhost:3000"); + cy.visit("http://localhost:3000/dashboard"); // wait for request to resolve cy.wait("@getProjects"); @@ -33,7 +33,9 @@ describe("Project List", () => { cy.wrap($el).contains(mockProjects[index].numIssues); cy.wrap($el).contains(mockProjects[index].numEvents24h); cy.wrap($el).contains(capitalize(mockProjects[index].status)); - cy.wrap($el).find("a").should("have.attr", "href", "/issues"); + cy.wrap($el) + .find("a") + .should("have.attr", "href", "/dashboard/issues"); }); }); }); diff --git a/cypress/tsconfig.json b/cypress/tsconfig.json index f4ad644..6d0c18e 100644 --- a/cypress/tsconfig.json +++ b/cypress/tsconfig.json @@ -1,11 +1,13 @@ { - "extends": "../tsconfig.json", - "compilerOptions": { - "noEmit": true, - "isolatedModules": false, - // be explicit about types included - // to avoid clashing with Jest types - "types": ["cypress"] - }, - "include": ["../node_modules/cypress", "./**/*.ts"] + "extends": "../tsconfig.json", + "compilerOptions": { + "target": "es5", + "lib": ["es5", "dom"], + // be explicit about types included + // to avoid clashing with Jest types + "types": ["cypress", "node"], + "isolatedModules": false + }, + "include": ["**/*.ts", "cypress"], + "exclude": ["node_modules"] } diff --git a/package.json b/package.json index 2e03cd8..2993e41 100644 --- a/package.json +++ b/package.json @@ -1,62 +1,61 @@ { - "name": "prolog-app", - "version": "14.5.1", - "private": true, - "scripts": { - "dev": "next dev", - "build": "next build", - "start": "next start", - "lint": "next lint", - "prettier": "prettier --check .", - "cypress": "cypress open", - "test": "jest --watch", - "storybook": "start-storybook -p 6006", - "build-storybook": "build-storybook", - "prepare": "husky install" - }, - "lint-staged": { - "*.{js,jsx,ts,tsx}": "eslint --cache --fix", - "*.{ts,tsx}": "tsc-files --noEmit --incremental false", - "*.{js,jsx,ts,tsx,css,md}": "prettier --write" - }, - "dependencies": { - "@fontsource/inter": "^4.5.7", - "@types/lodash": "^4.14.181", - "axios": "^0.26.1", - "next": "12.1.0", - "react": "17.0.2", - "react-dom": "17.0.2", - "react-query": "^3.34.19", - "styled-components": "^5.3.3", - "styled-normalize": "^8.0.7" - }, - "devDependencies": { - "@babel/core": "^7.17.5", - "@storybook/addon-actions": "^6.4.19", - "@storybook/addon-essentials": "^6.4.19", - "@storybook/addon-interactions": "^6.4.19", - "@storybook/addon-links": "^6.4.19", - "@storybook/react": "^6.4.19", - "@storybook/testing-library": "^0.0.9", - "@types/jest": "^27.4.1", - "@types/node": "17.0.21", - "@types/react": "17.0.39", - "@types/styled-components": "^5.1.24", - "@typescript-eslint/eslint-plugin": "^5.18.0", - "@typescript-eslint/parser": "^5.18.0", - "babel-loader": "^8.2.3", - "cypress": "^9.5.1", - "eslint": "8.10.0", - "eslint-config-next": "12.1.0", - "eslint-config-prettier": "^8.5.0", - "eslint-plugin-cypress": "^2.12.1", - "eslint-plugin-storybook": "^0.5.7", - "husky": "^7.0.4", - "jest": "^27.5.1", - "lint-staged": "^12.3.5", - "lodash": "^4.17.21", - "prettier": "^2.3.0", - "tsc-files": "^1.1.3", - "typescript": "4.6.2" - } + "name": "prolog-app", + "version": "14.5.1", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start", + "lint": "next lint", + "prettier": "prettier --check .", + "cypress": "cypress open", + "test": "jest --watch", + "storybook": "start-storybook -p 6006", + "build-storybook": "build-storybook", + "prepare": "husky install" + }, + "lint-staged": { + "*.{js,jsx,ts,tsx}": "eslint --cache --fix", + "*.{ts,tsx}": "bash -c 'tsc --noEmit'", + "*.{js,jsx,ts,tsx,css,md}": "prettier --write" + }, + "dependencies": { + "@fontsource/inter": "^4.5.7", + "@types/lodash": "^4.14.181", + "axios": "^0.26.1", + "next": "12.1.0", + "react": "17.0.2", + "react-dom": "17.0.2", + "react-query": "^3.34.19", + "styled-components": "^5.3.3", + "styled-normalize": "^8.0.7" + }, + "devDependencies": { + "@babel/core": "^7.17.5", + "@storybook/addon-actions": "^6.4.19", + "@storybook/addon-essentials": "^6.4.19", + "@storybook/addon-interactions": "^6.4.19", + "@storybook/addon-links": "^6.4.19", + "@storybook/react": "^6.4.19", + "@storybook/testing-library": "^0.0.9", + "@types/jest": "^27.4.1", + "@types/node": "17.0.21", + "@types/react": "17.0.39", + "@types/styled-components": "^5.1.24", + "@typescript-eslint/eslint-plugin": "^5.18.0", + "@typescript-eslint/parser": "^5.18.0", + "babel-loader": "^8.2.3", + "cypress": "^9.5.1", + "eslint": "8.10.0", + "eslint-config-next": "12.1.0", + "eslint-config-prettier": "^8.5.0", + "eslint-plugin-cypress": "^2.12.1", + "eslint-plugin-storybook": "^0.5.7", + "husky": "^7.0.4", + "jest": "^27.5.1", + "lint-staged": "^12.3.5", + "lodash": "^4.17.21", + "prettier": "^2.3.0", + "typescript": "4.6.2" + } } diff --git a/tsconfig.json b/tsconfig.json index 1fbe0e9..85beca0 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,12 +1,15 @@ { "compilerOptions": { "target": "es5", - "lib": ["dom", "dom.iterable", "esnext"], + "lib": [ + "dom", + "dom.iterable", + "esnext" + ], "allowJs": true, "skipLibCheck": true, "strict": true, "forceConsistentCasingInFileNames": true, - "noEmit": true, "esModuleInterop": true, "module": "esnext", "moduleResolution": "node", @@ -14,15 +17,33 @@ "isolatedModules": true, "jsx": "preserve", "incremental": true, - "types": ["jest"], + "types": [ + "jest" + ], "baseUrl": ".", "paths": { - "@styles/*": ["styles/*"], - "@config/*": ["config/*"], - "@features/*": ["features/*"], - "@typings/*": ["typings/*"] - } + "@styles/*": [ + "styles/*" + ], + "@config/*": [ + "config/*" + ], + "@features/*": [ + "features/*" + ], + "@typings/*": [ + "typings/*" + ] + }, + "noEmit": true }, - "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], - "exclude": ["node_modules", "**/*.test.ts", "**/*.test.tsx"] + "include": [ + "next-env.d.ts", + "**/*.ts", + "**/*.tsx" + ], + "exclude": [ + "node_modules", + "cypress" + ] } From 50b3e35d3ef95ef536d4c1415260c48d69fe6e6e Mon Sep 17 00:00:00 2001 From: ari7946 Date: Fri, 23 Sep 2022 15:29:50 -0700 Subject: [PATCH 2/8] Set hardcoded filters, testing out API --- features/issues/api/use-issues.tsx | 29 +++++++++++++++++++++-------- 1 file changed, 21 insertions(+), 8 deletions(-) diff --git a/features/issues/api/use-issues.tsx b/features/issues/api/use-issues.tsx index ad2d4b8..645993f 100644 --- a/features/issues/api/use-issues.tsx +++ b/features/issues/api/use-issues.tsx @@ -1,20 +1,32 @@ -import { useEffect } from "react"; +import { useEffect, useState } from "react"; import { useQuery, useQueryClient } from "react-query"; import axios from "axios"; import type { Page } from "@typings/page.types"; import type { Issue } from "../types/issue.types"; -async function getIssues(page: number) { +async function getIssues(page: number, filters: Filters) { const { data } = await axios.get( - `https://prolog-api.profy.dev/issue?page=${page}` + `https://prolog-api.profy.dev/issue?page=${page}`, + { params: filters } ); + console.log("data", data); return data; } +type Filters = { + status: null | "open" | "resolved"; + level: null | "error" | "warning" | "info"; +}; + export function useIssues(page: number) { + const [filters, setFilters] = useState({ + status: "open", + level: null, + }); + const query = useQuery, Error>( - ["issues", page], - () => getIssues(page), + ["issues", page, filters], + () => getIssues(page, filters), { keepPreviousData: true, staleTime: 60000, @@ -25,10 +37,11 @@ export function useIssues(page: number) { const queryClient = useQueryClient(); useEffect(() => { if (query.data?.meta.hasNextPage) { - queryClient.prefetchQuery(["projects", page + 1], () => - getIssues(page + 1) + queryClient.prefetchQuery(["projects", page + 1, filters], () => + getIssues(page + 1, filters) ); } - }, [query.data, page, queryClient]); + }, [query.data, page, queryClient, filters]); + return query; } From 2ba6d4b2f2f67b18fd2033a7c53a088d29e9cda4 Mon Sep 17 00:00:00 2001 From: ari7946 Date: Tue, 10 Jan 2023 14:48:12 -0800 Subject: [PATCH 3/8] Refactor to use filter values from the URL instead of keeping them in state - eliminating the need to use context and useEffect for query params --- .../issues/components/filters/filters.tsx | 62 +++++++++---------- features/issues/hooks/use-filters.tsx | 28 ++++++++- 2 files changed, 56 insertions(+), 34 deletions(-) diff --git a/features/issues/components/filters/filters.tsx b/features/issues/components/filters/filters.tsx index 07a0f26..437e448 100644 --- a/features/issues/components/filters/filters.tsx +++ b/features/issues/components/filters/filters.tsx @@ -52,12 +52,12 @@ const RightContainer = styled.div` export function Filters() { const { handleFilters, filters } = useFilters(); const { data: projects } = useProjects(); - const router = useRouter(); - const routerQueryProjectName = - (router.query.projectName as string)?.toLowerCase() || undefined; + // const router = useRouter(); + // const routerQueryProjectName = + // (router.query.projectName as string)?.toLowerCase() || undefined; const [inputValue, setInputValue] = useState(""); const projectNames = projects?.map((project) => project.name.toLowerCase()); - const isFirst = useRef(true); + // const isFirst = useRef(true); const { width } = useWindowSize(); const isMobileScreen = width <= 1023; const { isMobileMenuOpen } = useContext(NavigationContext); @@ -101,33 +101,33 @@ export function Filters() { [handleFilters] ); - useEffect(() => { - const newObj: { [key: string]: string } = { - ...filters, - }; - - Object.keys(newObj).forEach((key) => { - if (newObj[key] === undefined) { - delete newObj[key]; - } - }); - - const url = { - pathname: router.pathname, - query: { - page: router.query.page || 1, - ...newObj, - }, - }; - - if (routerQueryProjectName && isFirst) { - handleProjectName(routerQueryProjectName); - setInputValue(routerQueryProjectName || ""); - isFirst.current = false; - } - - router.push(url, undefined, { shallow: false }); - }, [filters.level, filters.status, filters.project, router.query.page]); + // useEffect(() => { + // const newObj: { [key: string]: string } = { + // ...filters, + // }; + + // Object.keys(newObj).forEach((key) => { + // if (newObj[key] === undefined) { + // delete newObj[key]; + // } + // }); + + // const url = { + // pathname: router.pathname, + // query: { + // page: router.query.page || 1, + // ...newObj, + // }, + // }; + + // if (routerQueryProjectName && isFirst) { + // handleProjectName(routerQueryProjectName); + // setInputValue(routerQueryProjectName || ""); + // isFirst.current = false; + // } + + // router.push(url, undefined, { shallow: false }); + // }, [filters.level, filters.status, filters.project, router.query.page]); return ( diff --git a/features/issues/hooks/use-filters.tsx b/features/issues/hooks/use-filters.tsx index 8ebce02..440aec6 100644 --- a/features/issues/hooks/use-filters.tsx +++ b/features/issues/hooks/use-filters.tsx @@ -1,4 +1,26 @@ -import { useContext } from "react"; -import { FiltersContext } from "../context/filters-context"; +// import { useContext } from "react"; +// import { FiltersContext } from "../context/filters-context"; -export const useFilters = () => useContext(FiltersContext); +// export const useFilters = () => useContext(FiltersContext); + +import { useRouter } from "next/router"; +import { IssueFilters } from "../types/issue.types"; + +export const useFilters = () => { + const router = useRouter(); + + // Derives filter values from the URL + const filters = { + status: router.query.status, + level: router.query.level, + project: router.query.project, + } as IssueFilters; + + // Updates URL with router.push + const handleFilters = (newFilters: IssueFilters) => { + const query = { ...router.query, ...newFilters }; + router.push({ query }); + }; + + return { filters, handleFilters }; +}; From af24c44e517043deb576ae9965149c2b6788af4d Mon Sep 17 00:00:00 2001 From: ari7946 Date: Tue, 10 Jan 2023 15:16:42 -0800 Subject: [PATCH 4/8] Introduce functions for getting default Level and Status values --- .../issues/components/filters/filters.tsx | 42 +++++++++++++------ 1 file changed, 29 insertions(+), 13 deletions(-) diff --git a/features/issues/components/filters/filters.tsx b/features/issues/components/filters/filters.tsx index 437e448..bded854 100644 --- a/features/issues/components/filters/filters.tsx +++ b/features/issues/components/filters/filters.tsx @@ -1,11 +1,7 @@ -import React, { - useState, - useEffect, - useCallback, - useRef, - useContext, -} from "react"; +import React, { useState, useCallback, useContext } from "react"; import styled from "styled-components"; +import { capitalize } from "lodash"; + import { Select, Option, @@ -14,13 +10,16 @@ import { IconOptions, NavigationContext, } from "@features/ui"; -import { useFilters, IssueLevel, IssueStatus } from "@features/issues"; +import { + useFilters, + IssueLevel, + IssueStatus, + IssueFilters, +} from "@features/issues"; import { useProjects } from "@features/projects"; import { breakpoint } from "@styles/theme"; import { useWindowSize } from "react-use"; -import { useRouter } from "next/router"; - const Container = styled.div` display: flex; flex-direction: column; @@ -49,13 +48,30 @@ const RightContainer = styled.div` } `; +const getStatusDefaultValue = (filters: IssueFilters) => { + if (!filters.status) { + return "Status"; + } + if (filters.status === IssueStatus.open) { + return "Unresolved"; + } + return "Resolved"; +}; + +const getLevelDefaultValue = (filters: IssueFilters) => { + if (!filters.level) { + return "Level"; + } + return capitalize(filters.level); +}; + export function Filters() { const { handleFilters, filters } = useFilters(); const { data: projects } = useProjects(); // const router = useRouter(); // const routerQueryProjectName = // (router.query.projectName as string)?.toLowerCase() || undefined; - const [inputValue, setInputValue] = useState(""); + const [inputValue, setInputValue] = useState(filters.project || ""); const projectNames = projects?.map((project) => project.name.toLowerCase()); // const isFirst = useRef(true); const { width } = useWindowSize(); @@ -146,7 +162,7 @@ export function Filters() { Resolved - + - + - - - - ProLog - {title} - - - + + ProLog - {title} + + + - -
- - {title} - {info} - {children} - -
-
- + +
+ + {title} + {info} + {children} + +
+
); } diff --git a/pages/dashboard/issues.tsx b/pages/dashboard/issues.tsx index 0281713..73a91ce 100644 --- a/pages/dashboard/issues.tsx +++ b/pages/dashboard/issues.tsx @@ -1,18 +1,15 @@ import { PageContainer } from "@features/ui"; import { IssueList } from "@features/issues"; import type { NextPage } from "next"; -import { FiltersProvider } from "@features/issues"; const IssuesPage: NextPage = () => { return ( - - - - - + + + ); }; From c7808f3b897c56d2df2638a2269e9bd8834b89cd Mon Sep 17 00:00:00 2001 From: ari7946 Date: Wed, 11 Jan 2023 20:21:20 -0800 Subject: [PATCH 8/8] Refactor use-issues to clean up params, signal, and add relolve issue funtion --- cypress/integration/issue-list.spec.ts | 18 +++--- features/issues/api/use-issues.tsx | 57 ++++++++++++------- .../issues/components/filters/filters.tsx | 8 +-- features/issues/hooks/use-filters.tsx | 9 +-- 4 files changed, 50 insertions(+), 42 deletions(-) diff --git a/cypress/integration/issue-list.spec.ts b/cypress/integration/issue-list.spec.ts index b1b62ba..39a7092 100644 --- a/cypress/integration/issue-list.spec.ts +++ b/cypress/integration/issue-list.spec.ts @@ -132,6 +132,7 @@ describe("Issue List", () => { // type 'back', which is partial for "backend" cy.get("@filter-input").type("back"); + cy.wait(2000); cy.dataCy("filter-by-level").click(); // set level to warning @@ -154,38 +155,35 @@ describe("Issue List", () => { cy.validateIssues(mockIssuesByErrorLevel); }); - it("should update URL with the correct project filters/url parameters", () => { + it.only("should update URL with the correct project filters/url parameters", () => { // Click select component cy.dataCy("filter-by-status").click(); // Select Resolved cy.contains("Resolved").click(); - cy.url().should("include", "/dashboard/issues?page=1&status=resolved"); + cy.url().should("include", "/dashboard/issues?status=resolved"); cy.dataCy("filter-by-level").click(); // Error query param is added to the URL cy.contains("Error").click(); cy.url().should( "include", - "/dashboard/issues?page=1&status=resolved&level=error" + "/dashboard/issues?status=resolved&level=error" ); cy.dataCy("filter-by-status").click(); // Removes status filter cy.contains("--None--").click(); - cy.url().should("include", "/dashboard/issues?page=1&level=error"); + cy.url().should("include", "/dashboard/issues?level=error"); cy.dataCy("filter-by-level").click(); cy.contains("Warning").click(); - cy.url().should("include", "/issues?page=1&level=warning"); + cy.url().should("include", "/issues?level=warning"); cy.dataCy("filter-by-project").within(() => { cy.get("input").type("Back"); }); - cy.url().should( - "include", - "/issues?page=1&level=warning&project=backend" - ); + cy.url().should("include", "/issues?level=warning&project=backend"); - // Adds page 2 too the url + // Adds page 2 to the url cy.get("@next-button").click(); cy.url().should( "include", diff --git a/features/issues/api/use-issues.tsx b/features/issues/api/use-issues.tsx index f007007..c3bf95a 100644 --- a/features/issues/api/use-issues.tsx +++ b/features/issues/api/use-issues.tsx @@ -6,40 +6,57 @@ import type { Issue } from "../types/issue.types"; import { useFilters } from "@features/issues"; import { IssueFilters } from "@features/issues"; -async function getIssues(page: number, filters: IssueFilters) { - const { data } = await axios.get( - `https://prolog-api.profy.dev/issue?page=${page}`, - { params: filters } +export async function getIssues( + page: number, + filters: IssueFilters, + options?: { signal?: AbortSignal } +) { + const { data } = await axios.get>( + "https://prolog-api.profy.dev/issue", + { + params: { page, ...filters }, + signal: options?.signal, + } + ); + return data; +} + +export async function resolveIssue(issueId: string) { + const { data } = await axios.patch( + `https://prolog-api.profy.dev/issue/${issueId}`, + { + status: "resolved", + } ); - console.log("data", data); return data; } -type Filters = { - status: null | "open" | "resolved"; - level: null | "error" | "warning" | "info"; -}; +const QUERY_KEY = "issues"; + +export function getQueryKey(page?: number, filters?: IssueFilters) { + if (page === undefined) { + return [QUERY_KEY]; + } + return [QUERY_KEY, page, filters]; +} export function useIssues(page: number) { const { filters } = useFilters(); - + // console.log('filters', filters); const query = useQuery, Error>( - ["issues", page, filters], - () => getIssues(page, filters), - { - keepPreviousData: true, - staleTime: 60000, - } + getQueryKey(page, filters), + ({ signal }) => getIssues(page, filters, { signal }), + { keepPreviousData: true } ); + // Prefetch the next page! const queryClient = useQueryClient(); useEffect(() => { if (query.data?.meta.hasNextPage) { - queryClient.prefetchQuery(["projects", page + 1, filters], () => - getIssues(page + 1, filters) + queryClient.prefetchQuery(getQueryKey(page + 1, filters), ({ signal }) => + getIssues(page + 1, filters, { signal }) ); } - }, [query.data, page, queryClient, filters]); - + }, [query.data, page, filters, queryClient]); return query; } diff --git a/features/issues/components/filters/filters.tsx b/features/issues/components/filters/filters.tsx index f99ac6f..44cd35b 100644 --- a/features/issues/components/filters/filters.tsx +++ b/features/issues/components/filters/filters.tsx @@ -103,10 +103,10 @@ export function Filters() { handleFilters({ status: status as IssueStatus }); }; - const handleProjectName = useCallback( - (projectName) => handleFilters({ project: projectName?.toLowerCase() }), - [handleFilters] - ); + // const handleProjectName = useCallback( + // (projectName) => handleFilters({ project: projectName?.toLowerCase() }), + // [handleFilters] + // ); return ( diff --git a/features/issues/hooks/use-filters.tsx b/features/issues/hooks/use-filters.tsx index 782b34f..2b6c5be 100644 --- a/features/issues/hooks/use-filters.tsx +++ b/features/issues/hooks/use-filters.tsx @@ -1,25 +1,18 @@ -// import { useContext } from "react"; -// import { FiltersContext } from "../context/filters-context"; - -// export const useFilters = () => useContext(FiltersContext); - import { useRouter } from "next/router"; import { IssueFilters } from "../types/issue.types"; export const useFilters = () => { const router = useRouter(); - // Derives filter values from the URL const filters = { status: router.query.status, level: router.query.level, project: router.query.project, } as IssueFilters; - // Updates URL with router.push const handleFilters = (newFilters: IssueFilters) => { const query = { ...router.query, ...newFilters }; - router.replace({ query }); + router.push({ query }); }; return { filters, handleFilters };