Create assignment screen with navigation

src/app/AuthenticatedApp.js

@@ -10,6 +10,7 @@ import Calendar from '../screens/Calendar';
 import useLayoutType from '../hooks/useLayoutType';
 import Toolbar from '../components/Toolbar';
 import Classroom from '../screens/Classroom';
+import Assignment from '../screens/Assignment';
 
 import { avatarMenuOptions, menuOptions } from './data';
 
@@ -47,6 +48,9 @@ function AuthenticatedApp() {
             <Route path="/class">
               <Route path=":id" element={<Classroom />} />
             </Route>
+            <Route path="/assignment">
+              <Route path=":id/" element={<Assignment />} />
+            </Route>
             <Route path="/login" element={<Navigate to="/home" />} />
             <Route path="/" element={<Navigate to="/home" />} />
           </Routes>

src/screens/Assignment/index.js

@@ -0,0 +1,9 @@
+import { useParams } from 'react-router-dom';
+
+function Assignment() {
+  const params = useParams();
+
+  return <h1>Assignment id: {params.id}</h1>;
+}
+
+export default Assignment;

src/screens/Classroom/AnnouncementsTab/index.js

@@ -76,7 +76,11 @@ function AnnouncementsTab({ layoutType, announcementsTabData }) {
               <Stack justifyContent="flex-start" spacing={1}>
                 <h3 style={{ fontWeight: 500 }}>Próximas Atividades</h3>
                 {announcementsTabData.upcomingAssignments.map(ua => (
-                  <Link sx={{ fontSize: '15px' }} key={ua.id}>
+                  <Link
+                    href={`/assignment/${ua.id}`}
+                    sx={{ fontSize: '15px' }}
+                    key={ua.id}
+                  >
                     {ua.title}
                   </Link>
                 ))}
@@ -173,7 +177,11 @@ function AnnouncementsTab({ layoutType, announcementsTabData }) {
             <Stack justifyContent="flex-start" spacing={1}>
               <h3 style={{ fontWeight: 500 }}>Próximas Atividades</h3>
               {announcementsTabData.upcomingAssignments.map(ua => (
-                <Link sx={{ fontSize: '15px' }} key={ua.id}>
+                <Link
+                  href={`/assignment/${ua.id}`}
+                  sx={{ fontSize: '15px' }}
+                  key={ua.id}
+                >
                   {ua.title}
                 </Link>
               ))}