Make the Class list publicly available, add Class Feed page

apiserver/apiserver/api/views.py

@@ -230,7 +230,7 @@ class CardViewSet(Base, Create, Retrieve, Update, Destroy):
 
 
 class CourseViewSet(Base, List, Retrieve, Create, Update):
-    permission_classes = [AllowMetadata | IsAuthenticated, IsAdminOrReadOnly | IsInstructorOrReadOnly]
+    permission_classes = [AllowMetadata | IsAuthenticatedOrReadOnly, IsAdminOrReadOnly | IsInstructorOrReadOnly]
     queryset = models.Course.objects.annotate(date=Max('sessions__datetime')).order_by('-date')
 
     def get_serializer_class(self):
@@ -241,7 +241,7 @@ class CourseViewSet(Base, List, Retrieve, Create, Update):
 
 
 class SessionViewSet(Base, List, Retrieve, Create, Update):
-    permission_classes = [AllowMetadata | IsAuthenticated, IsAdminOrReadOnly | IsInstructorOrReadOnly]
+    permission_classes = [AllowMetadata | IsAuthenticatedOrReadOnly, IsAdminOrReadOnly | IsInstructorOrReadOnly]
 
     def get_queryset(self):
         if self.action == 'list':

webclient/src/App.js

@@ -18,7 +18,7 @@ import { Admin } from './Admin.js';
 import { Paste } from './Paste.js';
 import { Sign } from './Sign.js';
 import { Courses, CourseDetail } from './Courses.js';
-import { Classes, ClassDetail } from './Classes.js';
+import { ClassFeed, Classes, ClassDetail } from './Classes.js';
 import { Members, MemberDetail } from './Members.js';
 import { Charts } from './Charts.js';
 import { Auth } from './Auth.js';
@@ -112,6 +112,12 @@ function App() {
 			<div className='content-wrap'>
 			<div className='content-wrap-inside'>
 
+			<Switch>
+				<Route exact path='/classfeed'>
+					<ClassFeed />
+				</Route>
+
+				<Route path='/'>
 					<Container>
 						<div className='hero'>
 							<Link to='/'>
@@ -243,6 +249,10 @@ function App() {
 								<Subscribe />
 							</Route>
 
+							<Route exact path='/classes'>
+								<Classes token={token} />
+							</Route>
+
 							{user && user.member.set_details ?
 								<Switch>
 									<Route path='/account'>
@@ -271,6 +281,7 @@ function App() {
 									<Route path='/courses/:id'>
 										<CourseDetail token={token} user={user} />
 									</Route>
+
 									<Route path='/courses'>
 										<Courses token={token} user={user} />
 									</Route>
@@ -278,9 +289,6 @@ function App() {
 									<Route path='/classes/:id'>
 										<ClassDetail token={token} user={user} refreshUser={refreshUser} />
 									</Route>
-							<Route path='/classes'>
-								<Classes token={token} />
-							</Route>
 
 									<Route path='/members/:id'>
 										<MemberDetail token={token} user={user} />
@@ -312,6 +320,8 @@ function App() {
 							}
 						</Switch>
 					</div>
+				</Route>
+			</Switch>
 
 			</div>
 			</div>

webclient/src/Classes.js

@@ -50,6 +50,43 @@ function ClassTable(props) {
 
 let classesCache = false;
 
+export function ClassFeed(props) {
+	const [classes, setClasses] = useState(classesCache);
+
+	useEffect(() => {
+		const get = async() => {
+			requester('/sessions/', 'GET', '')
+			.then(res => {
+				setClasses(res.results);
+				classesCache = res.results;
+			})
+			.catch(err => {
+				console.log(err);
+			});
+		};
+
+		get();
+		const interval = setInterval(get, 60000);
+		return () => clearInterval(interval);
+	}, []);
+
+	const now = new Date().toISOString();
+
+	return (
+		<Container>
+			<p/>
+
+			<Header size='large'>Upcoming Protospace Classes</Header>
+
+			{classes ?
+				<ClassTable classes={classes.filter(x => x.datetime > now).sort((a, b) => a.datetime > b.datetime ? 1 : -1)} />
+			:
+				<p>Loading...</p>
+			}
+		</Container>
+	);
+};
+
 export function Classes(props) {
 	const [classes, setClasses] = useState(classesCache);
 	const { token } = props;