refactor: modify Network to use useContext for selected anvil

striker-ui/components/Anvils/AnvilList.tsx

@@ -1,3 +1,4 @@
+import { useContext } from 'react';
 import { makeStyles } from '@material-ui/core/styles';
 import { ClassNameMap } from '@material-ui/styles';
 import { List, Box, Divider, ListItem } from '@material-ui/core';
@@ -9,6 +10,8 @@ import {
   GREY,
 } from '../../lib/consts/DEFAULT_THEME';
 import Anvil from './Anvil';
+import { AnvilContext } from '../AnvilContext';
+import sortAnvils from './sortAnvils';
 
 const useStyles = makeStyles(() => ({
   root: {
@@ -60,15 +63,21 @@ const selectDecorator = (
 };
 
 const AnvilList = ({ list }: { list: AnvilListItem[] }): JSX.Element => {
+  const { setAnvilUuid } = useContext(AnvilContext);
   const classes = useStyles();
 
   return (
     <List component="nav" className={classes.root} aria-label="mailbox folders">
-      {list.map((anvil) => {
+      {sortAnvils(list).map((anvil) => {
         return (
           <>
             <Divider className={classes.divider} />
-            <ListItem button className={classes.button} key={anvil.anvil_uuid}>
+            <ListItem
+              button
+              className={classes.button}
+              key={anvil.anvil_uuid}
+              onClick={() => setAnvilUuid(anvil.anvil_uuid)}
+            >
               <Box display="flex" flexDirection="row" width="100%">
                 <Box p={1}>
                   <div