From d99c3ca4b8a001ca5b827edee6fdb235a24e4576 Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:44:06 -0300 Subject: [PATCH 1/7] Create README.md Creation of the README.md file with the description of the component, what it is for, how to use it, and an example --- .../Language Selector/README.md | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 Modern Development/Service Portal Widgets/Language Selector/README.md diff --git a/Modern Development/Service Portal Widgets/Language Selector/README.md b/Modern Development/Service Portal Widgets/Language Selector/README.md new file mode 100644 index 0000000000..7a2b385a54 --- /dev/null +++ b/Modern Development/Service Portal Widgets/Language Selector/README.md @@ -0,0 +1,24 @@ +# Language Selector with Flags + +A language selector widget for the Portal. +The user can change the instance language without having to leave the Portal. + +image +image + + +## What it does +- Displays a dropdown with flags and language names. +- Automatically updates the user's language in the `sys_user` table. +- Reloads the page to apply the new language immediately. + +## Files +- **HTML Template:** renders the dropdown with flag emojis and labels. +- **Client Script:** handles language selection and sends the PATCH request. +- **Server Script:** provides the current user ID and stored language. + +## Example +When the user selects **🇪🇸 Spanish**, the widget updates their user record and reloads the Portal in Spanish. + +## Prerequisites +- The language selected **must be installed and active** in the instance. From 31a73d851c8f112670fbe947e1fd7a61ac9b0793 Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:46:47 -0300 Subject: [PATCH 2/7] Create language-selector.html Added HTML template for dropdown with flags --- .../Language Selector/language-selector.html | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 Modern Development/Service Portal Widgets/Language Selector/language-selector.html diff --git a/Modern Development/Service Portal Widgets/Language Selector/language-selector.html b/Modern Development/Service Portal Widgets/Language Selector/language-selector.html new file mode 100644 index 0000000000..5e674246e6 --- /dev/null +++ b/Modern Development/Service Portal Widgets/Language Selector/language-selector.html @@ -0,0 +1,6 @@ +
+ +
From 0bdb5755af8bc05eb8e39a2e09e1f185b74655c9 Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:47:45 -0300 Subject: [PATCH 3/7] Create language-selector.css Added dropdown styling --- .../Language Selector/language-selector.css | 13 +++++++++++++ 1 file changed, 13 insertions(+) create mode 100644 Modern Development/Service Portal Widgets/Language Selector/language-selector.css diff --git a/Modern Development/Service Portal Widgets/Language Selector/language-selector.css b/Modern Development/Service Portal Widgets/Language Selector/language-selector.css new file mode 100644 index 0000000000..58d724c2f4 --- /dev/null +++ b/Modern Development/Service Portal Widgets/Language Selector/language-selector.css @@ -0,0 +1,13 @@ +.lang-selector { + display: flex; + align-items: center; + gap: 8px; +} +select, button { + padding: 6px 8px; + border-radius: 6px; + border: 1px solid #ccc; +} +button { + cursor: pointer; +} From 88a31c21297fc6a6d9fc0c4e4a392b24f6bfe39e Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:48:30 -0300 Subject: [PATCH 4/7] Create language-selector.js Added client script to update sys_user.language via REST API --- .../Language Selector/language-selector.js | 22 +++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 Modern Development/Service Portal Widgets/Language Selector/language-selector.js diff --git a/Modern Development/Service Portal Widgets/Language Selector/language-selector.js b/Modern Development/Service Portal Widgets/Language Selector/language-selector.js new file mode 100644 index 0000000000..44b3fd12ce --- /dev/null +++ b/Modern Development/Service Portal Widgets/Language Selector/language-selector.js @@ -0,0 +1,22 @@ +function($http) { + var c = this; + + c.languages = [ + { code: 'en', label: 'English', flag: '🇬🇧' }, + { code: 'pb', label: 'Portuguese (Brazil)', flag: '🇧🇷' }, + { code: 'es', label: 'Spanish', flag: '🇪🇸' }, + { code: 'fr', label: 'French', flag: '🇫🇷' }, + { code: 'de', label: 'German', flag: '🇩🇪' }, + { code: 'it', label: 'Italian', flag: '🇮🇹' } + ]; + + c.userId = c.data.user_id; + c.selected = c.data.language || 'en'; + + c.changeLang = function() { + $http.patch('/api/now/table/sys_user/' + c.userId, { preferred_language: c.selected }) + .then(function(response) { + location.reload(); + }); + }; +} From 9a3c92502fcbdcba4f80cb5ffaa878b20d31ab9c Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:49:48 -0300 Subject: [PATCH 5/7] Delete Modern Development/Service Portal Widgets/Language Selector/language-selector.js --- .../Language Selector/language-selector.js | 22 ------------------- 1 file changed, 22 deletions(-) delete mode 100644 Modern Development/Service Portal Widgets/Language Selector/language-selector.js diff --git a/Modern Development/Service Portal Widgets/Language Selector/language-selector.js b/Modern Development/Service Portal Widgets/Language Selector/language-selector.js deleted file mode 100644 index 44b3fd12ce..0000000000 --- a/Modern Development/Service Portal Widgets/Language Selector/language-selector.js +++ /dev/null @@ -1,22 +0,0 @@ -function($http) { - var c = this; - - c.languages = [ - { code: 'en', label: 'English', flag: '🇬🇧' }, - { code: 'pb', label: 'Portuguese (Brazil)', flag: '🇧🇷' }, - { code: 'es', label: 'Spanish', flag: '🇪🇸' }, - { code: 'fr', label: 'French', flag: '🇫🇷' }, - { code: 'de', label: 'German', flag: '🇩🇪' }, - { code: 'it', label: 'Italian', flag: '🇮🇹' } - ]; - - c.userId = c.data.user_id; - c.selected = c.data.language || 'en'; - - c.changeLang = function() { - $http.patch('/api/now/table/sys_user/' + c.userId, { preferred_language: c.selected }) - .then(function(response) { - location.reload(); - }); - }; -} From 96c4ea0748278f9aefc10590ad638a3bb3b90469 Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:50:13 -0300 Subject: [PATCH 6/7] Create language-selector.client.js Added client script to update sys_user.language via REST API --- .../language-selector.client.js | 22 +++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 Modern Development/Service Portal Widgets/Language Selector/language-selector.client.js diff --git a/Modern Development/Service Portal Widgets/Language Selector/language-selector.client.js b/Modern Development/Service Portal Widgets/Language Selector/language-selector.client.js new file mode 100644 index 0000000000..3006b117b8 --- /dev/null +++ b/Modern Development/Service Portal Widgets/Language Selector/language-selector.client.js @@ -0,0 +1,22 @@ +function($http) { + var c = this; + + c.languages = [ + { code: 'en', label: 'English', flag: '🇬🇧' }, + { code: 'pb', label: 'Portuguese (Brazil)', flag: '🇧🇷' }, + { code: 'es', label: 'Spanish', flag: '🇪🇸' }, + { code: 'fr', label: 'French', flag: '🇫🇷' }, + { code: 'de', label: 'German', flag: '🇩🇪' }, + { code: 'it', label: 'Italian', flag: '🇮🇹' } + ]; + + c.userId = c.data.user_id; + c.selected = c.data.language || 'en'; + + c.changeLang = function() { + $http.patch('/api/now/table/sys_user/' + c.userId, { preferred_language: c.selected }) + .then(function(response) { + location.reload(); + }); + }; +} From ad3f5daccb4e76a0a0591da943221460f3492a0d Mon Sep 17 00:00:00 2001 From: Isaac Vicentini Date: Sun, 26 Oct 2025 20:50:45 -0300 Subject: [PATCH 7/7] Create language-selector.server.js Added server script to provide current language --- .../Language Selector/language-selector.server.js | 9 +++++++++ 1 file changed, 9 insertions(+) create mode 100644 Modern Development/Service Portal Widgets/Language Selector/language-selector.server.js diff --git a/Modern Development/Service Portal Widgets/Language Selector/language-selector.server.js b/Modern Development/Service Portal Widgets/Language Selector/language-selector.server.js new file mode 100644 index 0000000000..90effd0d9c --- /dev/null +++ b/Modern Development/Service Portal Widgets/Language Selector/language-selector.server.js @@ -0,0 +1,9 @@ +(function() { + var user = gs.getUser(); + data.user_id = user.getID(); + + var grUser = new GlideRecord('sys_user'); + if (grUser.get(data.user_id)) { + data.language = grUser.getValue('preferred_language') || 'en'; + } +})();