Removed loadable + refactoring folders + search cleanup and hook extractions

Author: chicio

__tests__/call-to-action-external-with-tracking.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen, fireEvent } from "@testing-library/react";
 import { trackWith } from "../src/logic/tracking";
 import { BlogThemePage } from "../src/components/design-system/templates/blog-theme-page";
-import { CallToActionExternalWithTracking } from "../src/components/call-to-action-external-with-tracking";
+import { CallToActionExternalWithTracking } from "../src/components/tracking/call-to-action-external-with-tracking";
 
 jest.mock("../src/logic/tracking", () => ({
   ...jest.requireActual("../src/logic/tracking"),

__tests__/call-to-action-internal-with-tracking.test.tsx

@@ -1,5 +1,5 @@
 import { fireEvent, render, screen } from "@testing-library/react";
-import { CallToActionInternalWithTracking } from "../src/components/call-to-action-internal-with-tracking";
+import { CallToActionInternalWithTracking } from "../src/components/tracking/call-to-action-internal-with-tracking";
 import { trackWith } from "../src/logic/tracking";
 import { BlogThemePage } from "../src/components/design-system/templates/blog-theme-page";
 

__tests__/menu-item-with-tracking.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { trackWith } from "../src/logic/tracking";
 import { BlogThemePage } from "../src/components/design-system/templates/blog-theme-page";
-import { MenuItemWithTracking } from "../src/components/menu-item-with-tracking";
+import { MenuItemWithTracking } from "../src/components/tracking/menu-item-with-tracking";
 
 jest.mock("../src/logic/tracking", () => ({
   ...jest.requireActual("../src/logic/tracking"),

__tests__/standard-external-link-with-tracking.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { trackWith } from "../src/logic/tracking";
 import { BlogThemePage } from "../src/components/design-system/templates/blog-theme-page";
-import { StandardExternalLinkWithTracking } from "../src/components/standard-external-link-with-tracking";
+import { StandardExternalLinkWithTracking } from "../src/components/tracking/standard-external-link-with-tracking";
 
 jest.mock("../src/logic/tracking", () => ({
   ...jest.requireActual("../src/logic/tracking"),

__tests__/standard-internal-link-with-tracking.test.tsx

@@ -1,7 +1,7 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import { trackWith } from "../src/logic/tracking";
 import { BlogThemePage } from "../src/components/design-system/templates/blog-theme-page";
-import { StandardInternalLinkWithTracking } from "../src/components/standard-internal-link-with-tracking";
+import { StandardInternalLinkWithTracking } from "../src/components/tracking/standard-internal-link-with-tracking";
 
 jest.mock("../src/logic/tracking", () => ({
   ...jest.requireActual("../src/logic/tracking"),

src/components/bottom-art.tsx

@@ -0,0 +1,40 @@
+import { useEffect, useState } from "react";
+import { SearchResult } from "../../../lunr";
+
+const hasMinimumCharsToSearch = (query: string): boolean => query.length >= 3;
+
+const isASearchInProgressUsing = (
+  query: string,
+  hits: SearchResult[],
+): boolean =>
+  query !== null &&
+  query !== undefined &&
+  hasMinimumCharsToSearch(query) &&
+  hits.length > 0;
+
+export const useSearch = (startSearch: boolean) => {
+  const [query, setQuery] = useState("");
+  const [hits, setHits] = useState<SearchResult[]>([]);
+
+  useEffect(() => {
+    if (startSearch) {
+      const { index, store } = window.__LUNR__.en;
+      const enhancedQuery = query
+        .split(" ")
+        .map((term) => `${term}*`)
+        .join(" ");
+      const searchResults = index.search(enhancedQuery);
+      const hits = searchResults.map(({ ref }) => store[ref]);
+      if (isASearchInProgressUsing(query, hits)) {
+        setHits(hits);
+      } else {
+        setHits([]);
+      }
+    }
+  }, [query]);
+
+  return {
+    hits,
+    setQuery,
+  };
+};

src/components/bottom-index.tsx

@@ -1,7 +1,7 @@
 import styled from "styled-components";
 import { FC } from "react";
 import { tracking } from "../../../logic/tracking";
-import { CallToActionInternalWithTracking } from "../../call-to-action-internal-with-tracking";
+import { CallToActionInternalWithTracking } from "../../tracking/call-to-action-internal-with-tracking";
 
 const CenterHorizontallyContainer = styled.div`
   display: flex;

src/components/design-system/hooks/use-search.ts

@@ -10,7 +10,7 @@ import styled from "styled-components";
 import { ContainerFluid } from "../atoms/container-fluid";
 import { GatsbyImage } from "gatsby-plugin-image";
 import { Paragraph } from "../atoms/paragraph";
-import { StandardExternalLinkWithTracking } from "../../standard-external-link-with-tracking";
+import { StandardExternalLinkWithTracking } from "../../tracking/standard-external-link-with-tracking";
 import { mediaQuery } from "../utils-css/media-query";
 import { gatsbyImagePlaceholderSelector } from "../utils-css/gatsby-image-selector";