Fix AppProvider import

apps/leafcutter/app/(main)/setup/_components/Setup.tsx

@@ -5,7 +5,7 @@ import { useLayoutEffect } from "react";
 import { useRouter } from "next/navigation";
 import { Grid, CircularProgress } from "@mui/material";
 import Iframe from "react-iframe";
-import { useAppContext } from "../../../_components/AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 
 export const Setup: FC = () => {
   const {

apps/leafcutter/app/_components/AccountButton.tsx

@@ -11,7 +11,7 @@ import {
   bindTrigger,
   bindMenu,
 } from "material-ui-popup-state/hooks";
-import { useAppContext } from "./AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 
 export const AccountButton: FC = () => {
   const t = useTranslate();

apps/leafcutter/app/_components/HelpButton.tsx

@@ -4,7 +4,7 @@ import { FC, useState } from "react";
 import { useRouter, usePathname } from "next/navigation";
 import { Button } from "@mui/material";
 import { QuestionMark as QuestionMarkIcon } from "@mui/icons-material";
-import { useAppContext } from "./AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 
 export const HelpButton: FC = () => {
   const router = useRouter();

apps/leafcutter/app/_components/InternalLayout.tsx

@@ -8,7 +8,7 @@ import { useCookies } from "react-cookie";
 import { TopNav } from "./TopNav";
 import { Sidebar } from "./Sidebar";
 import { GettingStartedDialog } from "leafcutter-common";
-import { useAppContext } from "./AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 // import { Footer } from "./Footer";
 
 type LayoutProps = PropsWithChildren<{

apps/leafcutter/app/_components/LanguageSelect.tsx

@@ -8,7 +8,7 @@ import {
   bindTrigger,
   bindMenu,
 } from "material-ui-popup-state/hooks";
-import { useAppContext } from "./AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 // import { Tooltip } from "./Tooltip";
 
 export const LanguageSelect = () => {

apps/leafcutter/app/_components/MultiProvider.tsx

@@ -8,7 +8,7 @@ import { CookiesProvider } from "react-cookie";
 import { I18n } from "react-polyglot";
 import { AdapterDateFns } from "@mui/x-date-pickers-pro/AdapterDateFns";
 import { LocalizationProvider } from "@mui/x-date-pickers-pro";
-import { AppProvider } from "./AppProvider";
+import { AppProvider } from "leafcutter-common/components/AppProvider";
 import { NextAppDirEmotionCacheProvider } from "tss-react/next/appDir";
 import en from "leafcutter-common/locales/en.json";
 import fr from "leafcutter-common/locales/fr.json";

apps/leafcutter/app/_components/Sidebar.tsx

@@ -20,7 +20,7 @@ import {
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { useTranslate } from "react-polyglot";
-import { useAppContext } from "./AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 import { Tooltip } from "leafcutter-common";
 // import { ArrowCircleRight as ArrowCircleRightIcon } from "@mui/icons-material";
 

apps/leafcutter/app/_components/TopNav.tsx

@@ -9,7 +9,7 @@ import LeafcutterLogo from "images/leafcutter-logo.png";
 import { AccountButton } from "./AccountButton";
 import { HelpButton } from "./HelpButton";
 import { Tooltip } from "leafcutter-common";
-import { useAppContext } from "./AppProvider";
+import { useAppContext } from "leafcutter-common/components/AppProvider";
 // import { LanguageSelect } from "./LanguageSelect";
 
 export const TopNav: FC = () => {

packages/leafcutter-common/components/About.tsx

@@ -5,7 +5,7 @@ import { useTranslate } from "react-polyglot";
 import Image from "next/legacy/image";
 import Link from "next/link";
 import { Grid, Container, Box, Button } from "@mui/material";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import { PageHeader } from "./PageHeader";
 import { AboutFeature } from "./AboutFeature";
 import { AboutBox } from "./AboutBox";

packages/leafcutter-common/components/AboutBox.tsx

@@ -2,7 +2,7 @@
 
 import { FC, PropsWithChildren } from "react";
 import { Box } from "@mui/material";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 type AboutBoxProps = PropsWithChildren<{
   backgroundColor: string;

packages/leafcutter-common/components/AboutFeature.tsx

@@ -4,7 +4,7 @@ import { FC } from "react";
 import Image from "next/legacy/image";
 import { Grid, Box, GridSize } from "@mui/material";
 import AboutDots from "../images/about-dots.png";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface AboutFeatureProps {
   title: string;

packages/leafcutter-common/components/AppProvider.tsx

@@ -0,0 +1,161 @@
+"use client";
+
+import {
+  FC,
+  createContext,
+  useContext,
+  useReducer,
+  useState,
+  PropsWithChildren,
+} from "react";
+import { colors, typography } from "leafcutter-common/styles/theme";
+
+const basePath = process.env.GITLAB_CI
+  ? "/link/link-stack/apps/leafcutter"
+  : "";
+const imageURL = (image: any) =>
+  typeof image === "string" ? `${basePath}${image}` : `${basePath}${image.src}`;
+
+const AppContext = createContext({
+  colors,
+  typography,
+  imageURL,
+  query: null as any,
+  updateQuery: null as any,
+  updateQueryType: null as any,
+  replaceQuery: null as any,
+  clearQuery: null as any,
+  foundCount: 0,
+  setFoundCount: null as any,
+});
+
+export const AppProvider: FC<PropsWithChildren> = ({ children }) => {
+  const initialState = {
+    incidentType: {
+      display: "Incident Type",
+      queryType: "include",
+      values: [],
+    },
+    relativeDate: {
+      display: "Relative Date",
+      queryType: null,
+      values: [],
+    },
+    startDate: {
+      display: "Start Date",
+      queryType: null,
+      values: [],
+    },
+    endDate: {
+      display: "End Date",
+      queryType: null,
+      values: [],
+    },
+    targetedGroup: {
+      display: "Targeted Group",
+      queryType: "include",
+      values: [],
+    },
+    platform: {
+      display: "Platform",
+      queryType: "include",
+      values: [],
+    },
+    device: {
+      display: "Device",
+      queryType: "include",
+      values: [],
+    },
+    service: {
+      display: "Service",
+      queryType: "include",
+      values: [],
+    },
+    maker: {
+      display: "Maker",
+      queryType: "include",
+      values: [],
+    },
+    country: {
+      display: "Country",
+      queryType: "include",
+      values: [],
+    },
+    subregion: {
+      display: "Subregion",
+      queryType: "include",
+      values: [],
+    },
+    continent: {
+      display: "Continent",
+      queryType: "include",
+      values: [],
+    },
+  };
+  const reducer = (state: any, action: any) => {
+    const key = action.payload?.[0];
+    if (!key) {
+      throw new Error("Unknown key");
+    }
+    const newState = { ...state };
+    switch (action.type) {
+      case "UPDATE":
+        newState[key].values = action.payload[key].values;
+        return newState;
+      case "UPDATE_TYPE":
+        newState[key].queryType = action.payload[key].queryType;
+        return newState;
+      case "REPLACE":
+        return Object.keys(action.payload).reduce((acc: any, cur: string) => {
+          if (["startDate", "endDate"].includes(cur)) {
+            const rawDate = action.payload[cur].values[0];
+            const date = new Date(rawDate);
+            acc[cur] = {
+              ...action.payload[cur],
+              values: rawDate && date ? [date] : [],
+            };
+          } else {
+            acc[cur] = action.payload[cur];
+          }
+
+          return acc;
+        }, {});
+      case "CLEAR":
+        return initialState;
+      default:
+        throw new Error("Unknown action type");
+    }
+  };
+
+  const [query, dispatch] = useReducer(reducer, initialState);
+  const updateQuery = (payload: any) => dispatch({ type: "UPDATE", payload });
+  const updateQueryType = (payload: any) =>
+    dispatch({ type: "UPDATE_TYPE", payload });
+  const replaceQuery = (payload: any) => dispatch({ type: "REPLACE", payload });
+  const clearQuery = () => dispatch({ type: "CLEAR" });
+  const [foundCount, setFoundCount] = useState(0);
+
+  return (
+    <AppContext.Provider
+      // eslint-disable-next-line react/jsx-no-constructed-context-values
+      value={{
+        colors,
+        typography,
+        imageURL,
+        query,
+        updateQuery,
+        updateQueryType,
+        replaceQuery,
+        clearQuery,
+        foundCount,
+        setFoundCount,
+      }}
+    >
+      {children}
+    </AppContext.Provider>
+  );
+};
+
+export function useAppContext() {
+  return useContext(AppContext);
+}

packages/leafcutter-common/components/Button.tsx

@@ -3,7 +3,7 @@
 import { FC } from "react";
 import Link from "next/link";
 import { Button as MUIButton } from "@mui/material";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface ButtonProps {
   text: string;

packages/leafcutter-common/components/Create.tsx

@@ -5,7 +5,7 @@ import { useTranslate } from "react-polyglot";
 import { useRouter, usePathname } from "next/navigation";
 import { Box, Grid } from "@mui/material";
 import { useCookies } from "react-cookie";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import { PageHeader } from "./PageHeader";
 import { VisualizationBuilder } from "./VisualizationBuilder";
 

packages/leafcutter-common/components/FAQ.tsx

@@ -5,7 +5,7 @@ import { useTranslate } from "react-polyglot";
 import { Box, Grid } from "@mui/material";
 import { PageHeader } from "./PageHeader";
 import { Question } from "./Question";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import FaqHeader from "../images/faq-header.svg";
 
 export const FAQ: FC = () => {

packages/leafcutter-common/components/Footer.tsx

@@ -9,7 +9,7 @@ import leafcutterLogo from "../images/leafcutter-logo.png";
 import footerLogo from "../images/footer-logo.png";
 import twitterLogo from "../images/twitter-logo.png";
 import gitlabLogo from "../images/gitlab-logo.png";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 export const Footer: FC = () => {
   const t = useTranslate();

packages/leafcutter-common/components/GettingStartedDialog.tsx

@@ -5,7 +5,7 @@ import { Dialog, Box, Grid, Checkbox, IconButton } from "@mui/material";
 import { Close as CloseIcon } from "@mui/icons-material";
 import { useRouter, usePathname, useSearchParams } from "next/navigation";
 import { useTranslate } from "react-polyglot";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 type CheckboxItemProps = {
   title: string;

packages/leafcutter-common/components/Home.tsx

@@ -10,7 +10,7 @@ import { useCookies } from "react-cookie";
 import { Welcome } from "./Welcome";
 import { WelcomeDialog } from "./WelcomeDialog";
 import { VisualizationCard } from "./VisualizationCard";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 type HomeProps = {
   visualizations: any;

packages/leafcutter-common/components/LiveDataViewer.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { FC, useEffect, useState } from "react";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import { RawDataViewer } from "./RawDataViewer";
 
 export const LiveDataViewer: FC = () => {

packages/leafcutter-common/components/MetricSelectCard.tsx

@@ -11,7 +11,7 @@ import {
   Public as PublicIcon,
 } from "@mui/icons-material";
 import { VisualizationDetailDialog } from "./VisualizationDetailDialog";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface MetricSelectCardProps {
   visualizationID: string;

packages/leafcutter-common/components/PageHeader.tsx

@@ -3,7 +3,7 @@
 /* eslint-disable react/require-default-props */
 import { FC, PropsWithChildren } from "react";
 import { Box } from "@mui/material";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 type PageHeaderProps = PropsWithChildren<{
   backgroundColor: string;

packages/leafcutter-common/components/QueryBuilder.tsx

@@ -21,7 +21,7 @@ import taxonomy from "../config/taxonomy.json";
 import { QueryBuilderSection } from "./QueryBuilderSection";
 import { QueryListSelector } from "./QueryListSelector";
 import { QueryDateRangeSelector } from "./QueryDateRangeSelector";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import { Tooltip } from "./Tooltip";
 
 interface QueryBuilderProps {}

packages/leafcutter-common/components/QueryBuilderSection.tsx

@@ -17,7 +17,7 @@ import {
   ExpandMore as ExpandMoreIcon,
   Help as HelpIcon,
 } from "@mui/icons-material";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface QueryBuilderSectionProps {
   name: string;

packages/leafcutter-common/components/QueryDateRangeSelector.tsx

@@ -4,7 +4,7 @@ import { FC, useState, useEffect } from "react";
 import { Box, Grid, TextField, Select, MenuItem } from "@mui/material";
 import { DatePicker } from "@mui/x-date-pickers-pro";
 import { useTranslate } from "react-polyglot";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface QueryDateRangeSelectorProps {}
 

packages/leafcutter-common/components/QueryListSelector.tsx

@@ -3,7 +3,7 @@
 import { FC, useState, useEffect } from "react";
 import { Box, Grid, Tooltip } from "@mui/material";
 import { DataGridPro, GridColDef } from "@mui/x-data-grid-pro";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface QueryListSelectorProps {
   title: string;

packages/leafcutter-common/components/QueryText.tsx

@@ -5,7 +5,7 @@ import { Box, Grid } from "@mui/material";
 import { useTranslate } from "react-polyglot";
 import taxonomy from "../config/taxonomy.json";
 import { colors } from "../styles/theme";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 export const QueryText: FC = () => {
   const t = useTranslate();

packages/leafcutter-common/components/Question.tsx

@@ -14,7 +14,7 @@ import {
   ExpandMore as ExpandMoreIcon,
   Circle as CircleIcon,
 } from "@mui/icons-material";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface QuestionProps {
   question: string;

packages/leafcutter-common/components/Tooltip.tsx

@@ -12,7 +12,7 @@ import {
 } from "@mui/material";
 import { Close as CloseIcon } from "@mui/icons-material";
 import { useTranslate } from "react-polyglot";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface TooltipProps {
   title: string;

packages/leafcutter-common/components/Trends.tsx

@@ -5,7 +5,7 @@ import { Grid, Box } from "@mui/material";
 import { useTranslate } from "react-polyglot";
 import { PageHeader } from "./PageHeader";
 import { VisualizationCard } from "./VisualizationCard";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 type TrendsProps = {
   visualizations: any;

packages/leafcutter-common/components/VisualizationBuilder.tsx

@@ -32,7 +32,7 @@ import { Tooltip } from "./Tooltip";
 import visualizationMap from "../config/visualizationMap.json";
 import { VisualizationSelectCard } from "./VisualizationSelectCard";
 import { MetricSelectCard } from "./MetricSelectCard";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface VisualizationBuilderProps {
   templates: any[];

packages/leafcutter-common/components/VisualizationCard.tsx

@@ -3,7 +3,7 @@
 import { FC, useState } from "react";
 import { Grid, Card, Box } from "@mui/material";
 import Iframe from "react-iframe";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import { VisualizationDetailDialog } from "./VisualizationDetailDialog";
 
 interface VisualizationCardProps {

packages/leafcutter-common/components/VisualizationDetail.tsx

@@ -4,7 +4,7 @@ import { FC } from "react";
 // import Link from "next/link";
 import { Box } from "@mui/material";
 import Iframe from "react-iframe";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface VisualizationDetailProps {
   id: string;

packages/leafcutter-common/components/VisualizationDetailDialog.tsx

@@ -11,7 +11,7 @@ import {
   TextField,
 } from "@mui/material";
 import { useTranslate } from "react-polyglot";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 import { VisualizationDetail } from "./VisualizationDetail";
 
 interface VisualizationDetailDialogProps {

packages/leafcutter-common/components/VisualizationSelectCard.tsx

@@ -13,7 +13,7 @@ import lineStacked from "../images/line-stacked.svg";
 import dataTable from "../images/data-table.svg";
 import metric from "../images/metric.svg";
 import tagCloud from "../images/tag-cloud.svg";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 interface VisualizationSelectCardProps {
   visualizationType: string;

packages/leafcutter-common/components/Welcome.tsx

@@ -3,7 +3,7 @@
 import { Box, Grid } from "@mui/material";
 import { useSession } from "next-auth/react";
 import { useTranslate } from "react-polyglot";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 export const Welcome = () => {
   const t = useTranslate();

packages/leafcutter-common/components/WelcomeDialog.tsx

@@ -4,7 +4,7 @@ import { Box, Grid, Dialog, Button } from "@mui/material";
 import { useRouter, useSearchParams } from "next/navigation";
 // import { useSession } from "next-auth/react";
 // import { useTranslate } from "react-polyglot";
-import { useAppContext } from "../../../apps/leafcutter/app/_components/AppProvider";
+import { useAppContext } from "./AppProvider";
 
 export const WelcomeDialog = () => {
   // const t = useTranslate();

packages/leafcutter-common/tsconfig.json

@@ -29,7 +29,7 @@
     "**/*.ts",
     "**/*.tsx",
     "**/*.png, **/*.svg",
-    "../../apps/leafcutter/app/_components/AppProvider.tsx",
+    "components/AppProvider.tsx",
     "../../apps/leafcutter/app/_components/LanguageSelect.tsx",
     "../../apps/leafcutter/app/_components/MultiProvider.tsx",
     "../../apps/leafcutter/app/_components/Sidebar.tsx",