Re-implements LTI-restricted logins

fuel/app/classes/controller/users.php

@@ -66,7 +66,15 @@ public function get_login()
 			->set('page_type', 'login');
 
 		Css::push_group(['login']);
-		Js::push_group(['react', 'login']);
+
+		if (\Config::get('auth.restrict_logins_to_lti_single_sign_on', false) && ! $direct_login)
+		{
+			Js::push_group(['react', 'restricted']);
+		}
+		else
+		{
+			Js::push_group(['react', 'login']);
+		}
 	}
 
 	public function post_login()

fuel/app/classes/controller/widgets.php

@@ -454,7 +454,15 @@ protected function build_widget_login($login_title = null, $inst_id = null, $is_
 					->set('page_type', 'login');
 
 				Css::push_group(['login']);
-				Js::push_group(['react', 'login']);
+
+				if (\Config::get('auth.restrict_logins_to_lti_single_sign_on', false))
+				{
+					Js::push_group(['react', 'restricted']);
+				}
+				else
+				{
+					Js::push_group(['react', 'login']);
+				}
 			}
 
 			Js::push_inline('var EMBEDDED = '.($is_embedded ? 'true' : 'false').';');

fuel/app/config/js.php

@@ -26,6 +26,7 @@
 		'no_permission' => [$webpack.'js/no-permission.js'],
 		'closed'     => [$webpack.'js/closed.js'],
 		'embedded_only' => [$webpack.'js/embedded-only.js'],
+		'restricted' => [$webpack.'js/logins-restricted.js'],
 		'pre_embed'  => [$webpack.'js/pre-embed-placeholder.js'],
 		'help'       => [$webpack.'js/help.js'],
 		'404'        => [$webpack.'js/404.js'],

fuel/packages/ltiauth/classes/auth/login/ltiauth.php

@@ -6,9 +6,9 @@ class Auth_Login_LtiAuth extends Auth_Login_Materiaauth
 {
 	static public function restrict_logins($bypass=false)
 	{
-		// allow admin logins or do nothing if normal logins aren't restricted
-		if ($bypass || ! \Config::get('auth.restrict_logins_to_lti_single_sign_on', true)) return;
-
-		throw new \HttpNotFoundException();
+		// this method can be extended to limit logins
+		// the prior restrict_logins_to_lti_single_sign_on configuration check that was present here has been moved:
+		// the user and widget controllers perform the config check and serve different js based on whether the condition is met.
+		return;
 	}
 }

src/components/logins-restricted-to-lms.jsx

@@ -0,0 +1,48 @@
+import React, { useState, useEffect } from 'react';
+import Header from './header'
+import Summary from './widget-summary'
+import EmbedFooter from './widget-embed-footer';
+
+const LoginsRestrictedToLMS = () => {
+
+	const [state, setState] = useState({
+		context: ''
+	})
+
+	const waitForWindow = async () => {
+		while (!window.hasOwnProperty('CONTEXT')) {
+			await new Promise(resolve => setTimeout(resolve, 500))
+		}
+	}
+
+	useEffect(() => {
+		waitForWindow()
+		.then(() => {
+			setState({
+				context: window.CONTEXT,
+				is_embedded: window.EMBEDDED != undefined ? window.EMBEDDED : false,
+			})
+		})
+	},[])
+
+	return (
+		<>
+			{ state.is_embedded ? '' : <Header /> }
+			<div className="container widget">
+				<section className="page">
+					<Summary/>
+
+					<div className="detail icon-offset">
+						<h2 className="unavailable-text">Login from your LMS</h2>
+						<span className="unavailable-subtext">You must access Materia from a course in your LMS.</span>
+						{ state.context && state.context != 'widget' ? <p>For additional help and support, visit our <a href="/help#students">support page</a>.</p> : '' }
+					</div>
+
+					{ state.context && state.context == 'widget' ?  <EmbedFooter/> : '' }
+				</section>
+			</div>
+		</>
+	)
+}
+
+export default LoginsRestrictedToLMS

src/components/pre-embed-common-styles.scss

@@ -109,7 +109,7 @@ body {
 			.unavailable-subtext {
 				margin-bottom: 40px;
 				font-size: 0.8em;
-				font-size: 600;
+				font-weight: 700;
 			}
 		}
 

src/logins-restricted.js

@@ -0,0 +1,13 @@
+import React from 'react'
+import {createRoot} from 'react-dom/client'
+import { QueryClient, QueryClientProvider, QueryCache } from 'react-query'
+import LoginsRestrictedToLMS from './components/logins-restricted-to-lms'
+
+const queryCache = new QueryCache()
+export const queryClient = new QueryClient({ queryCache })
+
+const root = createRoot(document.getElementById('app'));
+root.render(
+	<QueryClientProvider client={queryClient} contextSharing={true}>
+		<LoginsRestrictedToLMS />
+	</QueryClientProvider>  )