EVG-20048: Introduce check-file plugin (#2109)

.eslintrc.js

@@ -28,7 +28,7 @@ module.exports = {
     "plugin:jsdoc/recommended-typescript-error",
     "plugin:prettier/recommended", // Note: prettier must ALWAYS be the last extension.
   ],
-  plugins: ["@typescript-eslint", "sort-destructure-keys"],
+  plugins: ["@typescript-eslint", "sort-destructure-keys", "check-file"],
   settings: {
     react: {
       version: "detect",
@@ -96,6 +96,30 @@ module.exports = {
     // Rules for prettier.
     "prettier/prettier": errorIfStrict, // Makes Prettier issues warnings rather than errors.
     "sort-destructure-keys/sort-destructure-keys": errorIfStrict,
+    "check-file/filename-naming-convention": [
+      errorIfStrict,
+      {
+        // GraphQL fragments, mutations and queries
+        "src/gql/fragments/**/*.graphql": "CAMEL_CASE",
+        "src/gql/(mutations,queries)/**/*.graphql": "KEBAB_CASE",
+        // Cypress
+        "cypress/integration/**/*.ts": "SNAKE_CASE",
+        // Scripts
+        "scripts/**/*.{js,ts}": "KEBAB_CASE",
+        // JS and TS with exceptions
+        "src/(!test_utils)/**/!(vite-env.d)*.{js,ts}": "CAMEL_CASE",
+        // All tsx with exceptions
+        "src/!(test_utils)/**/!(use|getFormSchema|index|test-utils|schemaFields|getColumnsTemplate|githubPRLinkify|jiraLinkify)*.tsx":
+          "PASCAL_CASE",
+        // Test utils
+        "src/test_utils/**/*": "KEBAB_CASE",
+        // tsx exceptions
+        "src/**/(use|getFormSchema|index)*.tsx": "CAMEL_CASE",
+      },
+      {
+        ignoreMiddleExtensions: true,
+      },
+    ],
   },
   overrides: [
     // For React Typescript files in src.

package.json

@@ -29,7 +29,7 @@
     "prepare": "husky install",
     "prettier": "prettier --write",
     "prod": "env-cmd -e devProduction -r .env-cmdrc.local.json yarn start",
-    "serve": "node scripts/prodServer.js",
+    "serve": "node scripts/prod-server.js",
     "snapshot": "jest storybook.test.ts --watchAll=false",
     "staging": "env-cmd -e devStaging -r .env-cmdrc.local.json yarn start",
     "start": "vite",
@@ -174,6 +174,7 @@
     "eslint": "8.19.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "9.0.0",
+    "eslint-plugin-check-file": "2.6.2",
     "eslint-plugin-cypress": "^2.12.1",
     "eslint-plugin-import": "2.26.0",
     "eslint-plugin-jest": "27.2.1",

src/components/Content/Layout.tsx

@@ -13,7 +13,7 @@ import WelcomeModal from "components/WelcomeModal";
 import { CY_DISABLE_NEW_USER_WELCOME_MODAL } from "constants/cookies";
 import { size } from "constants/tokens";
 import { newSpruceUser } from "constants/welcomeModalProps";
-import { useAuthStateContext } from "context/auth";
+import { useAuthStateContext } from "context/Auth";
 import { UserQuery, UserQueryVariables } from "gql/generated/types";
 import { USER } from "gql/queries";
 import { useUserSettings } from "hooks";

src/components/Content/index.tsx

@@ -5,7 +5,6 @@ import {
   WaterfallCommitsRedirect,
 } from "components/Redirects";
 import { redirectRoutes, routes } from "constants/routes";
-import { PageDoesNotExist } from "pages/404";
 import { CommitQueue } from "pages/CommitQueue";
 import { Commits } from "pages/Commits";
 import { ConfigurePatch } from "pages/ConfigurePatch";
@@ -15,6 +14,7 @@ import { Host } from "pages/Host";
 import { Hosts } from "pages/Hosts";
 import { JobLogs } from "pages/JobLogs";
 import { MyPatches } from "pages/MyPatches";
+import { PageDoesNotExist } from "pages/NotFound";
 import { Preferences } from "pages/Preferences";
 import { ProjectPatches } from "pages/ProjectPatches";
 import { ProjectSettings } from "pages/ProjectSettings";

src/components/Header/Navbar.tsx

@@ -11,7 +11,7 @@ import { CURRENT_PROJECT } from "constants/cookies";
 import { wikiUrl } from "constants/externalResources";
 import { getCommitsRoute, getUserPatchesRoute, routes } from "constants/routes";
 import { size } from "constants/tokens";
-import { useAuthStateContext } from "context/auth";
+import { useAuthStateContext } from "context/Auth";
 import { UserQuery, SpruceConfigQuery } from "gql/generated/types";
 import { USER, SPRUCE_CONFIG } from "gql/queries";
 import { useLegacyUIURL } from "hooks";

src/components/Header/UserDropdown.tsx

@@ -2,7 +2,7 @@ import { useQuery } from "@apollo/client";
 import { useNavbarAnalytics } from "analytics";
 import { adminSettingsURL } from "constants/externalResources";
 import { PreferencesTabRoutes, getPreferencesRoute } from "constants/routes";
-import { useAuthDispatchContext } from "context/auth";
+import { useAuthDispatchContext } from "context/Auth";
 import { UserQuery } from "gql/generated/types";
 import { USER } from "gql/queries";
 import { MenuItemType, NavDropdown } from "./NavDropdown";

src/components/MetadataCard.tsx

@@ -4,7 +4,7 @@ import { Body, BodyProps } from "@leafygreen-ui/typography";
 import { Skeleton } from "antd";
 import { ErrorWrapper } from "components/ErrorWrapper";
 import { SiderCard, wordBreakCss } from "components/styles";
-import { Divider } from "components/styles/Divider";
+import { Divider } from "components/styles/divider";
 
 interface Props {
   error: ApolloError;

src/components/Settings/EventLog/EventDiffTable.tsx

@@ -9,7 +9,7 @@ import {
   V10HeaderRow as HeaderRow,
 } from "@leafygreen-ui/table";
 import { fontFamilies } from "@leafygreen-ui/tokens";
-import { getEventDiffLines } from "./EventLogDiffs";
+import { getEventDiffLines } from "./eventLogDiffs";
 import { Event, EventDiffLine, EventValue } from "./types";
 
 type TableProps = {

src/components/Settings/EventLog/EventLogDiffs.test.ts → src/components/Settings/EventLog/eventLogDiffs.test.ts

@@ -1,6 +1,6 @@
 import { ProjectEventSettings } from "gql/generated/types";
 import { Subset } from "types/utils";
-import { getEventDiffLines } from "./EventLogDiffs";
+import { getEventDiffLines } from "./eventLogDiffs";
 
 const beforeAddition: Subset<ProjectEventSettings> = {
   __typename: "ProjectEventSettings",

src/components/VersionRestartModal/VersionTasks.tsx

@@ -1,4 +1,4 @@
-import { Divider } from "components/styles/Divider";
+import { Divider } from "components/styles/divider";
 import { TaskStatusFilters } from "components/TaskStatusFilters";
 import { BuildVariantsWithChildrenQuery } from "gql/generated/types";
 import { versionSelectedTasks } from "hooks/useVersionTaskStatusSelect";

src/components/styles/index.ts

@@ -1,6 +1,6 @@
-import { Divider } from "./Divider";
+import { Divider } from "./divider";
 import { FiltersWrapper } from "./filters";
-import { inactiveElementStyle } from "./Inactive";
+import { inactiveElementStyle } from "./inactive";
 import {
   ErrorMessage,
   InputLabel,

src/context/auth.test.tsx → src/context/Auth.test.tsx

@@ -4,7 +4,7 @@ import {
   AuthProvider,
   useAuthDispatchContext,
   useAuthStateContext,
-} from "./auth";
+} from "./Auth";
 
 const { cleanup, mockEnv } = mockEnvironmentVariables();
 

src/context/Providers.tsx

@@ -1,5 +1,5 @@
 import LeafyGreenProvider from "@leafygreen-ui/leafygreen-provider";
-import { AuthProvider } from "context/auth";
+import { AuthProvider } from "context/Auth";
 import { ToastProvider } from "context/toast";
 
 export const ContextProviders: React.FC<{ children: React.ReactNode }> = ({

src/gql/GQLWrapper.tsx

@@ -8,7 +8,7 @@ import {
 import { onError } from "@apollo/client/link/error";
 import { RetryLink } from "@apollo/client/link/retry";
 import { routes } from "constants/routes";
-import { useAuthDispatchContext } from "context/auth";
+import { useAuthDispatchContext } from "context/Auth";
 import { environmentVariables } from "utils";
 import {
   leaveBreadcrumb,

src/pages/404/__snapshots__/NotFound.stories.storyshot

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`storybook Storyshots pages/404/NotFound Default 404 1`] = `
+exports[`storybook Storyshots pages/NotFound/NotFound Default 404 1`] = `
 <div>
   <div
     style="height: 100%; width: 100%;"

src/pages/Login.tsx

@@ -2,7 +2,7 @@ import { useState } from "react";
 import { useQuery } from "@apollo/client";
 import styled from "@emotion/styled";
 import { Navigate, useLocation } from "react-router-dom";
-import { useAuthDispatchContext, useAuthStateContext } from "context/auth";
+import { useAuthDispatchContext, useAuthStateContext } from "context/Auth";
 import { UserQuery, UserQueryVariables } from "gql/generated/types";
 import { USER } from "gql/queries";
 

src/pages/Task.tsx

@@ -18,7 +18,7 @@ import { TaskQuery, TaskQueryVariables } from "gql/generated/types";
 import { TASK } from "gql/queries";
 import { usePolling } from "hooks";
 import { useUpdateURLQueryParams } from "hooks/useUpdateURLQueryParams";
-import { PageDoesNotExist } from "pages/404";
+import { PageDoesNotExist } from "pages/NotFound";
 import { RequiredQueryParams, TaskStatus } from "types/task";
 import { queryString } from "utils";
 import { ActionButtons } from "./task/ActionButtons";

src/pages/Version.tsx

@@ -24,7 +24,7 @@ import {
 } from "gql/generated/types";
 import { VERSION, IS_PATCH_CONFIGURED, HAS_VERSION } from "gql/queries";
 import { useSpruceConfig } from "hooks";
-import { PageDoesNotExist } from "pages/404";
+import { PageDoesNotExist } from "pages/NotFound";
 import { isPatchUnconfigured } from "utils/patch";
 import { shortenGithash, githubPRLinkify } from "utils/string";
 import { jiraLinkify } from "utils/string/jiraLinkify";

src/pages/configurePatch/configurePatchCore/ConfigureBuildVariants/BuildVariantCard.tsx

@@ -4,7 +4,7 @@ import Badge, { Variant } from "@leafygreen-ui/badge";
 import { palette } from "@leafygreen-ui/palette";
 import { Body, Description } from "@leafygreen-ui/typography";
 import { SiderCard } from "components/styles";
-import { Divider } from "components/styles/Divider";
+import { Divider } from "components/styles/divider";
 import { size } from "constants/tokens";
 import type { MenuItemProps } from "./types";
 

src/pages/configurePatch/index.tsx

@@ -12,7 +12,7 @@ import {
 } from "gql/generated/types";
 import { PATCH_CONFIGURE } from "gql/queries";
 import { usePageTitle } from "hooks";
-import { PageDoesNotExist } from "pages/404";
+import { PageDoesNotExist } from "pages/NotFound";
 import { validateObjectId } from "utils/validators";
 import ConfigurePatchCore from "./configurePatchCore";
 

src/pages/container/EventsTable/util.tsx → src/pages/container/EventsTable/EventCopy.tsx

@@ -5,9 +5,10 @@ import { PodEvent } from "types/pod";
 import { Unpacked } from "types/utils";
 import { reportError } from "utils/errorReporting";
 
-export const getEventCopy = (
-  event: Unpacked<PodEventsQuery["pod"]["events"]["eventLogEntries"]>
-) => {
+interface EventCopyProps {
+  event: Unpacked<PodEventsQuery["pod"]["events"]["eventLogEntries"]>;
+}
+export const EventCopy: React.FC<EventCopyProps> = ({ event }) => {
   const { data, eventType } = event;
   const taskLink = (
     <ShortenedRouterLink

src/pages/container/EventsTable/index.tsx

@@ -22,7 +22,7 @@ import { PodEventsQuery, PodEventsQueryVariables } from "gql/generated/types";
 import { POD_EVENTS } from "gql/queries";
 import { useDateFormat } from "hooks";
 import { url } from "utils";
-import { getEventCopy } from "./util";
+import { EventCopy } from "./EventCopy";
 
 const { getLimitFromSearch, getPageFromSearch } = url;
 
@@ -85,7 +85,9 @@ const EventsTable: React.FC<{}> = () => {
               <Cell data-cy={`${datum.eventType}-time`}>
                 {getDateCopy(datum.timestamp)}
               </Cell>
-              <Cell>{getEventCopy(datum)}</Cell>
+              <Cell>
+                <EventCopy event={datum} />
+              </Cell>
             </Row>
           )}
         </Table>

src/pages/host/getHostEventString.tsx → src/pages/host/HostEventString.tsx

@@ -40,10 +40,15 @@ const TaskLink: React.FC<TaskLinkProps> = ({ "data-cy": dataCy, taskId }) => (
     {taskId}
   </ShortenedRouterLink>
 );
-export const getHostEventString = (
-  eventType: string,
-  data: HostEventLogData
-) => {
+
+interface HostEventStringProps {
+  eventType: string;
+  data: HostEventLogData;
+}
+export const HostEventString: React.FC<HostEventStringProps> = ({
+  data,
+  eventType,
+}) => {
   const succeededString = "succeeded";
   const failedString = "failed";
 
@@ -281,9 +286,8 @@ export const getHostEventString = (
           )}
         </span>
       );
-
     default:
-      return `${eventType}`;
+      return <span>{eventType}</span>;
   }
 };
 

src/pages/host/HostTable.tsx

@@ -18,8 +18,8 @@ import Pagination from "components/Pagination";
 import { size } from "constants/tokens";
 import { HostEventsQuery } from "gql/generated/types";
 import { useDateFormat } from "hooks";
-import { getHostEventString } from "pages/host/getHostEventString";
 import { HostCard } from "pages/host/HostCard";
+import { HostEventString } from "pages/host/HostEventString";
 
 export const HostTable: React.FC<{
   loading: boolean;
@@ -77,7 +77,12 @@ export const HostTable: React.FC<{
               <Cell data-cy={`${datum.eventType}-time`}>
                 {getDateCopy(datum.timestamp)}
               </Cell>
-              <Cell>{getHostEventString(datum.eventType, datum.data)}</Cell>
+              <Cell>
+                <HostEventString
+                  eventType={datum.eventType}
+                  data={datum.data}
+                />
+              </Cell>
             </Row>
           )}
         </Table>

src/pages/preferences/preferencesTabs/notificationTab/UserSubscriptions.tsx

@@ -37,7 +37,8 @@ import {
 } from "types/subscription";
 import { jiraLinkify } from "utils/string/jiraLinkify";
 import { ClearSubscriptions } from "./ClearSubscriptions";
-import { getResourceRoute, useSubscriptionData } from "./utils";
+import { useSubscriptionData } from "./useSubscriptionData";
+import { getResourceRoute } from "./utils";
 
 const { gray } = palette;
 

src/pages/preferences/preferencesTabs/notificationTab/utils.tsx → src/pages/preferences/preferencesTabs/notificationTab/useSubscriptionData.tsx

@@ -2,22 +2,15 @@ import { useMemo } from "react";
 import { useQuery } from "@apollo/client";
 import styled from "@emotion/styled";
 import { LeafyGreenTableRow } from "@leafygreen-ui/table";
-import {
-  getCommitsRoute,
-  getPatchRoute,
-  getTaskRoute,
-  getVersionRoute,
-} from "constants/routes";
 import { size } from "constants/tokens";
 import { convertFamilyTrigger } from "constants/triggers";
 import {
-  GeneralSubscription,
-  Selector,
   UserSubscriptionsQuery,
   UserSubscriptionsQueryVariables,
+  GeneralSubscription,
+  Selector,
 } from "gql/generated/types";
 import { USER_SUBSCRIPTIONS } from "gql/queries";
-import { ResourceType } from "types/triggers";
 
 export const useSubscriptionData = () => {
   const { data } = useQuery<
@@ -108,34 +101,7 @@ const ExpandedBlock = styled.pre`
   padding: ${size.s} ${size.l};
 `;
 
-export const getResourceRoute = (
-  resourceType: ResourceType,
-  selector: Selector
-) => {
-  const { data: id, type } = selector;
-
-  if (!id) {
-    return "";
-  }
-
-  switch (resourceType) {
-    case ResourceType.Build:
-    case ResourceType.Version: {
-      if (type === "project") {
-        return getCommitsRoute(id);
-      }
-      return getVersionRoute(id);
-    }
-    case ResourceType.Patch:
-      return getPatchRoute(id, { configure: false });
-    case ResourceType.Task:
-      return getTaskRoute(id);
-    default:
-      return "";
-  }
-};
-
-export const formatRegexSelectors = (regexSelectors: Selector[]) => ({
+const formatRegexSelectors = (regexSelectors: Selector[]) => ({
   "regex-selectors": regexSelectors.reduce<Record<string, string>>(
     (obj, { data, type }) => ({
       ...obj,