-
Notifications
You must be signed in to change notification settings - Fork 6
React strict mode errors #1037
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: dev
Are you sure you want to change the base?
React strict mode errors #1037
Conversation
…hey are not valid attributes, a disabled child, naming issues
…ion so we dont get weird , 2025 options that never get rendered
…coders call usecontext once and pass it down
…ods instead of the old routes, route way, added future flag toggles
…rs only when u start typing in course sel
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
some small nitpicks but lgtm so far!
@@ -23,34 +22,49 @@ Sentry.init({ | |||
tracesSampleRate: Number(import.meta.env.VITE_APP_SENTRY_TRACE_RATE_CLIENT), | |||
}); | |||
|
|||
const Root: React.FC = () => { | |||
const hasVisited = localStorage.getItem('visited'); | |||
const hasVisited = localStorage.getItem('visited'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
indentation
</ApolloProvider> | ||
); | ||
}; | ||
const router = createBrowserRouter( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
indentation + 1
@@ -402,6 +402,25 @@ const CourseSelect: React.FC<CourseSelectProps> = ({ assignedColors, handleSelec | |||
const isMedium = useMediaQuery(theme.breakpoints.only('md')); | |||
const isTiny = useMediaQuery(theme.breakpoints.only('xs')); | |||
|
|||
// Each time we select a course, add that course to options | |||
// (removes MUI warning about course selected not being in options) | |||
const mergedOptions = React.useMemo(() => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nitpick:
const mergedOptions = useMemo(() => {
|
||
const decodedColors = colors.map((color) => { | ||
const decodedColor = useColorDecoder(color); | ||
const decodedColor = useColorDecoder(color, currentTheme); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
the second argument was optional. What was the error that needed this change?
const { key, ...rest } = props; | ||
return ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
was the issue here with the key not being assigned correctly?
<FormControl > | ||
<StyledInputLabel id="select-term-label">Select term</StyledInputLabel> | ||
<CustomStyledSelect | ||
size="small" | ||
labelId="select-term-label" | ||
id="select-term" | ||
label="Select term" | ||
open={open} | ||
onClose={handleClose} | ||
onOpen={handleOpen} | ||
value={termName != '' ? termName.concat(', ', term?.substring(2)) as string : ''} | ||
onChange={selectTerm} | ||
> | ||
{Array.from(termDataStrList).map((term, index) => { | ||
return ( | ||
<MenuItem key={index} value={term}> | ||
{term} | ||
</MenuItem> | ||
); | ||
})} | ||
</CustomStyledSelect> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
fix spacing 😛
@@ -32,13 +34,14 @@ interface ColorThemePreviewProps { | |||
export const ColorThemePreview = ({ previewTheme }: ColorThemePreviewProps) => { | |||
const decodedColors = Object.fromEntries( | |||
Object.entries(colors).map(([key, color]) => { | |||
const decodedColor = useColorDecoder(color, previewTheme); | |||
const { currentTheme } = useContext(AppContext); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
move this outside the map
@@ -33,15 +33,15 @@ const drawerWidth = 230; | |||
interface StyledDrawerProps { | |||
collapsed: boolean; | |||
isMobile: boolean; | |||
collapsedWidth: number; | |||
collapsedwidth: number; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
variable name convention is camelCase
@@ -49,9 +49,9 @@ const TimetableTabs: React.FC = () => { | |||
|
|||
const addTimetabletip = isMacOS ? 'New Tab (Cmd+Enter)' : 'New Tab (Ctrl+Enter)'; | |||
|
|||
const [tabTheme, setTabTheme] = useState<TabTheme>(isDarkMode ? tabThemeDark : tabThemeLight); | |||
const [tabtheme, setTabTheme] = useState<TabTheme>(isDarkMode ? tabThemeDark : tabThemeLight); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
naming convention
future: { | ||
v7_relativeSplatPath: true, | ||
}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this helps with future migration to v7 which is good. Curious what prompted you to add this in?
Description 🧾
Context of PR, summary of changes, as well as any relevant technical decisions/motivations.
Testing
Replace this line with instructions on how to test your changes, as well as any relevant images for UI changes.
Checklist
feature
: for application feature improvement or new featuresbug
: fixing something that previously wasn't workingdev
: development-side related changesdocker
: updates to the Docker codesetup
: changes to the setup/infrastructure of the codebasetest
: updates to internal testing