From 2eb881ca2e04c24d0cc7c107b0c34fcf0e73554a Mon Sep 17 00:00:00 2001 From: Ala Eddine Menai Date: Sun, 9 Jun 2024 20:12:58 +0100 Subject: [PATCH] refactor: change configuration file (#51) --- .github/workflows/lint-and-test.yml | 38 ++++++++++++++-------------- README.md | 39 ++++++++++------------------- package.json | 2 +- rehook.config.ts | 13 ++++++++++ src/App.tsx | 21 ++++++++-------- src/actions/env.ts | 7 +++--- src/hooks/use-env.ts | 3 +-- 7 files changed, 60 insertions(+), 63 deletions(-) create mode 100644 rehook.config.ts diff --git a/.github/workflows/lint-and-test.yml b/.github/workflows/lint-and-test.yml index 9b14eac..7e884ee 100644 --- a/.github/workflows/lint-and-test.yml +++ b/.github/workflows/lint-and-test.yml @@ -1,26 +1,26 @@ name: Lint and Test on: - pull_request: - branches: [dev] + pull_request: + branches: [dev] jobs: - lint-and-test: - runs-on: ubuntu-latest + lint-and-test: + runs-on: ubuntu-latest - strategy: - matrix: - node-version: [14.x, 16.x,22.x] + strategy: + matrix: + node-version: [14.x, 16.x, 22.x] - steps: - - uses: actions/checkout@v3 - - name: Use Node.js ${{ matrix.node-version }} - uses: actions/setup-node@v3 - with: - node-version: ${{ matrix.node-version }} - - name: Install dependencies - run: npm install - - name: Run ESLint - run: npm run lint - - name: Run Tests - run: npm test \ No newline at end of file + steps: + - uses: actions/checkout@v3 + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v3 + with: + node-version: ${{ matrix.node-version }} + - name: Install dependencies + run: npm install + - name: Run ESLint + run: npm run lint + - name: Run Tests + run: npm test diff --git a/README.md b/README.md index 9cc65f2..1067ffb 100644 --- a/README.md +++ b/README.md @@ -12,31 +12,18 @@ - ## Hooks -| Hook Name | Description | -|---------------------|-----------------------------------------------------------| -| [`useAbortController`](https://www.rehook.dev/hooks/use-abort-controller) | A custom hook for managing operations with an AbortController instance. This hook provides functionalities for aborting operations, checking if aborted, and managing abort conditions.| -| [`useBattery`](https://www.rehook.dev/hooks/use-battery) | A custom hook for fetching battery status information.| -| [`useFetch`](https://www.rehook.dev/hooks/use-fetch) | A custom hook for fetching data from an API.| -| [`useHistory`](https://www.rehook.dev/hooks/use-history) | A custom hook for managing browser history navigation.| -| [`useLoading`](https://www.rehook.dev/hooks/use-loading) | A custom hook that provides functionalities for managing loading state.| -| [`useLoading`](https://www.rehook.dev/hooks/use-loading) | A custom hook that provides functionalities for managing loading state.| -| [`useLocalStorage`](https://www.rehook.dev/hooks/use-local-storage) | A custom hook that provides functionalities for managing data in the browser's local storage.| -| [`usePersistentState`](https://www.rehook.dev/hooks/use-persistent-state) | A custom hook that provides persistent state management by storing state values in the browser's local storage.| -| [`useQueryParams`](https://www.rehook.dev/hooks/use-query-params) | A custom hook that provides functionalities for managing query parameters in the URL.| -| [`useTimeout`](https://www.rehook.dev/hooks/use-timeout) | A custom hook for managing timeouts.| -| [`useUrl`](https://www.rehook.dev/hooks/use-url) | A custom hook for accessing URL information.| - - - - - - - - - - - - +| Hook Name | Description | +| ------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| [`useAbortController`](https://www.rehook.dev/hooks/use-abort-controller) | A custom hook for managing operations with an AbortController instance. This hook provides functionalities for aborting operations, checking if aborted, and managing abort conditions. | +| [`useBattery`](https://www.rehook.dev/hooks/use-battery) | A custom hook for fetching battery status information. | +| [`useFetch`](https://www.rehook.dev/hooks/use-fetch) | A custom hook for fetching data from an API. | +| [`useHistory`](https://www.rehook.dev/hooks/use-history) | A custom hook for managing browser history navigation. | +| [`useLoading`](https://www.rehook.dev/hooks/use-loading) | A custom hook that provides functionalities for managing loading state. | +| [`useLoading`](https://www.rehook.dev/hooks/use-loading) | A custom hook that provides functionalities for managing loading state. | +| [`useLocalStorage`](https://www.rehook.dev/hooks/use-local-storage) | A custom hook that provides functionalities for managing data in the browser's local storage. | +| [`usePersistentState`](https://www.rehook.dev/hooks/use-persistent-state) | A custom hook that provides persistent state management by storing state values in the browser's local storage. | +| [`useQueryParams`](https://www.rehook.dev/hooks/use-query-params) | A custom hook that provides functionalities for managing query parameters in the URL. | +| [`useTimeout`](https://www.rehook.dev/hooks/use-timeout) | A custom hook for managing timeouts. | +| [`useUrl`](https://www.rehook.dev/hooks/use-url) | A custom hook for accessing URL information. | diff --git a/package.json b/package.json index 2aa502f..cf64437 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "lint-staged": "^15.2.0", "prettier": "3.0.3", "typescript": "^5.3.3", - "vite": "^4.5.3" + "vite": "^4.5.3", "vitest": "^1.6.0" } } diff --git a/rehook.config.ts b/rehook.config.ts new file mode 100644 index 0000000..90d02af --- /dev/null +++ b/rehook.config.ts @@ -0,0 +1,13 @@ +export const VITE_DEFAULT_ENV_VARS = ['BASE_URL', 'NODE', 'MODE', 'DEV', 'PROD', 'SSR'] + +export const NEXT_DEFAULT_ENV_VARS = ['NODE_ENV', 'TZ'] + +type RehookConfig = { + framework: 'VITE' | 'NEXT' + ignoreDefaultEnv: boolean +} + +export const rehookConfig: RehookConfig = { + framework: 'VITE', + ignoreDefaultEnv: true, +} diff --git a/src/App.tsx b/src/App.tsx index 2316a8c..817fb90 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,22 +1,21 @@ -import './App.css'; -import { useQueryParams } from './hooks/useQueryParams'; +import './App.css' +import { useQueryParams } from './hooks/useQueryParams' // import reactLogo from './assets/react.svg'; -import viteLogo from '/vite.svg'; -import { useState } from 'react'; +import { useState } from 'react' function App() { - const [count, setCount] = useState(0); - const { get, set } = useQueryParams(); + const [count, setCount] = useState(0) + const { get, set } = useQueryParams() const handleClick = () => { - set('page', '2'); - }; + set('page', '2') + } return ( <>

Current page: {get('page') || 'N/A'}

-
+
{/* Vite logo */} @@ -34,7 +33,7 @@ function App() {

Click on the Vite and React logos to learn more

- ); + ) } -export default App; +export default App diff --git a/src/actions/env.ts b/src/actions/env.ts index 90af70d..d3e0243 100644 --- a/src/actions/env.ts +++ b/src/actions/env.ts @@ -1,17 +1,16 @@ 'use server' -import { NEXT_DEFAULT_ENV_VARS, VITE_DEFAULT_ENV_VARS } from '../constants/env' -import { rehookConfig } from '../rehook.config' +import { NEXT_DEFAULT_ENV_VARS, VITE_DEFAULT_ENV_VARS, rehookConfig } from '../../rehook.config' const { ignoreDefaultEnv, framework } = rehookConfig const isFrameworkVite = framework === 'VITE' // Otherwise it is NEXTJS export const getEnv = async () => { - const variables = Object.keys(isFrameworkVite ? import.meta.env : process.env) + const variables = isFrameworkVite ? import.meta.env : process.env if (ignoreDefaultEnv) { - const filteredVariables = variables.filter(variable => + const filteredVariables = variables.filter((variable: string) => isFrameworkVite ? !VITE_DEFAULT_ENV_VARS.includes(variable) : !NEXT_DEFAULT_ENV_VARS.includes(variable), ) return filteredVariables diff --git a/src/hooks/use-env.ts b/src/hooks/use-env.ts index 45ba2f9..45e3146 100644 --- a/src/hooks/use-env.ts +++ b/src/hooks/use-env.ts @@ -1,5 +1,4 @@ -import { NEXT_DEFAULT_ENV_VARS, VITE_DEFAULT_ENV_VARS } from '../constants/env' -import { rehookConfig } from '../rehook.config' +import { NEXT_DEFAULT_ENV_VARS, VITE_DEFAULT_ENV_VARS, rehookConfig } from '../../rehook.config' import { useEffect, useState } from 'react' const { ignoreDefaultEnv, framework } = rehookConfig