refactor: remove component subfolders (#184)

(and unused components)

src/pages/calendar/CalendarMain.tsx

@@ -1,4 +1,4 @@
-import Calendar from '@views/components/calendar/Calendar/Calendar';
+import Calendar from '@views/components/calendar/Calendar';
 import ExtensionRoot from '@views/components/common/ExtensionRoot/ExtensionRoot';
 import React from 'react';
 

src/stories/components/Button.stories.tsx

@@ -1,6 +1,6 @@
 import { colorsFlattened } from '@shared/util/themeColors';
 import type { Meta, StoryObj } from '@storybook/react';
-import { Button } from '@views/components/common/Button/Button';
+import { Button } from '@views/components/common/Button';
 import React from 'react';
 
 import AddIcon from '~icons/material-symbols/add';

src/stories/components/Card.stories.tsx

@@ -1,23 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import Card from '@views/components/common/Card/Card';
-import React from 'react';
-
-// More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
-const meta = {
-    title: 'Components/Common/Card',
-    component: Card,
-    parameters: {
-        // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/configure/story-layout
-        layout: 'centered',
-    },
-    args: {
-        children: <div>Hello</div>,
-    },
-    // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
-    tags: ['autodocs'],
-} satisfies Meta<typeof Card>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

src/stories/components/Chip.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { Chip } from '@views/components/common/Chip/Chip';
+import { Chip } from '@views/components/common/Chip';
 
 const meta = {
     title: 'Components/Common/Chip',

src/stories/components/ConflictsWithWarning.stories.tsx

@@ -3,7 +3,7 @@ import { CourseMeeting } from '@shared/types/CourseMeeting';
 import Instructor from '@shared/types/Instructor';
 import { getCourseColors } from '@shared/util/colors';
 import type { Meta, StoryObj } from '@storybook/react';
-import ConflictsWithWarning from '@views/components/common/ConflictsWithWarning/ConflictsWithWarning';
+import ConflictsWithWarning from '@views/components/common/ConflictsWithWarning';
 
 export const ExampleCourse: Course = new Course({
     courseName: 'ELEMS OF COMPTRS/PROGRAMMNG-WB',

src/stories/components/CourseStatus.stories.tsx

@@ -1,6 +1,6 @@
 import { Status } from '@shared/types/Course';
 import type { Meta, StoryObj } from '@storybook/react';
-import CourseStatus from '@views/components/common/CourseStatus/CourseStatus';
+import CourseStatus from '@views/components/common/CourseStatus';
 import React from 'react';
 
 const meta = {

src/stories/components/Divider.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { Button } from '@views/components/common/Button/Button';
-import Divider from '@views/components/common/Divider/Divider';
+import { Button } from '@views/components/common/Button';
+import Divider from '@views/components/common/Divider';
 import React from 'react';
 
 import AddIcon from '~icons/material-symbols/add';

src/stories/components/Dropdown.stories.tsx

@@ -2,10 +2,10 @@ import { UserScheduleStore } from '@shared/storage/UserScheduleStore';
 import { UserSchedule } from '@shared/types/UserSchedule';
 import { generateRandomId } from '@shared/util/random';
 import type { Meta, StoryObj } from '@storybook/react';
-import List from '@views/components/common/List/List';
-import type { ScheduleDropdownProps } from '@views/components/common/ScheduleDropdown/ScheduleDropdown';
-import ScheduleDropdown from '@views/components/common/ScheduleDropdown/ScheduleDropdown';
-import ScheduleListItem from '@views/components/common/ScheduleListItem/ScheduleListItem';
+import List from '@views/components/common/List';
+import type { ScheduleDropdownProps } from '@views/components/common/ScheduleDropdown';
+import ScheduleDropdown from '@views/components/common/ScheduleDropdown';
+import ScheduleListItem from '@views/components/common/ScheduleListItem';
 import useSchedules, { getActiveSchedule, switchSchedule } from '@views/hooks/useSchedules';
 import type { Serialized } from 'chrome-extension-toolkit';
 import React, { useEffect } from 'react';

src/stories/components/InfoCard.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import InfoCard from '@views/components/common/InfoCard/InfoCard';
+import InfoCard from '@views/components/common/InfoCard';
 
 const meta = {
     title: 'Components/Common/InfoCard',

src/stories/components/Link.stories.ts

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import Link from '@views/components/common/Link/Link';
+import Link from '@views/components/common/Link';
 
 const meta = {
     title: 'Components/Common/Link',

src/stories/components/List.stories.tsx

@@ -4,8 +4,8 @@ import { CourseMeeting } from '@shared/types/CourseMeeting';
 import Instructor from '@shared/types/Instructor';
 import { tailwindColorways } from '@shared/util/storybook';
 import type { Meta, StoryObj } from '@storybook/react';
-import List from '@views/components/common/List/List';
-import PopupCourseBlock from '@views/components/common/PopupCourseBlock/PopupCourseBlock';
+import List from '@views/components/common/List';
+import PopupCourseBlock from '@views/components/common/PopupCourseBlock';
 import React from 'react';
 
 const numberOfCourses = 5;

src/stories/components/PopupCourseBlock.stories.tsx

@@ -4,7 +4,7 @@ import Instructor from '@shared/types/Instructor';
 import { getCourseColors } from '@shared/util/colors';
 import { tailwindColorways } from '@shared/util/storybook';
 import type { Meta, StoryObj } from '@storybook/react';
-import PopupCourseBlock from '@views/components/common/PopupCourseBlock/PopupCourseBlock';
+import PopupCourseBlock from '@views/components/common/PopupCourseBlock';
 import React from 'react';
 
 /**

src/stories/components/Prompt.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { Button } from '@views/components/common/Button/Button';
-import type { PromptDialogProps } from '@views/components/common/Prompt/Prompt';
-import PromptDialog from '@views/components/common/Prompt/Prompt';
+import { Button } from '@views/components/common/Button';
+import type { PromptDialogProps } from '@views/components/common/Prompt';
+import PromptDialog from '@views/components/common/Prompt';
 import Text from '@views/components/common/Text/Text';
 import React from 'react';
 

src/stories/components/SchedulTotalHoursAndCourses.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import ScheduleTotalHoursAndCourses from '@views/components/common/ScheduleTotalHoursAndCourses/ScheduleTotalHoursAndCourses';
+import ScheduleTotalHoursAndCourses from '@views/components/common/ScheduleTotalHoursAndCourses';
 
 const meta = {
     title: 'Components/Common/ScheduleTotalHoursAndCourses',

src/stories/components/ScheduleListItem.stories.tsx

@@ -1,6 +1,6 @@
 import { UserSchedule } from '@shared/types/UserSchedule';
 import type { Meta, StoryObj } from '@storybook/react';
-import ScheduleListItem from '@views/components/common/ScheduleListItem/ScheduleListItem';
+import ScheduleListItem from '@views/components/common/ScheduleListItem';
 import useSchedules from '@views/hooks/useSchedules';
 import React from 'react';
 

src/stories/components/calendar/Calendar.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import Calendar from '@views/components/calendar/Calendar/Calendar';
+import Calendar from '@views/components/calendar/Calendar';
 
 const meta = {
     title: 'Components/Calendar/Calendar',

src/stories/components/calendar/CalendarBottomBar.stories.tsx

@@ -2,7 +2,7 @@ import { Course, Status } from '@shared/types/Course';
 import Instructor from '@shared/types/Instructor';
 import { getCourseColors } from '@shared/util/colors';
 import type { Meta, StoryObj } from '@storybook/react';
-import CalendarBottomBar from '@views/components/calendar/CalendarBottomBar/CalendarBottomBar';
+import CalendarBottomBar from '@views/components/calendar/CalendarBottomBar';
 import React from 'react';
 
 const exampleGovCourse: Course = new Course({

src/stories/components/calendar/CalendarCourse.stories.tsx

@@ -1,62 +0,0 @@
-import { Course, Status } from '@shared/types/Course';
-import { CourseMeeting, DAY_MAP } from '@shared/types/CourseMeeting';
-import { CourseSchedule } from '@shared/types/CourseSchedule';
-import Instructor from '@shared/types/Instructor';
-import { getCourseColors } from '@shared/util/colors';
-import type { Meta, StoryObj } from '@storybook/react';
-import CalendarCourse from '@views/components/calendar/CalendarCourseBlock/CalendarCourseMeeting';
-
-const meta = {
-    title: 'Components/Calendar/CalendarCourseMeeting',
-    component: CalendarCourse,
-    parameters: {
-        layout: 'centered',
-    },
-    tags: ['autodocs'],
-    argTypes: {
-        course: { control: 'object' },
-        meetingIdx: { control: 'number' },
-    },
-} satisfies Meta<typeof CalendarCourse>;
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
-    args: {
-        course: new Course({
-            uniqueId: 123,
-            number: '311C',
-            fullName: "311C - Bevo's Default Course",
-            courseName: "Bevo's Default Course",
-            department: 'BVO',
-            creditHours: 3,
-            status: Status.OPEN,
-            instructors: [new Instructor({ firstName: '', lastName: 'Bevo', fullName: 'Bevo' })],
-            isReserved: false,
-            url: '',
-            flags: [],
-            schedule: new CourseSchedule({
-                meetings: [
-                    new CourseMeeting({
-                        days: [DAY_MAP.M, DAY_MAP.W, DAY_MAP.F],
-                        startTime: 480,
-                        endTime: 570,
-                        location: {
-                            building: 'UTC',
-                            room: '123',
-                        },
-                    }),
-                ],
-            }),
-            instructionMode: 'In Person',
-            semester: {
-                year: 2024,
-                season: 'Spring',
-            },
-            scrapedAt: Date.now(),
-            colors: getCourseColors('emerald', 500),
-        }),
-        meetingIdx: 0,
-    },
-};

src/stories/components/calendar/CalendarCourseCell.stories.tsx

@@ -1,8 +1,8 @@
 import { Status } from '@shared/types/Course';
 import { getCourseColors } from '@shared/util/colors';
 import type { Meta, StoryObj } from '@storybook/react';
-import type { CalendarCourseCellProps } from '@views/components/calendar/CalendarCourseCell/CalendarCourseCell';
-import CalendarCourseCell from '@views/components/calendar/CalendarCourseCell/CalendarCourseCell';
+import type { CalendarCourseCellProps } from '@views/components/calendar/CalendarCourseCell';
+import CalendarCourseCell from '@views/components/calendar/CalendarCourseCell';
 import React from 'react';
 
 import { ExampleCourse } from '../PopupCourseBlock.stories';

src/stories/components/calendar/CalendarGrid.stories.tsx

@@ -1,7 +1,7 @@
 import { Status } from '@shared/types/Course';
 import { getCourseColors } from '@shared/util/colors';
 import type { Meta, StoryObj } from '@storybook/react';
-import CalendarGrid from '@views/components/calendar/CalendarGrid/CalendarGrid';
+import CalendarGrid from '@views/components/calendar/CalendarGrid';
 import type { CalendarGridCourse } from '@views/hooks/useFlattenedCourseSchedule';
 
 import { ExampleCourse } from '../PopupCourseBlock.stories';

src/stories/components/calendar/CalendarGridCell.stories.tsx

@@ -1,6 +1,6 @@
 // Calendar.stories.tsx
 import type { Meta, StoryObj } from '@storybook/react';
-import CalendarCell from '@views/components/calendar/CalendarGridCell/CalendarGridCell';
+import CalendarCell from '@views/components/calendar/CalendarGridCell';
 
 const meta = {
     title: 'Components/Calendar/CalendarGridCell',

src/stories/components/calendar/CalendarHeader.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import CalendarHeader from '@views/components/calendar/CalendarHeader/CalenderHeader';
+import CalendarHeader from '@views/components/calendar/CalenderHeader';
 
 const meta = {
     title: 'Components/Calendar/CalendarHeader',

src/stories/components/calendar/CalendarSchedules.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { CalendarSchedules } from '@views/components/calendar/CalendarSchedules/CalendarSchedules';
+import { CalendarSchedules } from '@views/components/calendar/CalendarSchedules';
 
 const meta = {
     title: 'Components/Calendar/CalendarSchedules',

src/views/components/PopupMain.tsx

@@ -1,8 +1,8 @@
 import { background } from '@shared/messages';
 import { UserScheduleStore } from '@shared/storage/UserScheduleStore';
-import Divider from '@views/components/common/Divider/Divider';
+import Divider from '@views/components/common/Divider';
 import ExtensionRoot from '@views/components/common/ExtensionRoot/ExtensionRoot';
-import List from '@views/components/common/List/List';
+import List from '@views/components/common/List';
 import Text from '@views/components/common/Text/Text';
 import useSchedules, { getActiveSchedule, replaceSchedule, switchSchedule } from '@views/hooks/useSchedules';
 import { getUpdatedAtDateTimeString } from '@views/lib/getUpdatedAtDateTimeString';
@@ -14,11 +14,11 @@ import CalendarIcon from '~icons/material-symbols/calendar-month';
 import RefreshIcon from '~icons/material-symbols/refresh';
 import SettingsIcon from '~icons/material-symbols/settings';
 
-import CourseStatus from './common/CourseStatus/CourseStatus';
+import CourseStatus from './common/CourseStatus';
 import { SmallLogo } from './common/LogoIcon';
-import PopupCourseBlock from './common/PopupCourseBlock/PopupCourseBlock';
-import ScheduleDropdown from './common/ScheduleDropdown/ScheduleDropdown';
-import ScheduleListItem from './common/ScheduleListItem/ScheduleListItem';
+import PopupCourseBlock from './common/PopupCourseBlock';
+import ScheduleDropdown from './common/ScheduleDropdown';
+import ScheduleListItem from './common/ScheduleListItem';
 
 /**
  * Renders the main popup component.

src/views/components/calendar/Calendar.tsx

@@ -1,18 +1,18 @@
 import type { CalendarTabMessages } from '@shared/messages/CalendarMessages';
 import type { Course } from '@shared/types/Course';
-import CalendarBottomBar from '@views/components/calendar/CalendarBottomBar/CalendarBottomBar';
-import CalendarGrid from '@views/components/calendar/CalendarGrid/CalendarGrid';
-import CalendarHeader from '@views/components/calendar/CalendarHeader/CalenderHeader';
-import { CalendarSchedules } from '@views/components/calendar/CalendarSchedules/CalendarSchedules';
+import CalendarBottomBar from '@views/components/calendar/CalendarBottomBar';
+import CalendarGrid from '@views/components/calendar/CalendarGrid';
+import { CalendarSchedules } from '@views/components/calendar/CalendarSchedules';
+import CalendarHeader from '@views/components/calendar/CalenderHeader';
 import ImportantLinks from '@views/components/calendar/ImportantLinks';
-import Divider from '@views/components/common/Divider/Divider';
+import Divider from '@views/components/common/Divider';
 import CourseCatalogInjectedPopup from '@views/components/injected/CourseCatalogInjectedPopup/CourseCatalogInjectedPopup';
 import { useFlattenedCourseSchedule } from '@views/hooks/useFlattenedCourseSchedule';
 import { MessageListener } from 'chrome-extension-toolkit';
 import React, { useEffect, useRef, useState } from 'react';
 
-import CalendarFooter from '../CalendarFooter';
-import TeamLinks from '../TeamLinks';
+import CalendarFooter from './CalendarFooter';
+import TeamLinks from './TeamLinks';
 
 /**
  * Calendar page component

src/views/components/calendar/CalendarBottomBar.tsx

@@ -1,6 +1,6 @@
 import { saveAsCal, saveCalAsPng } from '@views/components/calendar/utils';
-import { Button } from '@views/components/common/Button/Button';
-import Divider from '@views/components/common/Divider/Divider';
+import { Button } from '@views/components/common/Button';
+import Divider from '@views/components/common/Divider';
 import Text from '@views/components/common/Text/Text';
 import clsx from 'clsx';
 import React from 'react';
@@ -8,8 +8,8 @@ import React from 'react';
 import CalendarMonthIcon from '~icons/material-symbols/calendar-month';
 import ImageIcon from '~icons/material-symbols/image';
 
-import type { CalendarCourseCellProps } from '../CalendarCourseCell/CalendarCourseCell';
-import CalendarCourseBlock from '../CalendarCourseCell/CalendarCourseCell';
+import type { CalendarCourseCellProps } from './CalendarCourseCell';
+import CalendarCourseBlock from './CalendarCourseCell';
 
 type CalendarBottomBarProps = {
     courses?: CalendarCourseCellProps[];

src/views/components/calendar/CalendarCourseBlock/CalendarCourseMeeting.module.scss

@@ -1,34 +0,0 @@
-.component {
-    display: flex;
-    padding: 7px 7px 9px 7px;
-    flex-direction: column;
-    align-items: flex-start;
-    gap: 5px;
-    flex: 1 0 0;
-    align-self: stretch;
-    border-radius: 4px;
-    background: #cbd5e1;
-    .content {
-        display: flex;
-        gap: 7px;
-        .course-detail {
-            display: flex;
-            flex-direction: column;
-            gap: 5px;
-            width: 154px;
-            .course {
-                font-size: 16px;
-                line-height: 16px;
-                font-weight: 600;
-                white-space: nowrap;
-                overflow: hidden;
-                text-overflow: ellipsis;
-            }
-            .time-and-location {
-                font-size: 11px;
-                line-height: 11px;
-                font-weight: 400;
-            }
-        }
-    }
-}

src/views/components/calendar/CalendarCourseBlock/CalendarCourseMeeting.tsx

@@ -1,45 +0,0 @@
-import type { Course } from '@shared/types/Course';
-import React from 'react';
-
-import styles from './CalendarCourseMeeting.module.scss';
-
-/**
- * Props for the CalendarCourseMeeting component.
- */
-export interface CalendarCourseMeetingProps {
-    /** The Course that the meeting is for. */
-    course: Course;
-    /* index into course meeting array to display */
-    meetingIdx?: number;
-}
-
-/**
- * `CalendarCourseMeeting` is a functional component that displays a course meeting.
- *
- * @example
- * <CalendarCourseMeeting course={course} meeting={meeting} />
- */
-export default function CalendarCourseMeeting({ course, meetingIdx }: CalendarCourseMeetingProps): JSX.Element | null {
-    let meeting = meetingIdx !== undefined ? course.schedule.meetings[meetingIdx] : undefined;
-
-    if (!meeting) {
-        return null;
-    }
-
-    return (
-        <div className={styles.component}>
-            <div className={styles.content}>
-                <div className={styles['course-detail']}>
-                    <div className={styles.course}>
-                        {course.department} {course.number} - {course.instructors[0]?.lastName}
-                    </div>
-                    <div className={styles['time-and-location']}>
-                        {`${meeting.getTimeString({ separator: '-', capitalize: true })}${
-                            meeting.location ? ` - ${meeting.location.building}` : ''
-                        }`}
-                    </div>
-                </div>
-            </div>
-        </div>
-    );
-}

src/views/components/calendar/CalendarCourseCellColorPicker/CourseCellColorPicker.tsx

@@ -1,6 +1,6 @@
 import type { ThemeColor, TWIndex } from '@shared/types/ThemeColors';
 import { getThemeColorHexByName } from '@shared/util/themeColors';
-import Divider from '@views/components/common/Divider/Divider';
+import Divider from '@views/components/common/Divider';
 import React from 'react';
 import { theme } from 'unocss/preset-mini';
 

src/views/components/calendar/CalendarFooter.tsx

@@ -4,7 +4,7 @@ import DiscordIcon from '~icons/ri/discord-line';
 import GithubIcon from '~icons/ri/github-fill';
 import InstagramIcon from '~icons/ri/instagram-line';
 
-import Link from '../common/Link/Link';
+import Link from '../common/Link';
 
 /**
  * The footer section of the calendar's sidebar

src/views/components/calendar/CalendarGrid.tsx

@@ -1,10 +1,10 @@
 import type { Course } from '@shared/types/Course';
-import CalendarCourseCell from '@views/components/calendar/CalendarCourseCell/CalendarCourseCell';
+import CalendarCourseCell from '@views/components/calendar/CalendarCourseCell';
 import Text from '@views/components/common/Text/Text';
 import type { CalendarGridCourse } from '@views/hooks/useFlattenedCourseSchedule';
 import React from 'react';
 
-import CalendarCell from '../CalendarGridCell/CalendarGridCell';
+import CalendarCell from './CalendarGridCell';
 
 const daysOfWeek = ['MON', 'TUE', 'WED', 'THU', 'FRI'];
 const hoursOfDay = Array.from({ length: 14 }, (_, index) => index + 8);

src/views/components/calendar/CalendarSchedules.tsx

@@ -1,8 +1,8 @@
 import createSchedule from '@pages/background/lib/createSchedule';
 import { UserScheduleStore } from '@shared/storage/UserScheduleStore';
-import { Button } from '@views/components/common/Button/Button';
-import List from '@views/components/common/List/List';
-import ScheduleListItem from '@views/components/common/ScheduleListItem/ScheduleListItem';
+import { Button } from '@views/components/common/Button';
+import List from '@views/components/common/List';
+import ScheduleListItem from '@views/components/common/ScheduleListItem';
 import Text from '@views/components/common/Text/Text';
 import useSchedules, { getActiveSchedule, switchSchedule } from '@views/hooks/useSchedules';
 import React from 'react';

src/views/components/calendar/CalenderHeader.tsx

@@ -1,9 +1,9 @@
 import { Status } from '@shared/types/Course';
-import { Button } from '@views/components/common/Button/Button';
-import CourseStatus from '@views/components/common/CourseStatus/CourseStatus';
-import Divider from '@views/components/common/Divider/Divider';
+import { Button } from '@views/components/common/Button';
+import CourseStatus from '@views/components/common/CourseStatus';
+import Divider from '@views/components/common/Divider';
 import { LargeLogo } from '@views/components/common/LogoIcon';
-import ScheduleTotalHoursAndCourses from '@views/components/common/ScheduleTotalHoursAndCourses/ScheduleTotalHoursAndCourses';
+import ScheduleTotalHoursAndCourses from '@views/components/common/ScheduleTotalHoursAndCourses';
 import Text from '@views/components/common/Text/Text';
 import useSchedules from '@views/hooks/useSchedules';
 import { getUpdatedAtDateTimeString } from '@views/lib/getUpdatedAtDateTimeString';

src/views/components/common/Card/Card.module.scss

@@ -1,10 +0,0 @@
-@use 'src/views/styles/colors.module.scss';
-
-.card {
-    background: colors.$white;
-    border: 0.5px dotted #c3cee0;
-    box-sizing: border-box;
-
-    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
-    border-radius: 8px;
-}

src/views/components/common/Card/Card.tsx

@@ -1,31 +0,0 @@
-import clsx from 'clsx';
-import React from 'react';
-
-import styles from './Card.module.scss';
-
-/**
- * Props for the Card component.
- */
-export type Props = {
-    style?: React.CSSProperties;
-    className?: string;
-    onClick?: (...args: unknown[]) => void;
-    children?: React.ReactNode;
-    testId?: string;
-};
-
-/**
- * A reusable Card component that can be used to wrap other components
- */
-export default function Card(props: Props) {
-    return (
-        <div
-            style={props.style}
-            className={clsx(styles.card, props.className)}
-            onClick={props.onClick}
-            data-testid={props.testId}
-        >
-            {props.children}
-        </div>
-    );
-}

src/views/components/common/Dialog.tsx

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import type { PropsWithChildren } from 'react';
 import React, { Fragment } from 'react';
 
-import ExtensionRoot from '../ExtensionRoot/ExtensionRoot';
+import ExtensionRoot from './ExtensionRoot/ExtensionRoot';
 
 export interface _DialogProps {
     className?: string;

src/views/components/common/List.tsx

@@ -3,7 +3,7 @@ import { DragDropContext, Draggable, Droppable } from '@hello-pangea/dnd';
 import type { ReactElement } from 'react';
 import React, { useCallback, useEffect, useState } from 'react';
 
-import ExtensionRoot from '../ExtensionRoot/ExtensionRoot';
+import ExtensionRoot from './ExtensionRoot/ExtensionRoot';
 
 /*
  * Ctrl + f dragHandleProps on PopupCourseBlock.tsx for example implementation of drag handle (two lines of code)

src/views/components/common/Prompt.tsx

@@ -2,8 +2,8 @@ import { Dialog, Transition } from '@headlessui/react';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import type { Button } from '../Button/Button';
-import type Text from '../Text/Text';
+import type { Button } from './Button';
+import type Text from './Text/Text';
 
 /**
  * Props for the PromptDialog component.

src/views/components/injected/CourseCatalogInjectedPopup/CourseCatalogInjectedPopup.tsx

@@ -1,6 +1,6 @@
 import type { Course } from '@shared/types/Course';
-import type { DialogProps } from '@views/components/common/Dialog/Dialog';
-import Dialog from '@views/components/common/Dialog/Dialog';
+import type { DialogProps } from '@views/components/common/Dialog';
+import Dialog from '@views/components/common/Dialog';
 import useSchedules from '@views/hooks/useSchedules';
 import React from 'react';
 

src/views/components/injected/CourseCatalogInjectedPopup/HeadingAndActions.tsx

@@ -2,10 +2,10 @@ import { background } from '@shared/messages';
 import type { Course } from '@shared/types/Course';
 import type Instructor from '@shared/types/Instructor';
 import type { UserSchedule } from '@shared/types/UserSchedule';
-import { Button } from '@views/components/common/Button/Button';
-import { Chip, flagMap } from '@views/components/common/Chip/Chip';
-import Divider from '@views/components/common/Divider/Divider';
-import Link from '@views/components/common/Link/Link';
+import { Button } from '@views/components/common/Button';
+import { Chip, flagMap } from '@views/components/common/Chip';
+import Divider from '@views/components/common/Divider';
+import Link from '@views/components/common/Link';
 import Text from '@views/components/common/Text/Text';
 import React from 'react';
 

src/views/components/injected/RecruitmentBanner/RecruitmentBanner.tsx

@@ -1,4 +1,4 @@
-import Link from '@views/components/common/Link/Link';
+import Link from '@views/components/common/Link';
 import Text from '@views/components/common/Text/Text';
 import React, { useEffect, useState } from 'react';
 import { createPortal } from 'react-dom';

src/views/components/injected/TableRow/TableRow.tsx

@@ -1,6 +1,6 @@
 import type { Course, ScrapedRow } from '@shared/types/Course';
 import type { UserSchedule } from '@shared/types/UserSchedule';
-import ConflictsWithWarning from '@views/components/common/ConflictsWithWarning/ConflictsWithWarning';
+import ConflictsWithWarning from '@views/components/common/ConflictsWithWarning';
 import ExtensionRoot from '@views/components/common/ExtensionRoot/ExtensionRoot';
 import React, { useEffect, useState } from 'react';
 import ReactDOM from 'react-dom';

src/views/hooks/useFlattenedCourseSchedule.ts

@@ -3,7 +3,7 @@ import type { Course, StatusType } from '@shared/types/Course';
 import type { CourseMeeting } from '@shared/types/CourseMeeting';
 import { colors } from '@shared/types/ThemeColors';
 import type { UserSchedule } from '@shared/types/UserSchedule';
-import type { CalendarCourseCellProps } from '@views/components/calendar/CalendarCourseCell/CalendarCourseCell';
+import type { CalendarCourseCellProps } from '@views/components/calendar/CalendarCourseCell';
 
 import useSchedules from './useSchedules';