Optional terms of use dialog for user #825

schuettloeffel-elsa · 2024-07-09T12:48:57Z

closes #296

When using the admin frontend for more than a few admins (e.g. lecturers that upload videos directly from the admin ui), there has to be a way to supply a terms of use form on first login. The displayed text should off course be configurable and the user would have to accept the terms to continue.

github-actions · 2024-07-09T12:50:17Z

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/opencast-admin-interface:pr-825

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/opencast-admin-interface:pr-825

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 · 2024-07-09T13:06:15Z

This pull request is deployed at test.admin-interface.opencast.org/825/2024-08-16_09-06-19/ .
It might take a few minutes for it to become available.

schuettloeffel-elsa · 2024-07-09T13:41:42Z

Backend PR: opencast/opencast#6010

mtneug · 2024-07-09T16:27:07Z

@schuettloeffel-elsa, thanks for this PR. Linking terms of use makes sense. However, I'm wondering, since we now have a couple of links in the footer, if it would be better to have a generic way of putting links there. Something like a configuration map containing the link name and URL. Opinions?

schuettloeffel-elsa · 2024-07-10T06:42:55Z

Linking terms of use makes sense. However, I'm wondering, since we now have a couple of links in the footer, if it would be better to have a generic way of putting links there. Something like a configuration map containing the link name and URL. Opinions?

I dont really get what you mean, this PR doesnt provide any links in the footer, it just displays the terms if a user hasnt already accepted them. Or am I missing something here?

mtneug · 2024-07-10T07:23:25Z

I dont really get what you mean, this PR doesnt provide any links in the footer, it just displays the terms if a user hasnt already accepted them. Or am I missing something here?

Oh, my bad! I somehow assumed that this would add a "Terms of Use" link in the footer of the Admin UI similar to #306.

schuettloeffel-elsa · 2024-07-10T07:54:02Z

No worries :)

lkiesow

I didn't do a full review. This is more just a few comments.

lkiesow · 2024-07-11T09:36:54Z

src/components/shared/TermsOfUseModal.tsx

+			const isAgreed = response.data.results.some(result => result.key === "agreedToTerms" && result.value === "true");
+			setAgreedToTerms(isAgreed);
+		  } catch (error) {
+			console.error("Fehler beim Abrufen der Daten:", error);


I assume this is a leftover from debugging?

Do you mean the console.error? Not really, but I can translate it to english if that helps

src/components/shared/TermsOfUseModal.tsx

lkiesow · 2024-07-11T10:03:37Z

src/components/shared/TermsOfUseModal.tsx

+			return `ui/config/admin-ui/terms.${language}.html`;
+		};
+
+		axios.get(getURL(i18n.language))


More out of curiosity, why include axios as an external library and not just use The Fetch API?

Dont know to be honest :D

lkiesow · 2024-07-11T10:07:53Z

src/components/shared/TermsOfUseModal.tsx

+						<div>
+							<div className="row">
+								<div className="scrollbox">
+									<div dangerouslySetInnerHTML={{ __html: DOMPurify.sanitize(termsContent) }} ></div>


Would it make sense to expect and render something like Markdown instead of giving users the freedom to use HTML but then modify it anyway to avoid possible threads?

Well you can still use normal html tags that would make sense in that case, DOMPurify.sanitize doenst remove usual html tags used for styling etc. Makes sense so me since terms of use will need some styling to maintain a good readability

lkiesow · 2024-07-11T12:56:21Z

One more request I forgot and which also applies to opencast/opencast#6010

It would be great if you could give your pull request a description of what the problem is, what you tried to achieve and if there is anything special about the way you fixed the problem. Even if you linked an issue, it's somewhat cumbersome for reviewers to always try to get information from somewhere else. Also, things can change, and you may get additional insights during the implementation. Definitely not the end of the world, but you will make reviewers happy.
The pull requests titles will become part of the changelog. So it's great if the title describes what's happening. And this is no longer a feature request ;-P

