From 2f67db3ae4a5be440a43fa257210b3bdd9351485 Mon Sep 17 00:00:00 2001
From: twells46 <173561638+twells46@users.noreply.github.com>
Date: Wed, 14 Jan 2026 22:19:25 -0600
Subject: [PATCH] Fix the react-future warnings and styletron warnings

---
 src/components/Dialog/SettingsDialog.tsx           | 4 ++--
 src/components/documentation/EnumerationBrief.tsx  | 4 ++--
 src/components/documentation/FileBrief.tsx         | 4 ++--
 src/components/documentation/ModuleBrief.tsx       | 4 ++--
 src/components/documentation/RootDocumentation.tsx | 4 ++--
 src/components/documentation/StructureBrief.tsx    | 4 ++--
 src/index.tsx                                      | 2 +-
 src/lms/AssignmentsView.tsx                        | 2 +-
 src/lms/plugin/BriefAssignmentsView.tsx            | 2 +-
 9 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/Dialog/SettingsDialog.tsx b/src/components/Dialog/SettingsDialog.tsx
index ef6fed29a..d168ad931 100644
--- a/src/components/Dialog/SettingsDialog.tsx
+++ b/src/components/Dialog/SettingsDialog.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { styled } from 'styletron-react';
+import { styled, withStyleDeep } from 'styletron-react';
 import { Settings } from '../constants/Settings';
 import { StyleProps } from '../../util/style';
 import { Dialog } from './Dialog';
@@ -81,7 +81,7 @@ const SettingInfoText = styled('span', {
   userSelect: 'none',
 });
 
