From 49ebf99a837f03ed6799a079be879980d0b2fab1 Mon Sep 17 00:00:00 2001 From: jorg-vr Date: Mon, 19 Sep 2022 16:23:35 +0200 Subject: [PATCH 01/13] Create search institution component for sign in --- .../javascripts/components/datalist_input.ts | 2 +- .../components/sign_in_search_bar.ts | 48 +++++++++++++++++++ app/assets/javascripts/i18n/translations.json | 8 ++++ app/javascript/packs/sign_in.js | 2 +- app/views/auth/sign_in.html.erb | 4 ++ config/locales/js/en.yml | 4 ++ config/locales/js/nl.yml | 3 ++ 7 files changed, 69 insertions(+), 2 deletions(-) create mode 100644 app/assets/javascripts/components/sign_in_search_bar.ts diff --git a/app/assets/javascripts/components/datalist_input.ts b/app/assets/javascripts/components/datalist_input.ts index 08e250edb6..603bea53f1 100644 --- a/app/assets/javascripts/components/datalist_input.ts +++ b/app/assets/javascripts/components/datalist_input.ts @@ -4,7 +4,7 @@ import { ShadowlessLitElement } from "components/shadowless_lit_element"; import { ref, Ref, createRef } from "lit/directives/ref.js"; import { watchMixin } from "components/watch_mixin"; -type Option = {label: string, value: string, extra?: string}; +export type Option = {label: string, value: string, extra?: string}; /** * This component represents an input field with a datalist with possible options for the input. diff --git a/app/assets/javascripts/components/sign_in_search_bar.ts b/app/assets/javascripts/components/sign_in_search_bar.ts new file mode 100644 index 0000000000..78b080a030 --- /dev/null +++ b/app/assets/javascripts/components/sign_in_search_bar.ts @@ -0,0 +1,48 @@ +import { customElement, property } from "lit/decorators.js"; +import { html, TemplateResult } from "lit"; +import { ShadowlessLitElement } from "components/shadowless_lit_element"; +import { Option } from "components/datalist_input"; + +/** + * @element d-sign-in-search-bar + * + * @prop {{name: string, provider: string}[]} Institutions + * @prop {Record} Providers + */ +@customElement("d-sign-in-search-bar") +export class SignInSearchBar extends ShadowlessLitElement { + @property({ type: Array }) + institutions: {name: string, provider: string}[]; + @property({ type: Object }) + providers: Record; + + @property({ state: true }) + selected_provider: string; + + get link(): string { + return this.selected_provider !== undefined ? this.providers[this.selected_provider].link : ""; + } + + get options(): Option[] { + return this.institutions.map(i => ({ label: i.name, value: i.provider, extra: this.providers[i.provider].name })); + } + + handleInput(e: CustomEvent): void { + this.selected_provider = e.detail.value; + } + + render(): TemplateResult { + return html` + this.handleInput(e)} + placeholder="${I18n.t("js.sign_in_search_bar.institution_search")}" + > + + `; + } +} diff --git a/app/assets/javascripts/i18n/translations.json b/app/assets/javascripts/i18n/translations.json index 09c492fc5b..24299b6909 100644 --- a/app/assets/javascripts/i18n/translations.json +++ b/app/assets/javascripts/i18n/translations.json @@ -305,6 +305,10 @@ "score_item": { "error": "Error while updating" }, + "sign_in_search_bar": { + "institution_search": "Type to search for your institution", + "log_in": "Sign in" + }, "stacked_desc": "This graph shows the distribution of submissions statuses.", "stacked_title": "Distribution of submission statuses", "status": { @@ -734,6 +738,10 @@ "score_item": { "error": "Fout bij bijwerken" }, + "sign_in_search_bar": { + "institution_search": "Typ om jouw school te vinden", + "log_in": "Aanmelden" + }, "stacked_desc": "Deze grafiek geeft de verdeling van de oplossingsstatussen per oefening weer.", "stacked_title": "Verdeling van de oplossingsstatus", "status": { diff --git a/app/javascript/packs/sign_in.js b/app/javascript/packs/sign_in.js index 3192b9b0a9..224e99ca22 100644 --- a/app/javascript/packs/sign_in.js +++ b/app/javascript/packs/sign_in.js @@ -1,3 +1,3 @@ import { initInstitutionAutoSelect } from "../../assets/javascripts/sign_in.js"; - +import "components/sign_in_search_bar"; window.dodona.initInstitutionAutoSelect = initInstitutionAutoSelect; diff --git a/app/views/auth/sign_in.html.erb b/app/views/auth/sign_in.html.erb index 2f5be7e068..10c1724c62 100644 --- a/app/views/auth/sign_in.html.erb +++ b/app/views/auth/sign_in.html.erb @@ -59,6 +59,10 @@ + - diff --git a/config/locales/views/auth/en.yml b/config/locales/views/auth/en.yml index 751fe43415..2c083e1708 100644 --- a/config/locales/views/auth/en.yml +++ b/config/locales/views/auth/en.yml @@ -5,7 +5,6 @@ en: sign_in: "Sign in" sign-in-with: "Sign in with %{provider}" sign-in-help: "Don't know which login you can use? Search for your school and click the sign in button:" - institution-search: "Type to search for your institution" ilearn-help: "Users of i-Learn can currently only sign in through the i-Learn website." higher-education: "Higher education" other-education: "Other educational institutions" diff --git a/config/locales/views/auth/nl.yml b/config/locales/views/auth/nl.yml index d106dc7967..e7648c7eef 100644 --- a/config/locales/views/auth/nl.yml +++ b/config/locales/views/auth/nl.yml @@ -5,7 +5,6 @@ nl: sign_in: "Aanmelden" sign-in-with: "Inloggen met %{provider}" sign-in-help: "Weet je niet welke login je moet gebruiken? Zoek hieronder je school en klik op aanmelden:" - institution-search: "Typ om jouw school te vinden" ilearn-help: "i-Learn gebruikers kunnen momenteel enkel inloggen via de i-Learn website." higher-education: "Hoger onderwijs" other-education: "Andere onderwijsinstellingen" diff --git a/db/seeds.rb b/db/seeds.rb index 42e995bd0f..4028a9d1ae 100644 --- a/db/seeds.rb +++ b/db/seeds.rb @@ -75,6 +75,17 @@ def fill_series_with_realistic_submissions(s) puts "Creating providers (#{Time.now - start})" + 100.times do + i = Institution.create name: Faker::Company.name , short_name: 'sbhg', logo: 'sbhg.jpeg', generated_name: false + if Random.rand < 0.3333 + Provider::Office365.create institution: i, identifier: Faker::Internet.ip_v6_address + elsif Random.rand < 0.5 + Provider::Smartschool.create institution: i, identifier: Faker::Internet.url + else + Provider::GSuite.create institution: i, identifier: Faker::Internet.ip_v6_address + end + end + # Office 365. Provider::Office365.create institution: artevelde, identifier: 'b6e080ea-adb9-4c79-9303-6dcf826fb854' Provider::Office365.create institution: sg_paulus, identifier: 'af15916d-7d77-43f9-b366-ae98d0fe36be' From bf88c8cfb7ec62b2b5e66d5b018abc0f2771e03d Mon Sep 17 00:00:00 2001 From: jorg-vr Date: Tue, 20 Sep 2022 14:13:48 +0200 Subject: [PATCH 05/13] Don't store more then reused --- app/assets/javascripts/components/sign_in_search_bar.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/components/sign_in_search_bar.ts b/app/assets/javascripts/components/sign_in_search_bar.ts index 007fabcdd8..e12e1c51b2 100644 --- a/app/assets/javascripts/components/sign_in_search_bar.ts +++ b/app/assets/javascripts/components/sign_in_search_bar.ts @@ -48,7 +48,7 @@ export class SignInSearchBar extends ShadowlessLitElement { handleInput(e: CustomEvent): void { this.selected_provider = e.detail.value; if (e.detail.value) { - localStorage.setItem("institution", JSON.stringify({ name: e.detail.label, type: e.detail.value })); + localStorage.setItem("institution", JSON.stringify({ name: e.detail.label })); } else { localStorage.removeItem("institution"); } From 85884c70d7f28e5d14aa087d6e386f4220b37ef1 Mon Sep 17 00:00:00 2001 From: jorg-vr Date: Tue, 20 Sep 2022 14:14:17 +0200 Subject: [PATCH 06/13] Fix indent --- .../javascripts/components/sign_in_search_bar.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/app/assets/javascripts/components/sign_in_search_bar.ts b/app/assets/javascripts/components/sign_in_search_bar.ts index e12e1c51b2..c2184fc7d0 100644 --- a/app/assets/javascripts/components/sign_in_search_bar.ts +++ b/app/assets/javascripts/components/sign_in_search_bar.ts @@ -57,12 +57,12 @@ export class SignInSearchBar extends ShadowlessLitElement { render(): TemplateResult { return html`
- this.handleInput(e)} - placeholder="${I18n.t("js.sign_in_search_bar.institution_search")}" - > + this.handleInput(e)} + placeholder="${I18n.t("js.sign_in_search_bar.institution_search")}" + >