Feat: Disallow Relative import

.eslintrc.json

@@ -19,13 +19,8 @@
   ],
   "overrides": [
     {
-      "files": [
-        "**/*.mdx"
-      ],
-      "extends": [
-        "plugin:react/recommended",
-        "plugin:mdx/recommended"
-      ],
+      "files": ["**/*.mdx"],
+      "extends": ["plugin:react/recommended", "plugin:mdx/recommended"],
       "rules": {
         "react/jsx-no-target-blank": "off",
         "i18next/no-literal-string": "off"
@@ -40,10 +35,7 @@
     "ecmaVersion": 12,
     "sourceType": "module"
   },
-  "plugins": [
-    "@typescript-eslint",
-    "i18next"
-  ],
+  "plugins": ["@typescript-eslint", "i18next", "no-relative-import-paths"],
   "rules": {
     "no-unused-vars": "off",
     "@typescript-eslint/no-unused-vars": [
@@ -61,22 +53,20 @@
       {
         "mode": "jsx-only",
         "jsx-attributes": {
-          "include": [
-            "label",
-            "placeholder",
-            "error",
-            "title"
-          ],
-          "exclude": [
-            ".*"
-          ]
+          "include": ["label", "placeholder", "error", "title"],
+          "exclude": [".*"]
         },
         "callees": {
-          "exclude": [
-            ".*"
-          ]
+          "exclude": [".*"]
         }
       }
+    ],
+    "no-relative-import-paths/no-relative-import-paths": [
+      "error",
+      {
+        "allowSameFolder": true,
+        "prefix": "@"
+      }
     ]
   },
   "ignorePatterns": [

package.json

@@ -155,6 +155,7 @@
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-i18next": "^6.1.0",
     "eslint-plugin-mdx": "^3.1.5",
+    "eslint-plugin-no-relative-import-paths": "^1.6.1",
     "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^5.0.0",

src/Routers/AppRouter.tsx

@@ -32,9 +32,9 @@ const PATHS_WITHOUT_SIDEBAR = ["/", "/session-expired"];
 
 export type RouteParams<T extends string> =
   T extends `${string}:${infer Param}/${infer Rest}`
-    ? { [K in Param | keyof RouteParams<Rest>]: string }
+    ? { [_ in Param | keyof RouteParams<Rest>]: string }
     : T extends `${string}:${infer Param}`
-      ? { [K in Param]: string }
+      ? { [_ in Param]: string }
       : Record<string, never>;
 
 export type RouteFunction<T extends string> = (

src/Routers/routes/questionnaireRoutes.tsx

@@ -2,7 +2,7 @@ import { QuestionnaireList } from "@/components/Questionnaire";
 import QuestionnaireEditor from "@/components/Questionnaire/QuestionnaireEditor";
 import { QuestionnaireShow } from "@/components/Questionnaire/show";
 
-import { AppRoutes } from "../AppRouter";
+import { AppRoutes } from "@/Routers/AppRouter";
 
 const QuestionnaireRoutes: AppRoutes = {
   "/questionnaire": () => <QuestionnaireList />,

src/Utils/request/types.ts

@@ -42,7 +42,7 @@ type ExtractRouteParams<T extends string> =
     : never;
 
 type PathParams<T extends string> = {
-  [K in ExtractRouteParams<T>]: string;
+  [_ in ExtractRouteParams<T>]: string;
 };
 
 export interface ApiCallOptions<Route extends ApiRoute<unknown, unknown>> {

src/Utils/types.ts

@@ -16,15 +16,15 @@ export interface BaseModel {
 export type Writable<T> = T extends object
   ? {
       [P in keyof T as IfEquals<
-        { [Q in P]: T[P] },
-        { -readonly [Q in P]: T[P] },
+        { [_ in P]: T[P] },
+        { -readonly [_ in P]: T[P] },
         never,
         P
       >]?: undefined;
     } & {
       [P in keyof T as IfEquals<
-        { [Q in P]: T[P] },
-        { -readonly [Q in P]: T[P] },
+        { [_ in P]: T[P] },
+        { -readonly [_ in P]: T[P] },
         P,
         never
       >]: T[P] extends object ? Writable<T[P]> : T[P];
@@ -38,8 +38,8 @@ export type Writable<T> = T extends object
 export type WritableOnly<T> = T extends object
   ? {
       [P in keyof T as IfEquals<
-        { [Q in P]: T[P] },
-        { -readonly [Q in P]: T[P] },
+        { [_ in P]: T[P] },
+        { -readonly [_ in P]: T[P] },
         P
       >]: T[P] extends object ? WritableOnly<T[P]> : T[P];
     }

src/components/Common/Charts/ObservationChart.tsx

@@ -22,12 +22,13 @@ import {
 } from "@/components/ui/table";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 
+import { Avatar } from "@/components/Common/Avatar";
+
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
 import { ObservationAnalyzeResponse } from "@/types/emr/observation";
 import { Code } from "@/types/questionnaire/code";
 
-import { Avatar } from "../Avatar";
 import { ObservationHistoryTable } from "./ObservationHistoryTable";
 
 export type ObservationPlotConfig = {

src/components/Common/Charts/ObservationHistoryTable.tsx

@@ -12,13 +12,13 @@ import {
   TableRow,
 } from "@/components/ui/table";
 
+import { Avatar } from "@/components/Common/Avatar";
+
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
 import { ObservationWithUser } from "@/types/emr/observation";
 import { Code } from "@/types/questionnaire/code";
 
-import { Avatar } from "../Avatar";
-
 interface PaginatedResponse<T> {
   count: number;
   next: string | null;

src/components/ErrorPages/DefaultErrorPage.tsx

@@ -2,9 +2,9 @@ import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 
-import useAppHistory from "@/hooks/useAppHistory";
+import { Button } from "@/components/ui/button";
 
-import { Button } from "../ui/button";
+import useAppHistory from "@/hooks/useAppHistory";
 
 type ErrorType = "PAGE_NOT_FOUND" | "PAGE_LOAD_ERROR" | "CUSTOM_ERROR";
 

src/components/Facility/DuplicatePatientDialog.tsx

@@ -3,19 +3,19 @@ import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import DialogModal from "@/components/Common/Dialog";
-
-import { PartialPatientModel } from "@/types/emr/newPatient";
-
-import { Button } from "../ui/button";
+import { Button } from "@/components/ui/button";
 import {
   Table,
   TableBody,
   TableCell,
   TableHead,
   TableHeader,
   TableRow,
-} from "../ui/table";
+} from "@/components/ui/table";
+
+import DialogModal from "@/components/Common/Dialog";
+
+import { PartialPatientModel } from "@/types/emr/newPatient";
 
 interface Props {
   patientList: Array<PartialPatientModel>;

src/components/Facility/EncounterCard.tsx

@@ -7,12 +7,11 @@ import { cn } from "@/lib/utils";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
 import { Badge } from "@/components/ui/badge";
+import { buttonVariants } from "@/components/ui/button";
 
 import { formatDateTime } from "@/Utils/utils";
 import { Encounter, completedEncounterStatus } from "@/types/emr/encounter";
 
-import { buttonVariants } from "../ui/button";
-
 interface EncounterCardProps {
   encounter: Encounter;
 }

src/components/Files/AudioCaptureDialog.tsx

@@ -7,7 +7,7 @@ import CareIcon from "@/CAREUI/icons/CareIcon";
 
 import { useTimer } from "@/hooks/useTimer";
 
-import useVoiceRecorder from "../../Utils/useVoiceRecorder";
+import useVoiceRecorder from "@/Utils/useVoiceRecorder";
 
 export interface AudioCaptureDialogProps {
   show: boolean;

src/components/Patient/MedicationStatementList.tsx

@@ -14,13 +14,16 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
 
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
 import { formatDateTime } from "@/Utils/utils";
 
-import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip";
-
 interface MedicationStatementListProps {
   patientId: string;
 }

src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx

@@ -1,9 +1,9 @@
+import { MedicationStatementList } from "@/components/Patient/MedicationStatementList";
+import { AllergyList } from "@/components/Patient/allergy/list";
 import { DiagnosisList } from "@/components/Patient/diagnosis/list";
 import { SymptomsList } from "@/components/Patient/symptoms/list";
 
 import { PatientProps } from ".";
-import { MedicationStatementList } from "../MedicationStatementList";
-import { AllergyList } from "../allergy/list";
 
 export const HealthProfileSummary = (props: PatientProps) => {
   const { id } = props;

src/components/Patient/PatientRegistration.tsx

@@ -10,6 +10,7 @@ import { z } from "zod";
 import CareIcon from "@/CAREUI/icons/CareIcon";
 import SectionNavigator from "@/CAREUI/misc/SectionNavigator";
 
+import Autocomplete from "@/components/ui/autocomplete";
 import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
 import {
@@ -57,8 +58,6 @@ import GovtOrganizationSelector from "@/pages/Organization/components/GovtOrgani
 import { PatientModel } from "@/types/emr/patient";
 import { Organization } from "@/types/organization/organization";
 
-import Autocomplete from "../ui/autocomplete";
-
 interface PatientRegistrationPageProps {
   facilityId: string;
   patientId?: string;

src/components/Questionnaire/QuestionTypes/EncounterQuestion.tsx

@@ -10,6 +10,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
+import { Switch } from "@/components/ui/switch";
 
 import routes from "@/Utils/request/api";
 import query from "@/Utils/request/query";
@@ -28,8 +29,6 @@ import type {
 } from "@/types/questionnaire/form";
 import type { Question } from "@/types/questionnaire/question";
 
-import { Switch } from "../../../components/ui/switch";
-
 interface EncounterQuestionProps {
   question: Question;
   encounterId: string;

src/components/Questionnaire/QuestionnaireEditor.tsx

@@ -28,6 +28,8 @@ import { Switch } from "@/components/ui/switch";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Textarea } from "@/components/ui/textarea";
 
+import Loading from "@/components/Common/Loading";
+
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import {
@@ -44,7 +46,6 @@ import {
 } from "@/types/questionnaire/questionnaire";
 import questionnaireApi from "@/types/questionnaire/questionnaireApi";
 
-import Loading from "../Common/Loading";
 import { QuestionnaireForm } from "./QuestionnaireForm";
 
 interface QuestionnaireEditorProps {

src/components/Questionnaire/index.tsx

@@ -4,12 +4,12 @@ import { useNavigate } from "raviger";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 
+import Loading from "@/components/Common/Loading";
+
 import query from "@/Utils/request/query";
 import { QuestionnaireDetail } from "@/types/questionnaire/questionnaire";
 import questionnaireApi from "@/types/questionnaire/questionnaireApi";
 
-import Loading from "../Common/Loading";
-
 export function QuestionnaireList() {
   const navigate = useNavigate();
   const { data: response, isLoading } = useQuery({

src/components/Questionnaire/show.tsx

@@ -27,12 +27,13 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 
+import Loading from "@/components/Common/Loading";
+
 import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
 import type { Question } from "@/types/questionnaire/question";
 import questionnaireApi from "@/types/questionnaire/questionnaireApi";
 
-import Loading from "../Common/Loading";
 import CloneQuestionnaireSheet from "./CloneQuestionnaireSheet";
 import ManageQuestionnaireOrganizationsSheet from "./ManageQuestionnaireOrganizationsSheet";
 import ManageQuestionnaireTagsSheet from "./ManageQuestionnaireTagsSheet";

src/components/Resource/ResourceCommentSection.tsx

@@ -6,6 +6,7 @@ import PaginatedList from "@/CAREUI/misc/PaginatedList";
 
 import { Button } from "@/components/ui/button";
 
+import { Avatar } from "@/components/Common/Avatar";
 import CircularProgress from "@/components/Common/CircularProgress";
 import TextAreaFormField from "@/components/Form/FormFields/TextAreaFormField";
 
@@ -14,8 +15,6 @@ import request from "@/Utils/request/request";
 import { formatName } from "@/Utils/utils";
 import { CommentModel } from "@/types/resourceRequest/resourceRequest";
 
-import { Avatar } from "../Common/Avatar";
-
 const CommentSection = (props: { id: string }) => {
   const [commentBox, setCommentBox] = useState("");
 

src/components/Resource/ResourceDetails.tsx

@@ -11,6 +11,7 @@ import { Separator } from "@/components/ui/separator";
 
 import Loading from "@/components/Common/Loading";
 import Page from "@/components/Common/Page";
+import { FacilityModel } from "@/components/Facility/models";
 import CommentSection from "@/components/Resource/ResourceCommentSection";
 
 import { RESOURCE_CATEGORY_CHOICES } from "@/common/constants";
@@ -21,8 +22,6 @@ import { formatDateTime, formatName } from "@/Utils/utils";
 import { PatientModel } from "@/types/emr/patient";
 import { ResourceRequest } from "@/types/resourceRequest/resourceRequest";
 
-import { FacilityModel } from "../Facility/models";
-
 function PatientCard({ patient }: { patient: PatientModel }) {
   const { t } = useTranslation();
   return (