-const SettingInfoSubtext = styled(SettingInfoText, {
+const SettingInfoSubtext = withStyleDeep(SettingInfoText, {
   fontSize: '10pt',
 });
 
diff --git a/src/components/documentation/EnumerationBrief.tsx b/src/components/documentation/EnumerationBrief.tsx
index e449d26c4..0a929cb88 100644
--- a/src/components/documentation/EnumerationBrief.tsx
+++ b/src/components/documentation/EnumerationBrief.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { styled } from 'styletron-react';
+import { withStyleDeep } from 'styletron-react';
 
 import EnumerationDocumentation from '../../state/State/Documentation/EnumerationDocumentation';
 import { StyleProps } from '../../util/style';
@@ -15,7 +15,7 @@ export interface EnumerationBriefProps extends StyleProps, ThemeProps {
 
 type Props = EnumerationBriefProps;
 
-const StyledEnumerationName = styled(FileName, ({ theme }: ThemeProps) => ({
+const StyledEnumerationName = withStyleDeep(FileName, ({ theme }: ThemeProps) => ({
   display: 'block',
   marginBottom: `${theme.itemPadding}px`,
   ':last-child': {
diff --git a/src/components/documentation/FileBrief.tsx b/src/components/documentation/FileBrief.tsx
index eb5f36888..968540194 100644
--- a/src/components/documentation/FileBrief.tsx
+++ b/src/components/documentation/FileBrief.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { styled } from 'styletron-react';
+import { withStyleDeep } from 'styletron-react';
 
 import FileDocumentation from '../../state/State/Documentation/FileDocumentation';
 import { StyleProps } from '../../util/style';
@@ -14,7 +14,7 @@ export interface FileBriefProps extends StyleProps, ThemeProps {
 
 type Props = FileBriefProps;
 
-const StyledFileName = styled(FileName, ({ theme }: ThemeProps) => ({
+const StyledFileName = withStyleDeep(FileName, ({ theme }: ThemeProps) => ({
   display: 'block',
   marginBottom: `${theme.itemPadding}px`,
   ':last-child': {
diff --git a/src/components/documentation/ModuleBrief.tsx b/src/components/documentation/ModuleBrief.tsx
index d5371bacc..51a4da951 100644
--- a/src/components/documentation/ModuleBrief.tsx
+++ b/src/components/documentation/ModuleBrief.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { styled } from 'styletron-react';
+import { withStyleDeep } from 'styletron-react';
 
 import ModuleDocumentation from '../../state/State/Documentation/ModuleDocumentation';
 import { StyleProps } from '../../util/style';
@@ -13,7 +13,7 @@ export interface FileBriefProps extends StyleProps, ThemeProps {
 
 type Props = FileBriefProps;
 
-const StyledModuleName = styled(ModuleName, ({ theme }: ThemeProps) => ({
+const StyledModuleName = withStyleDeep(ModuleName, ({ theme }: ThemeProps) => ({
   display: 'block',
   marginBottom: `${theme.itemPadding}px`,
   ':last-child': {
diff --git a/src/components/documentation/RootDocumentation.tsx b/src/components/documentation/RootDocumentation.tsx
index 1daaee3ad..42f0e0986 100644
--- a/src/components/documentation/RootDocumentation.tsx
+++ b/src/components/documentation/RootDocumentation.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { styled } from 'styletron-react';
+import { styled, withStyleDeep } from 'styletron-react';
 import Dict from '../../util/objectOps/Dict';
 import Documentation from '../../state/State/Documentation';
 import DocumentationLocation from '../../state/State/Documentation/DocumentationLocation';
@@ -40,7 +40,7 @@ const Container = styled('div', {
   width: '100%',
 });
 
-const StyledInput = styled(Input, ({ theme }: ThemeProps) => ({
+const StyledInput = withStyleDeep(Input, ({ theme }: ThemeProps) => ({
   borderLeft: 'none',
   borderRight: 'none',
   borderTop: 'none',
diff --git a/src/components/documentation/StructureBrief.tsx b/src/components/documentation/StructureBrief.tsx
index da96599ad..f2a2f126d 100644
--- a/src/components/documentation/StructureBrief.tsx
+++ b/src/components/documentation/StructureBrief.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { styled } from 'styletron-react';
+import { withStyleDeep } from 'styletron-react';
 
 import StructureDocumentation from '../../state/State/Documentation/StructureDocumentation';
 import { StyleProps } from '../../util/style';
@@ -15,7 +15,7 @@ export interface StructureBriefProps extends StyleProps, ThemeProps {
 
 type Props = StructureBriefProps;
 
-const StyledStructureName = styled(FileName, ({ theme }: ThemeProps) => ({
+const StyledStructureName = withStyleDeep(FileName, ({ theme }: ThemeProps) => ({
   display: 'block',
   marginBottom: `${theme.itemPadding}px`,
   ':last-child': {
diff --git a/src/index.tsx b/src/index.tsx
index 7a2844604..00d8e61a7 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -25,7 +25,7 @@ const root = createRoot(reactRoot);
 root.render(
   <StyletronProvider value={engine} debug={debug} debugAfterHydration>
     <ReduxProvider store={store}>
-      <BrowserRouter>
+      <BrowserRouter future={{ v7_relativeSplatPath: true, v7_startTransition: true }}>
         <App />
       </BrowserRouter>
     </ReduxProvider>
diff --git a/src/lms/AssignmentsView.tsx b/src/lms/AssignmentsView.tsx
index e9b610e3a..d7bd43b0d 100644
--- a/src/lms/AssignmentsView.tsx
+++ b/src/lms/AssignmentsView.tsx
@@ -53,7 +53,7 @@ const Container = styled('div', ({ $theme }: { $theme: Theme }) => ({
   padding: `${$theme.itemPadding * 2}px`,
 }));
 
-const Search = styled(Input, ({ theme }: ThemeProps) => ({
+const Search = withStyleDeep(Input, ({ theme }: ThemeProps) => ({
   width: '100%',
   marginBottom: `${theme.itemPadding * 2}px`,
 }));
diff --git a/src/lms/plugin/BriefAssignmentsView.tsx b/src/lms/plugin/BriefAssignmentsView.tsx
index 96874a80b..881230092 100644
--- a/src/lms/plugin/BriefAssignmentsView.tsx
+++ b/src/lms/plugin/BriefAssignmentsView.tsx
@@ -32,7 +32,7 @@ const Container = styled('div', ({ $theme }: { $theme: Theme }) => ({
   padding: `${$theme.itemPadding * 2}px`,
 }));
 
-const Search = styled(Input, ({ theme }: ThemeProps) => ({
+const Search = withStyleDeep(Input, ({ theme }: ThemeProps) => ({
   width: '100%',
   marginBottom: `${theme.itemPadding * 2}px`,
 }));