Scrapped canvas changes

.eslintrc.json

@@ -19,6 +19,7 @@
         "react/react-in-jsx-scope": "off",
         "react/display-name": "off",
         "@typescript-eslint/no-empty-function": "off",
+        "@typescript-eslint/no-empty-interface": "off",
         "@typescript-eslint/no-inferrable-types": [
             "error",
             {

package.json

@@ -10,6 +10,7 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
+    "@types/gatsbyjs__reach-router": "^2.0.3",
     "@types/node": "^18.7.8",
     "@types/react": "^18.0.17",
     "@types/react-dom": "^18.0.6",

src/app.js

@@ -2,7 +2,7 @@ import { useEffect } from 'react'
 import { LocationProvider, Router as ReachRouter, globalHistory, useLocation } from '@gatsbyjs/reach-router'
 import {
   EnvironmentProvider, ActivityProvider, AppProvider, InstanceProvider,
-  AnalyticsProvider, DestProvider, useEnvironment, useAnalytics, WorkspacesAPIProvider
+  AnalyticsProvider, DestProvider, useEnvironment, useAnalytics, WorkspacesAPIProvider, EduhelxProvider
 } from './contexts'
 import { Layout } from './components/layout'
 import { NotFoundView } from './views'
@@ -15,9 +15,11 @@ const ContextProviders = ({ children }) => {
           <WorkspacesAPIProvider>
             <AnalyticsProvider>
               <ActivityProvider>
-                <InstanceProvider>
-                  {children}
-                </InstanceProvider>
+                <EduhelxProvider>
+                  <InstanceProvider>
+                    {children}
+                  </InstanceProvider>
+                </EduhelxProvider>
               </ActivityProvider>
             </AnalyticsProvider>
           </WorkspacesAPIProvider>

src/components/layout/layout.js

@@ -73,7 +73,7 @@ export const Layout = ({ children }) => {
     route,
     ...getRouteAncestors(route)
   ])).map((route) => route.path)
-  console.log(menuRoutes, activeRoutes)
+
   return (
     <AntLayout className="layout">
       <Header className="helx-header" style={{ display: 'flex', zIndex: 1, width: '100%', background: '#fff' }}>

src/components/workspaces/app-card.js

@@ -10,7 +10,7 @@ import './app-card.css';
 const { Meta } = Card;
 
 // each app config value from localstorage will be validated here
-const validateLocalstorageValue = (config, app_id, min, max) => {
+export const validateLocalstorageValue = (config, app_id, min, max) => {
     let prev = localStorage.getItem(`${app_id}-${config}`);
     if (prev !== null && prev >= min && prev <= max) {
         return parseFloat(prev);

src/contexts/eduhelx-context.tsx

@@ -0,0 +1,84 @@
+/**
+ * Note: This has been designed specifically for the Spring 23 semester implementation, not for Eduhelx v2.
+ */
+
+import React, { ReactNode, createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react'
+import { Modal } from 'antd'
+import { useLocation } from '@gatsbyjs/reach-router'
+import { useWorkspacesAPI } from './'
+
+export const EDUHELX_ASSN_QS_PARAM = "eduassn"
+
+// interface IEduhelxAssignment {
+//     download: () => File[]
+// }
+
+
+export interface IEduhelxContext {
+}
+
+interface IEduhelxProvider {
+    children: ReactNode
+}
+
+export const EduhelxContext = createContext<IEduhelxContext|undefined>(undefined)
+
+export const EduhelxProvider = ({ children }: IEduhelxProvider) => {
+    return <EduhelxContext.Provider value={{}}>{ children }</EduhelxContext.Provider>
+    const [modalOpen, setModalOpen] = useState<boolean>(false)
+    const [confirmLoading, setConfirmLoading] = useState<boolean>(false)
+
+    const { api, loggedIn } = useWorkspacesAPI()!
+    const location = useLocation()
+
+    const eduhelxAssn = useMemo(() => {
+        const qs = new URLSearchParams(window.location.search)
+        const eduassn = qs.get(EDUHELX_ASSN_QS_PARAM)
+        return eduassn
+    }, [location])
+
+    const handleOk = useCallback(async () => {
+        setConfirmLoading(true)
+        await new Promise((r) => setTimeout(r, 2500))
+        setConfirmLoading(false)
+        setModalOpen(false)
+    }, [eduhelxAssn])
+
+    const handleCancel = useCallback(() => {
+        setModalOpen(false)
+    }, [])
+
+    /**
+     * States:
+     * 1) Not logged in: wait until logged in.
+     * 2) Logged in: `eduassn` not in QS, do nothing.
+     * 3) Else, `eduhelx` in QS: prompt student if they want work on it
+     * 4) Yes: launch Jupyter (if not already launched), then redirect to it with `eduassn` retained in QS. 
+     * 5) No: do nothing, but make sure the QS is retained when opening apps
+     */
+    useEffect(() => {
+        if (!loggedIn) return
+        if (!eduhelxAssn) return
+        setModalOpen(true)
+    }, [api, loggedIn, eduhelxAssn])
+
+    return (
+        <EduhelxContext.Provider value={{}}>
+            { children }
+            <Modal
+                title="Eduhelx Assignment"
+                open={ modalOpen }
+                confirmLoading={ confirmLoading }
+                onOk={ handleOk }
+                onCancel={ handleCancel }
+                okText="Yes"
+                cancelText="No"
+            >
+                We{`'`}ve noticed that you may be trying to work on an assignment.
+                Would you like to open Jupyter?
+            </Modal>
+        </EduhelxContext.Provider>
+    )
+}
+
+export const useEduhelxContext = () => useContext(EduhelxContext) 

src/contexts/index.js

@@ -5,3 +5,4 @@ export * from './activity-context'
 export * from './analytics-context'
 export * from './dest-context'
 export * from './workspaces-context'
+export * from './eduhelx-context'

src/contexts/workspaces-context/api.ts

@@ -12,6 +12,7 @@ import {
     IAPIError,
     Throws400,
     Throws403,
+    Throws404,
     SAMLRejectedError,
     SAMLActiveError,
     WhitelistRequiredError,
@@ -356,7 +357,8 @@ export class WorkspacesAPI implements IWorkspacesAPI {
         return res.data
     }
 
-    @APIRequest()
+    // This will throw a 404 if you try to get the readiness of a deleted/nonexistent app
+    @APIRequest(Throws404)
     async getAppReady(decodedURL: string, fetchOptions: AxiosRequestConfig={}): Promise<boolean> {
         const parts = decodedURL.split('/');
         const sid = (parts.length >= 2)?parts[parts.length - 2]:"";

src/contexts/workspaces-context/api.types.ts

@@ -38,6 +38,9 @@ export const Throws400: IAPIError = {
 export const Throws403: IAPIError = {
     status: 403
 }
+export const Throws404: IAPIError = {
+    status: 404
+}
 
 export class SocialSignupNotAuthorizedError extends ExtendableError {
     constructor() {

src/views/workspaces/active.js

@@ -3,7 +3,7 @@ import { Button, Col, Form, Input, Layout, Modal, Table, Typography, Slider, Spi
 import { DeleteOutlined, RightCircleOutlined, LoadingOutlined, CloseOutlined, ExclamationOutlined, QuestionOutlined } from '@ant-design/icons';
 import { NavigationTabGroup } from '../../components/workspaces/navigation-tab-group';
 import { openNotificationWithIcon } from '../../components/notifications';
-import { useActivity, useApp, useInstance, useAnalytics, useWorkspacesAPI } from '../../contexts';
+import { useActivity, useApp, useInstance, useAnalytics, useWorkspacesAPI, EDUHELX_ASSN_QS_PARAM } from '../../contexts';
 import { Breadcrumbs } from '../../components/layout'
 import TimeAgo from 'timeago-react';
 import { toBytes, bytesToMegabytes, formatBytes } from '../../utils/memory-converter';
@@ -134,8 +134,14 @@ export const ActiveView = withWorkspaceAuthentication(() => {
     }
 
     const connectInstance = (aid, sid, url, name) => {
+        const qs = new URLSearchParams(window.location.search)
+        const eduassn = qs.get(EDUHELX_ASSN_QS_PARAM)
         try {
             const urlObject = new URL(url);
+            if (eduassn) {
+                // Basically, include the eduassn query param in the launched app tab's query string as well.
+                urlObject.searchParams.set(EDUHELX_ASSN_QS_PARAM)
+            }
             const appUrl = `${window.location.origin}/helx/connect/${aid}/${encodeURIComponent(urlObject.pathname)}`;
             const connectTabRef = `${sid}-tab`;
             const connectTab = window.open(appUrl, connectTabRef);