Show registration modal only when unregistered by gregorydlogan · Pull Request #1600 · opencast/admin-interface

gregorydlogan · 2026-05-04T05:28:34Z

This PR only shows the registraiton modal when the adopter has not already registered.

~~This PR contains a few extra bits that haven't been turned on yet - notably the warning bell stuff for when the core can't reach the registration server.~~

This PR now uses the bell if the user is not registered. Notably:
If you haven't registered at all:

If you have registered, but haven't agreed to the latest ToU:

Clicking on either of these notices opens the registration modal.

TODOs:

Make the new strings into translatable strings rather than hardcoding them.
In the case of an out of date ToU, uncheck the agreed-to-ToU checkbox when presenting the registration modal, and highlight what's wrong.
In the case of an out of date ToU, launch the registration modal to the input pane, not the general info pane.

Fixed #1516

…tances

github-actions · 2026-05-04T05:29:37Z

Use docker or podman to test this pull request locally.

Run test server using develop.opencast.org as backend:

podman run --rm -it -p 127.0.0.1:3000:3000 ghcr.io/opencast/admin-interface:pr-1600

Specify a different backend like stable.opencast.org:

podman run --rm -it -p 127.0.0.1:3000:3000 -e PROXY_TARGET=https://stable.opencast.org ghcr.io/opencast/admin-interface:pr-1600

It may take a few seconds for the interface to spin up.
It will then be available at http://127.0.0.1:3000.
For more options you can pass on to the proxy, take a look at the README.md.

github-actions · 2026-05-04T05:30:46Z

This pull request is deployed at test.admin-interface.opencast.org/1600/2026-05-11_21-10-31/ .
It might take a few minutes for it to become available.

Arnei · 2026-05-06T10:37:51Z

+	if (registration == null) {
+		dispatch(fetchRegistration());
+	}


This will dispatch a redux action (and thus a fetch request) every time the component rerenders and registration is still null. This could potentially cause multiple fetch requests. To avoid this, we usually use a useEffect that only runs once on component mount for fetch requests. (see the useEffect in e.g. SeriesDetails.tsx).

If you need to monitor the state of the action, you would usually add a variable to the redux state that tracks the action state (LOADING, SUCCEEDED, FAILED what have you). Then track the action state in your component via a selector and use a useEffect to respond properly.

And if you don't actually need all that redux boilerplate, you could also do the fetch requesting and state tracking here with useEffect and useState.

…in suboptimal cases

gregorydlogan · 2026-07-13T19:46:05Z

Now that the GHA issues are done, I made a final change and I think this is ready for re-review @Arnei

Arnei · 2026-07-14T06:55:42Z

+          .wide-text{
+            padding-right: 5px;
+          }


Suggested change

.wide-text{

padding-right: 5px;

}

.wide-text{

padding-right: 5px;

}

You're using 2 spaces, but the file uses 4.

Arnei · 2026-07-14T07:09:08Z

 	useEffect(() => {
-  			if (!user) { return; }
-
-  			const isAdmin = user.isAdmin || user.isOrgAdmin;
-	        const isLocalhost = window.location.hostname === "localhost";
-  			const lastDismissed = localStorage.getItem("adopterModalDismissed");
-  			const THIRTY_DAYS = 30 * 24 * 60 * 60 * 1000;
-  			const dismissedLongEnough = !lastDismissed || Date.now() - parseInt(lastDismissed) > THIRTY_DAYS;
-
-  			if (isAdmin && !isLocalhost && dismissedLongEnough) {
-  			  showRegistrationModal();
-  			}
-			}, [user]);
+		dispatch(fetchRegistration());
+		dispatch(fetchLatestToU());
+		dispatch(fetchIsUpToDate());
+
+		if (!user) { return; }
+
+		const isAdmin = user.isAdmin || user.isOrgAdmin;
+		const isLocalhost = window.location.hostname === "localhost";
+		const lastDismissed = localStorage.getItem("adopterModalDismissed");
+		const THIRTY_DAYS = 30 * 24 * 60 * 60 * 1000;
+		const dismissedLongEnough = !lastDismissed || Date.now() - parseInt(lastDismissed) > THIRTY_DAYS;
+
+		if (isAdmin && !isLocalhost && dismissedLongEnough && registration == null) {
+		  showRegistrationModal();
+		}
+	}, [user, registration, dispatch]);


