aboutsummaryrefslogtreecommitdiffstats
path: root/src/utils
Commit message (Collapse)AuthorAgeFilesLines
* refactor(pages): merge Github/Gitlab overview on project pagesArmand Philippot2023-12-181-12/+20
| | | | | | By using conditional fetchning we can avoid to duplicate the ProjectOverview component and be more accurate about what data is loading.
* fix(pages): do not show spinner when data are availableArmand Philippot2023-12-187-7/+7
| | | | | | | | The `useSWR` hook set `isLoading` to `true` on first fetch even if the fallback data is provided. It affects how pages are generated on build: the loading page is showing instead of the actual page. So we need to return a custom `isLoading` variable that checks if there is no data.
* refactor(pages): rewrite helpers to output schema in json-ld formatArmand Philippot2023-12-147-178/+934
| | | | | | | | | | | | | * make sure url are absolutes * nest breadcrumb schema in webpage schema * trim HTML tags from content/description * use a regular script instead of next/script (with the latter the schema is not updated on route change) * place the script in document head * add keywords, wordCount and readingTime keys in BlogPosting schema * fix breadcrumbs in search page (without query) * add tests (a `MatchInlineSnapshot` will be better but Prettier 3 is not supported yet)
* refactor(hooks): rewrite useBreadcrumbs hookArmand Philippot2023-12-126-125/+380
| | | | | | | * use next/router to get the slug instead of using props * handle cases where the current page title is not provided * update JSON-LD schema to match the example in documentation * add tests
* test(hooks): fix not wrapped in act error in Jest testArmand Philippot2023-12-111-5/+5
|
* refactor(pages): refine Project pagesArmand Philippot2023-12-088-39/+152
| | | | | | | | | | | * refactor ProjectOverview component to let consumers handle the value * extract project overview depending on Github to avoid fetching Github API if the project is not on Github * wrap dynamic import in a useMemo hook to avoid infinite rerender * fix table of contents by adding a useMutationObserver hook to refresh headings tree (without it useHeadingsTree is not retriggered once the dynamic import is done) * add Cypress tests
* refactor(hooks): replace useGithubApi with useGithubRepoMetaArmand Philippot2023-12-077-29/+105
| | | | | | | | * use GraphQL API instead of REST (the inconvenient however is that we now need an authorization token...) * move fetcher in services * add tests * mock response using MSW
* refactor(pages): refine Projects pageArmand Philippot2023-12-071-33/+22
| | | | | | | * add a `contexts` meta key to projects * replace `technologies` with `contexts` key in projects list * make getProjectsFilenames async * add Cypress tests
* refactor(pages): refine Search pageArmand Philippot2023-12-072-22/+0
| | | | | | | * extract NoResults component to improve readability * provide a different message when the url does not contain a query * use hooks to refresh Thematics and Topics lists * remove useDataFromApi hook
* refactor(pages): refine Blog pagesArmand Philippot2023-12-0411-72/+183
| | | | | | | | | | * replace usePostsList with useArticlesList to keep names coherent * remove useIsMounted hook * rewrite useRedirection hook * add redirect in getStaticProps to avoid unecessary fetching * move Pagination component in a noscript tag * use hooks to refresh thematics and topics lists * complete Cypress tests
* refactor(pages): refine Topic pagesArmand Philippot2023-12-017-0/+180
| | | | | | * add useTopic and useTopicsList hooks to refresh data * add a table of contents * add Cypress tests
* refactor(pages): refine Thematic pagesArmand Philippot2023-12-017-0/+189
| | | | | | | | | | | * add a table of contents (however posts heading are not included) * rename posts list section title * add a useThematic hook to refresh thematic contents * add a useThematicLists hook to refresh thematics list * add a `notIn` filter in thematics list fetcher to directly remove unwanted thematics * add Cypress tests
* refactor(pages): refine Article pagesArmand Philippot2023-12-0110-81/+299
| | | | | | | | | | | * use rehype to update code blocks class names * fix widget heading level (after a level 1 it should always be a level 2 and not 3) * replace Spinner with LoadingPage and LoadingPageComments components to keep layout coherent * refactor useArticle and useComments hooks * fix URLs in JSON LD schema * add Cypress tests
* refactor(pages): refine RSS feedArmand Philippot2023-11-302-7/+59
| | | | | | | | | | | * add favicon * add item categories * add item image * add item author * add item update date (it seems `date` is used as update date by Feed) * change copyright format * fix ESlint errors * fix atom and json links
* refactor(pages): improve HomepageArmand Philippot2023-11-294-29/+36
| | | | | | | | | * move custom homepage components that does not require props to the MDX file (links should not need to be translated here but where they are defined) * move SEO title and meta desc to MDX file * make Page component the wrapper instead of using a React fragment * fix MDX module types
* fix(pages,services): make thematics & topics pages usable againArmand Philippot2023-11-291-0/+8
| | | | | | | | | | When I refactored the fetchers and convertors in #f111685 I forgot to convert WPThematicPreview and WPTopicPreview so the thematics and topics pages was broken. I also: * removed the ToC added by error in #70b4f63 * fix heading styles * fix website url in topics pages
* test(services): add tests for posts fetchersArmand Philippot2023-11-282-24/+74
|
* refactor(services, types): reorganize GraphQL fetchers and data typesArmand Philippot2023-11-2713-221/+169
| | | | | | | | | | | | The Typescript mapped types was useful for autocompletion in fetchers but their are harder to maintain. I think it's better to keep each query close to its fetcher to have a better understanding of the fetched data. So I: * colocate queries with their own fetcher * colocate mutations with their own mutator * remove Typescript mapped types for queries and mutations * move data convertors inside graphql services * rename most of data types and fetchers
* refactor(components): split Layout component in smaller componentsArmand Philippot2023-11-221-0/+1
| | | | | The previous component was too long and hardly readable. So I splitted it in different part and added tests.
* refactor(components): replace items prop in Navbar componentArmand Philippot2023-11-214-121/+0
| | | | | | | | | | | | | | * replace `items` prop with `children` prop: it is more readable this way, * handle navbar item state inside NavbarItem component: it avoid using three differents states and their methods to do exactly the same thing * remove useAutofocus hook since we can't use it anymore * add `onActivation` and `activationHandlerDelay` prop to NavbarItem component to be able to focus the search input only when the item is activated (it replicates the functioning of useAutofocus hook) * replace `ref` type in SearchForm component: it does not make sense to use an input ref for a form. Instead I use useImperativeHandle to provide different a focus method to the given ref.
* refactor(components): replace PageLayout template with PageArmand Philippot2023-11-202-57/+0
| | | | | | | | | * split pages in smaller components (it is both easier to maintain and more readable, we avoid the use of fragments in pages directory) * extract breadcrumbs from article tag (the navigation is not related to the page contents) * remove useReadingTime hook * remove layout options except `isHome`
* fix: remove rehype-sanitize to avoid broken layoutsArmand Philippot2023-11-201-2/+0
| | | | | | | The `rehype-sanitize` plugin was removing some tags inside the post contents coming from WordPress so the layout was broken. This plugin is useful to avoid DOM clobbering but I trust rehype-slug and myself so it is safe to remove it.
* fix: generate an id for each headings in the page main contentsArmand Philippot2023-11-188-49/+99
| | | | | | | | | | | | | | | | | | | | Since #be4d907 the ids was no longer addded to headings in useHeadingsTree hook. It was a bad practice to manipulate the DOM that way. However, I did not move the implementation elsewhere... To fix this, I now use rehype-slug on both markdown contents and html string coming from WordPress. I'm not sure the dynamic imports are really useful here since the table of contents is on almost all pages but Jest was failing with regular import because of ESM. It is the only thing that makes the tests functional again so... However if we want to test the `updateContentTree` function, Jest fails for the same reason. So I decided to not test this function. I've already spend too much time on this issue. Another problem: the ToC on projects page. Currently we use the ref on the body but the page contents are imported dynamically so the hook is executed before the contents are loaded. It makes the ToC empty... We should refactor the pages so we can use the ref directly on the imported contents.
* build(components, hooks): fix type errors introduced by deps upgradeArmand Philippot2023-11-162-4/+5
| | | | Since #7e37f2b Typescript was complaining about some types.
* refactor(hooks): remove unused hooksArmand Philippot2023-11-153-47/+0
| | | | | * useMutationObserver removed * useStateChange removed
* refactor(hooks): replace useRouteChange with useOnRouteChange hookArmand Philippot2023-11-155-11/+106
| | | | | | * handle both event start and event complete * clean the effect * add tests
* refactor(hooks): rewrite useScrollPosition hookArmand Philippot2023-11-154-13/+57
| | | | | | * return the scroll position (both X and Y) * no longer accepts arguments * add tests
* refactor(hooks): remove useSettings hookArmand Philippot2023-11-157-145/+47
| | | | | | | It does not make sense to re-export an existing object through a hook. On some pages both the hook and the object was imported... It is better to use the CONFIG (previously settings) object directly and by doing it we avoid potential errors because of conditional hooks.
* refactor(components, hooks): rewrite ToC and useHeadingsTreeArmand Philippot2023-11-144-162/+228
| | | | | | | | | | | | * replace TableOfContents component with TocWidget to keep the name of widget components coherent * replace `wrapper` prop with `tree` prop (the component no longer uses the hook, it is up to the consumer to provide the headings tree) * let consumer handle the widget title * add options to useHeadingsTree hook to retrieve only the wanted headings (and do not assume that h1 is unwanted) * expect an ref object instead of an element in useHeadingsTree hook * rename most of the types involved
* refactor(components): replace LinksListWidget with LinksWidgetArmand Philippot2023-11-141-3/+4
| | | | | | | * avoid List component repeat * rewrite tests and CSS * add an id to LinksWidgetItemData (previously LinksListItems) type because the label could be duplicated
* refactor(components): rewrite PostsList componentArmand Philippot2023-11-137-0/+137
| | | | | | | | | | | | | | | * remove NoResults component and move logic to Search page * add a usePostsList hook * remove Pagination from PostsList (it is only used if javascript is disabled and not on every posts list) * replace `byYear` prop with `sortByYear` * replace `loadMore` prop with `onLoadMore` * remove `showLoadMoreBtn` (we can use `loadMore` prop instead to determine if we need to display the button) * replace `titleLevel` prop with `headingLvl` * add `firstNewResult` prop to handle focus on the new results when loading more article (we should not focus a useless span but the item directly)
* refactor(hooks): rewrite usePagination hookArmand Philippot2023-11-134-119/+233
| | | | | | | * replace `isLoadingInitialData` with `isLoading` & `isRefreshing` * rename `fallbackData` prop to `fallback` * replace `setSize` return with a `loadMore` callback * add tests
* refactor(components): replace Summary component with PostPreviewArmand Philippot2023-11-114-7/+107
| | | | | | | | | | | * rename component to PostPreview because Summary is an HTML element and it could lead to confusion * replace `title` and `titleLevel` with `heading` and `headingLvl` because `title` is a native attribute * rename `intro` prop to `excerpt` * extract `cover` from `meta` prop * rewrite meta type * extract meta logic into a new component
* feat(hooks): add an useForm hookArmand Philippot2023-11-1110-0/+788
| | | | | | | | | * add two "sub"-hooks: useFormValues and useFormSubmit (that can be used independently) * handle initial data * handle custom submit callback * handle data validation * handle submit status
* refactor(hooks): replace useInputAutofocus with useAutofocus hookArmand Philippot2023-11-115-38/+121
| | | | | | * extract setTimeout logic using useTimeout * change condition to be a function * return a ref
* feat(hooks): add an useTimeout hookArmand Philippot2023-11-114-0/+81
|
* refactor(hooks): rewrite useOnClickOutside hookArmand Philippot2023-11-114-50/+81
| | | | | | | * remove `useCapture` parameter (it does not make sense to use bubbling here) * return a MutableRefObject instead of a RefObject to be able to test the hook
* feat(components): add an Overlay componentArmand Philippot2023-11-117-0/+141
| | | | | | | | * add useScrollbarWidth hook * add useScrollLock hook * add a new component to lock scroll with an overlay (it can be useful especially on small screens to prevent background contents to be scrolled)
* feat(hooks): add useBoolean and useToggle hooksArmand Philippot2023-11-117-0/+132
|
* refactor(providers,hooks): rewrite PrismThemeProvider & usePrismThemeArmand Philippot2023-11-1115-276/+347
| | | | | | * reuse Theme provider logic * move DOM mutation from provider to hook * add a script to init theme before page load
* feat: replace next-themes with a custom ThemeProviderArmand Philippot2023-11-1115-0/+332
| | | | | | | To be honest, next-themes was working fine. However since I use a theme provider for Prism code blocks, some code is duplicated between this app and the library. So I prefer to use a custom Provider without the options I don't need.
* refactor(hooks,provider): move reduce motion setterArmand Philippot2023-11-1110-12/+233
| | | | | | | | | | Since the local storage key is not meant to change between the components, it should be set directly inside the app file. So both the local storage and the data attribute should be handle in a provider. I also added a custom document because we need a script to retrieve the stored value in local storage earlier to avoid flashing on hydration.
* refactor(hooks,providers): rewrite useAckee hook and AckeeProviderArmand Philippot2023-11-1111-77/+208
|
* refactor(hooks): rewrite useLocalStorage hookArmand Philippot2023-11-115-59/+133
| | | | | | | * return a tuple instead of an object * add a validator function as parameter (if the stored value is manually changed, it is not safe to cast its type) * add tests
* refactor(components): rewrite Breadcrumbs componentArmand Philippot2023-11-111-34/+53
|
* refactor(components): rewrite Code component and usePrism hookArmand Philippot2023-11-115-183/+309
| | | | | | | | | | | | * move Prism styles to Sass placeholders to avoid repeats * let usePrism consumer define its plugins (remove default ones) * remove `plugins` prop from Code component * add new props to Code component to let consumer configure plugins (and handle plugin list from the given options) However there are some problems with Prism plugins: line-highlight and treeview does not seems to be loaded. I don't want to use Babel instead of SWC so I have no solution for now.
* feat(components): add a Time componentArmand Philippot2023-11-112-41/+0
| | | | | | Instead of using helpers functions to format the date each time we need to use a time element, it makes more sense to create a new component dedicated to this task.
* refactor(components): rewrite Branding componentArmand Philippot2023-11-112-28/+0
| | | | | | The component should only be responsible of the layout for the logo, the name and the optional baseline. Also, the homepage url could be different from `/` so the consumer should give the right url.
* refactor(routes): replace hardcoded routes with constantsArmand Philippot2023-10-245-45/+82
| | | | | | | | It makes it easier to change a route if needed and it avoid typo mistakes. I also refactored a bit the concerned files to be complient with the new ESlint config. However, I should rewrite the pages to reduce the number of statements.
* refactor: use named export for everything except pagesArmand Philippot2023-09-2035-132/+114
| | | | | | Next expect a default export for pages so only those components should use default exports. Everything else should use named exports to reduce the number of import statements.