schuettloeffel-elsa · 2024-07-12T07:12:01Z

One more request I forgot and which also applies to opencast/opencast#6010

It would be great if you could give your pull request a description of what the problem is, what you tried to achieve and if there is anything special about the way you fixed the problem. Even if you linked an issue, it's somewhat cumbersome for reviewers to always try to get information from somewhere else. Also, things can change, and you may get additional insights during the implementation. Definitely not the end of the world, but you will make reviewers happy.

Sure! From other projects I know the workflow to just link to the issue (like I die here) and always retrieve the informations there, just to prevent doubled informations in the issue and PR. But if it helps I will give some informations in the PR as well in the future :)

The pull requests titles will become part of the changelog. So it's great if the title describes what's happening. And this is no longer a feature request ;-P

Haha, will do, thanks for editing

JulianKniephoff

Apart from the inline comments:

We should really try to not add any more ts-expect-error and eslint-disable comments.

It would be nice if you could include a screenshot, as well.

.gitignore

src/components/shared/TermsOfUseModal.tsx

JulianKniephoff · 2024-08-13T13:42:52Z

src/components/Header.tsx

@@ -284,6 +286,9 @@ const Header = ({
 				<RegistrationModal close={hideRegistrationModal} />
 			)}

+			{/* Terms of use */}
+			{displayTerms && <TermsOfUseModal />}


I kind of wonder what happens when both, the adopter registration modal and the terms modal are to be shown, and whether or not we are okay with that outcome ... 🤔

That should never happen, since you cant press any button (like the adopters registration) when the terms are displayed. Or is there some other way the registration is forced to the user besides of pressing the button?

Wait what button are you talking about? AFAIK no user interaction is necessary for the adopter registration prompt to pop up the first time you use the admin UI.

However, we discussed this in the technical meeting and came to the agreement that this is probably fine since that should only happen for actual system admins (ROLE_ADMIN and org-admins). Those on the other hand probably don't need to see the terms since they are the ones setting up the system!

So the suggestion was to just add a condition here to only show the terms to non-admins.

src/components/shared/TermsOfUseModal.tsx

JulianKniephoff · 2024-08-13T13:48:19Z

src/components/shared/TermsOfUseModal.tsx

+		  }
+		};
+
+		checkTerms();


Why even make this a function only to then call it immediately. Just lift the body of checkTerms into the useEffect body.

The function needs to be async, see: https://devtrium.com/posts/async-functions-useeffect

You can just make the useEffect-callback async, no?

JulianKniephoff · 2024-08-13T13:49:09Z

src/components/shared/TermsOfUseModal.tsx

+		const getURL = (language: string) => {
+			return `ui/config/admin-ui/terms.${language}.html`;
+		};


Could you make this a top level function? That way it is not recreated on every render.

No I mean really top-level, as in module-level, outside of the component.

JulianKniephoff

Another small thing.

Also here is a screenshot:

Note that it has a little extra white padding at the bottom that we should probably get rid of.

src/components/shared/TermsOfUseModal.tsx

JulianKniephoff · 2024-08-13T14:41:55Z

src/components/shared/TermsOfUseModal.tsx