This can cause an infinite loop. dispatch(fetchRegistration()); will eventually update registration, which triggers a rerun of the useEffect hook, which causes dispatch(fetchRegistration()); to be run again...

I recommend putting the dispatch(fetch....'s into their own useEffect hook that runs only once on mount. If you need to run them again, you should probably do so conditionally?

Arnei · 2026-07-14T07:30:22Z

 					)}
 				</li>
 			))}
+      {!registering &&


Not using tab indentation here

Arnei · 2026-07-14T07:32:49Z

+            onClick={() => showAdoptersRegistrationModal()}
+          >
+            <span className="wide-text">Registration</span>
+            <span className="multi-value multi-value-yellow">Unregistered</span>


multi-value-yellow does not seem to exist (maybe I removed it in my cleaning frenzy?).

Arnei · 2026-07-14T07:34:04Z

+          <ButtonLikeAnchor
+            onClick={() => showAdoptersRegistrationModal()}
+          >
+            <span className="wide-text">Registration</span>


Untranslated strings.

Arnei · 2026-07-14T07:38:27Z

@@ -0,0 +1,110 @@
+import { PayloadAction, createSlice } from "@reduxjs/toolkit";


Inconsistent use of spaces and tabs in this file.

Arnei · 2026-07-14T07:52:04Z

+	// These are used for thunks
+	extraReducers: builder => {
+		builder
+			/* .addCase(fetchRegistration.pending, state => {


Leftover code?

Arnei · 2026-07-14T07:54:11Z

+  error: boolean
+};
+
+type Temp = {


Temp is not a great type name ^^

Arnei · 2026-07-14T07:56:26Z

+export type RegistrationState = {
+  registration: Registration | null,
+  latestToU: string,
+  isRegistering: boolean,


I feel like isRegistering is a bit confusingly named? This is not about being in the process of registering, is it? Maybe canRegister would be clearer?

Arnei · 2026-07-14T07:59:17Z

+	name: "registration",
+	initialState,
+	reducers: {
+		setError(state, action: PayloadAction<{


I don't see setError nor error being used anywhere. Leftover code?

In theory this only opens the registration modal in the right circums…

48ae5a7

…tances

gregorydlogan added the type:bug Something isn't working label May 4, 2026

Arnei requested changes May 6, 2026

View reviewed changes

gregorydlogan added 5 commits May 7, 2026 15:46

Revert me for further work

c12f608

Removing summary, since it's not needed here

45f695b

Switching to useEffect, suggested in the review

92f70b3

Removing these since this part of the service does not care about this.

094d207

Modal now appears properly, and creates 'Registration' notifications …

298d1a8

…in suboptimal cases

gregorydlogan force-pushed the t/registration-modal branch from 75e3a11 to 298d1a8 Compare June 10, 2026 22:15

gregorydlogan added 2 commits July 13, 2026 11:16

Merge remote-tracking branch 'upstream/r/19.x' into t/registration-modal

6950c89

Combining useEffects

7bbefff

Arnei requested changes Jul 14, 2026

View reviewed changes

		@@ -0,0 +1,110 @@
		import { PayloadAction, createSlice } from "@reduxjs/toolkit";

Uh oh!

Conversation

gregorydlogan commented May 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented May 4, 2026

Uh oh!

github-actions Bot commented May 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

gregorydlogan commented Jul 13, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

gregorydlogan commented May 4, 2026 •

edited

Loading

github-actions Bot commented May 4, 2026 •

edited

Loading