chore: lint-format-docs-tests-bugfixes (#105)

* docs: add jsdoc

* feat: change enums to as const objects

* chore(test): add themeColors.test.ts

* fix: fix tests and bugs with strings.ts util

* fix: path alias imports and tsconfig file bug

* fix: remove --max-warnings 0
This commit is contained in:
doprz
2024-02-22 22:42:58 -06:00
parent 8ab60c9f01
commit 8a6e9070e0
134 changed files with 986 additions and 623 deletions

View File

@@ -1,7 +1,10 @@
import clsx from 'clsx';
import React from 'react';
import type IconComponent from '~icons/material-symbols';
import { ThemeColor, getThemeColorHexByName, getThemeColorRgbByName } from '../../../../shared/util/themeColors';
import type { ThemeColor } from '../../../../shared/util/themeColors';
import { getThemeColorHexByName, getThemeColorRgbByName } from '../../../../shared/util/themeColors';
import Text from '../Text/Text';
interface Props {

View File

@@ -1,7 +1,11 @@
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;

View File

@@ -1,4 +1,5 @@
import React from 'react';
import Text from '../Text/Text';
/**

View File

@@ -1,6 +1,7 @@
import React from 'react';
import { Course } from 'src/shared/types/Course';
import clsx from 'clsx';
import React from 'react';
import type { Course } from 'src/shared/types/Course';
import Text from '../Text/Text';
/**
@@ -28,9 +29,7 @@ export default function ConflictsWithWarning({ className, conflicts }: Conflicts
>
<div>Conflicts With:</div>
{conflicts.map(course => (
<div>
{`${course.department} ${course.number} (${course.uniqueId})`}
</div>
<div>{`${course.department} ${course.number} (${course.uniqueId})`}</div>
))}
</Text>
);

View File

@@ -1,7 +1,8 @@
import { Status } from '@shared/types/Course';
import type { Status } from '@shared/types/Course';
import { StatusIcon } from '@shared/util/icons';
import clsx from 'clsx';
import React from 'react';
import Text from '../Text/Text';
type SizeType = 'small' | 'mini';

View File

@@ -1,3 +1,4 @@
import type { Color } from '@views/styles/colors.module.scss';
import clsx from 'clsx';
import React from 'react';

View File

@@ -1,12 +1,16 @@
import { Disclosure, Transition } from '@headlessui/react';
import { UserSchedule } from '@shared/types/UserSchedule';
import type { UserSchedule } from '@shared/types/UserSchedule';
import List from '@views/components/common/List/List';
import Text from '@views/components/common/Text/Text';
import React from 'react';
import userScheduleHandler from 'src/pages/background/handler/userScheduleHandler';
import DropdownArrowDown from '~icons/material-symbols/arrow-drop-down';
import DropdownArrowUp from '~icons/material-symbols/arrow-drop-up';
import List from '../List/List';
import Text from '../Text/Text';
/**
* Props for the Dropdown component.
*/
export type Props = {
style?: React.CSSProperties;
// Dummy value solely for storybook
@@ -62,7 +66,7 @@ export default function Dropdown(props: Props) {
<Disclosure.Button>
<div className='flex items-center border-none bg-white p-3 text-left'>
<div className='flex-1'>
<Text as='div' variant='h4' className='text-ut-burntorange mb-1 w-100%'>
<Text as='div' variant='h4' className='mb-1 w-100% text-ut-burntorange'>
MAIN SCHEDULE:
</Text>
<div>
@@ -74,7 +78,7 @@ export default function Dropdown(props: Props) {
</Text>
</div>
</div>
<Text className='text-ut-burntorange text-2xl font-normal'>
<Text className='text-2xl text-ut-burntorange font-normal'>
{expanded ? <DropdownArrowDown /> : <DropdownArrowUp />}
</Text>
</div>

View File

@@ -1,9 +1,10 @@
import React from 'react';
import styles from './ExtensionRoot.module.scss';
import '@unocss/reset/tailwind-compat.css';
import 'uno.css';
import React from 'react';
import styles from './ExtensionRoot.module.scss';
interface Props {
testId?: string;
}

View File

@@ -1,9 +1,12 @@
import type { Color } from '@views/styles/colors.module.scss';
import colors from '@views/styles/colors.module.scss';
import type { Size } from '@views/styles/fonts.module.scss';
import fonts from '@views/styles/fonts.module.scss';
import clsx from 'clsx';
import React from 'react';
import colors, { Color } from '@views/styles/colors.module.scss';
import fonts, { Size } from '@views/styles/fonts.module.scss';
import styles from './Icon.module.scss';
import { MaterialIconCode } from './MaterialIcons';
import type { MaterialIconCode } from './MaterialIcons';
/**
*

View File

@@ -2194,4 +2194,7 @@ const icons = [
'zoom_out_map',
] as const;
export type MaterialIconCode = typeof icons[number];
/**
* Represents a type that corresponds to a material icon code.
*/
export type MaterialIconCode = (typeof icons)[number];

View File

@@ -1,4 +1,5 @@
import React from 'react';
import Text from '../Text/Text';
interface Props {
@@ -10,31 +11,35 @@ interface Props {
* A maybe reusable InfoCard component that follows the design system of the extension.
* @returns
*/
export function InfoCard({
titleText,
bodyText
}: React.PropsWithChildren<Props>): JSX.Element {
export function InfoCard({ titleText, bodyText }: React.PropsWithChildren<Props>): JSX.Element {
return (
<div
className = 'w-50 flex flex-col items-start justify-center border rounded p-4'
style = {{
border: "1px solid #D6D2C4",
background: "#FFF" // White
}}>
<div className="flex flex-col items-start self-stretch gap-1.5">
<Text variant = "h4" as = 'span'
style = {{
color: '#F8971F', // Orange
}}>
{titleText}
</Text>
<Text variant = "small" as = 'span'
style = {{
color: '#333F48', // Black
}}>
{bodyText}
</Text>
</ div>
className='w-50 flex flex-col items-start justify-center border rounded p-4'
style={{
border: '1px solid #D6D2C4',
background: '#FFF', // White
}}
>
<div className='flex flex-col items-start self-stretch gap-1.5'>
<Text
variant='h4'
as='span'
style={{
color: '#F8971F', // Orange
}}
>
{titleText}
</Text>
<Text
variant='small'
as='span'
style={{
color: '#333F48', // Black
}}
>
{bodyText}
</Text>
</div>
</div>
);
}

View File

@@ -1,7 +1,10 @@
import { background } from '@shared/messages';
import clsx from 'clsx';
import React, { PropsWithChildren } from 'react';
import Text, { TextProps } from '../Text/Text';
import type { PropsWithChildren } from 'react';
import React from 'react';
import type { TextProps } from '../Text/Text';
import Text from '../Text/Text';
import styles from './Link.module.scss';
type Props = Omit<TextProps, 'span'> & {

View File

@@ -1,5 +1,6 @@
import { DragDropContext, Draggable, Droppable } from '@hello-pangea/dnd';
import React, { ReactElement, useCallback, useState } from 'react';
import type { ReactElement } from 'react';
import React, { useCallback, useState } from 'react';
import { areEqual } from 'react-window';
/*

View File

@@ -1,5 +1,7 @@
import clsx from 'clsx';
import React, { PropsWithChildren, useCallback } from 'react';
import type { PropsWithChildren } from 'react';
import React, { useCallback } from 'react';
import styles from './Popup.module.scss';
interface Props {
@@ -19,8 +21,6 @@ export default function Popup({ onClose, children, className, style, testId, ove
const containerRef = React.useRef<HTMLDivElement>(null);
const bodyRef = React.useRef<HTMLDivElement>(null);
const handleClickOutside = useCallback(
(event: MouseEvent) => {
if (!bodyRef.current) return;

View File

@@ -1,9 +1,13 @@
import { Course, Status } from '@shared/types/Course';
import { CourseColors, pickFontColor } from '@shared/util/colors';
import type { Course } from '@shared/types/Course';
import { Status } from '@shared/types/Course';
import type { CourseColors } from '@shared/util/colors';
import { pickFontColor } from '@shared/util/colors';
import { StatusIcon } from '@shared/util/icons';
import clsx from 'clsx';
import React from 'react';
import DragIndicatorIcon from '~icons/material-symbols/drag-indicator';
import Text from '../Text/Text';
/**

View File

@@ -1,8 +1,12 @@
import Text from '@views/components/common/Text/Text';
import clsx from 'clsx';
import React from 'react';
import DragIndicatorIcon from '~icons/material-symbols/drag-indicator';
import Text from '../Text/Text';
import DragIndicatorIcon from '~icons/material-symbols/drag-indicator';
/**
* Props for the ScheduleListItem component.
*/
export type Props = {
style?: React.CSSProperties;
active?: boolean;
@@ -18,11 +22,11 @@ export default function ScheduleListItem(props: Props) {
console.log(props);
return (
<div style={{ ...props.style }} className='items-center'>
<li className='text-ut-burntorange w-100% flex cursor-pointer items-center self-stretch justify-left'>
<li className='w-100% flex cursor-pointer items-center self-stretch justify-left text-ut-burntorange'>
<div className='group flex justify-center'>
<div
<div
className='flex cursor-move items-center self-stretch rounded rounded-r-0'
{...dragHandleProps}
{...dragHandleProps}
>
<DragIndicatorIcon className='h-6 w-6 cursor-move text-zinc-300 btn-transition -ml-1.5 hover:text-zinc-400' />
</div>

View File

@@ -1,4 +1,5 @@
import React from 'react';
import Text from '../Text/Text';
/**
@@ -21,7 +22,7 @@ export default function ScheduleTotalHoursAndCourses({
totalCourses,
}: ScheduleTotalHoursAndCoursesProps): JSX.Element {
return (
<div className='min-w-64 flex whitespace-nowrap content-center items-baseline gap-2 uppercase'>
<div className='min-w-64 flex content-center items-baseline gap-2 whitespace-nowrap uppercase'>
<Text className='text-[#BF5700]' variant='h1' as='span'>
{`${scheduleName}: `}
</Text>

View File

@@ -1,5 +1,6 @@
import clsx from 'clsx';
import React from 'react';
import styles from './Spinner.module.scss';
type Props = {

View File

@@ -1,5 +1,7 @@
import clsx from 'clsx';
import React, { PropsWithChildren } from 'react';
import type { PropsWithChildren } from 'react';
import React from 'react';
import styles from './Text.module.scss';
/**