+				setTermsContent(response.data);
+			})
+			.catch(error => {
+				axios.get(getURL(typeof i18n.options.fallbackLng === 'string' ? i18n.options.fallbackLng : 'en-US'))


In #306 you defaulted to en-GB. Any reason for this inconsistency? 🤔

Since lang-en_US.json seems to be the main language file i thought it would be better to default to en-US - in #306 i wasnt aware of that, so maybe better change it there to en-US too?

That sounds reasonable to me. 🤔

…bmit button

schuettloeffel-elsa · 2024-08-16T08:59:35Z

Note that it has a little extra white padding at the bottom that we should probably get rid of.

Done.

schuettloeffel-elsa added 5 commits April 23, 2024 09:23

initial terms of use

73596e2

next

7a6a15d

Merge remote-tracking branch 'origin/main' into 296-terms-of-use

cb568cf

next

4ea9ccf

added .vscode to gitignore

4a8c71d

schuettloeffel-elsa added 2 commits July 9, 2024 14:57

remove warnings

2005f13

fix some more issues

20a2a76

Arnei added the type:enhancement New feature or request label Jul 9, 2024

schuettloeffel-elsa mentioned this pull request Jul 9, 2024

Feature request: terms of use for new user opencast/opencast#6010

Open

lkiesow requested changes Jul 11, 2024

View reviewed changes

lkiesow changed the title ~~Feature request: terms of use for new user~~ Optional terms of use dialog for user Jul 11, 2024

JulianKniephoff requested changes Aug 13, 2024

View reviewed changes

src/components/shared/TermsOfUseModal.tsx Outdated Show resolved Hide resolved

JulianKniephoff reviewed Aug 13, 2024

View reviewed changes

schuettloeffel-elsa added 3 commits August 16, 2024 10:44

removed .vscode from gitignore

f6fae19

removed padding at bottom from overlay

6f20599

fixed various issues in TermsOfUseModal.tsx, added translation for su…

acaab2c

…bmit button

fixed some more issues with src/components/shared/TermsOfUseModal.tsx

dd13fa7

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Optional terms of use dialog for user #825

Optional terms of use dialog for user #825

schuettloeffel-elsa commented Jul 9, 2024 •

edited

Loading

github-actions bot commented Jul 9, 2024

github-actions bot commented Jul 9, 2024 •

edited

Loading

schuettloeffel-elsa commented Jul 9, 2024

mtneug commented Jul 9, 2024

schuettloeffel-elsa commented Jul 10, 2024

mtneug commented Jul 10, 2024

schuettloeffel-elsa commented Jul 10, 2024

lkiesow left a comment

lkiesow Jul 11, 2024

schuettloeffel-elsa Jul 12, 2024

lkiesow Jul 11, 2024

schuettloeffel-elsa Jul 12, 2024

lkiesow Jul 11, 2024

schuettloeffel-elsa Jul 12, 2024

lkiesow commented Jul 11, 2024

schuettloeffel-elsa commented Jul 12, 2024

JulianKniephoff left a comment

JulianKniephoff Aug 13, 2024

schuettloeffel-elsa Aug 16, 2024

JulianKniephoff Sep 5, 2024

JulianKniephoff Aug 13, 2024

schuettloeffel-elsa Aug 16, 2024

JulianKniephoff Sep 5, 2024

JulianKniephoff Aug 13, 2024

schuettloeffel-elsa Aug 16, 2024

JulianKniephoff Sep 5, 2024

JulianKniephoff left a comment

JulianKniephoff Aug 13, 2024

schuettloeffel-elsa Aug 16, 2024

JulianKniephoff Sep 5, 2024

schuettloeffel-elsa commented Aug 16, 2024

Optional terms of use dialog for user #825

Are you sure you want to change the base?

Optional terms of use dialog for user #825

Conversation

schuettloeffel-elsa commented Jul 9, 2024 • edited Loading

github-actions bot commented Jul 9, 2024

github-actions bot commented Jul 9, 2024 • edited Loading

schuettloeffel-elsa commented Jul 9, 2024

mtneug commented Jul 9, 2024

schuettloeffel-elsa commented Jul 10, 2024

mtneug commented Jul 10, 2024

schuettloeffel-elsa commented Jul 10, 2024

lkiesow left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

lkiesow commented Jul 11, 2024

schuettloeffel-elsa commented Jul 12, 2024

JulianKniephoff left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

JulianKniephoff left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

schuettloeffel-elsa commented Aug 16, 2024

schuettloeffel-elsa commented Jul 9, 2024 •

edited

Loading

github-actions bot commented Jul 9, 2024 •

edited

Loading