Skip to content

Permission Request Modal Update #2499

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jelveh merged 2 commits into from
Mar 2, 2026
+43 −25
Merged

Permission Request Modal Update #2499

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a9055ea
Permission modal now displays application's icon and title. Read and …
miikakuisma Feb 16, 2026
32c5926
Merge branch 'main' into miika/put-511
miikakuisma Feb 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 23 additions & 14 deletions src/gui/src/UI/UIWindowRequestPermission.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,17 @@ async function UIWindowRequestPermission (options) {
* Creates the permission dialog
*/
async function create_permission_window (options, permission_description, resolve) {
const requestingEntity = options.app_name ?? options.origin;
const user_apps = await puter.apps.list();
const app_data = user_apps.find(a => a.name === options.app_name);
const app_icon = app_data.icon;

const requestingEntity = {
name: options.app_name || '',
origin: options.origin || '',
title: app_data.title,
icon: app_icon.image,
};

const h = create_window_content(requestingEntity, permission_description);

return await UIWindow({
Expand Down Expand Up @@ -89,10 +99,10 @@ function create_window_content (requestingEntity, permission_description) {
h += '<div>';
h += '<div style="padding: 20px; width: 100%; box-sizing: border-box;">';
// title
h += `<h1 class="perm-title">${html_encode(requestingEntity)}</h1>`;
h += `<h1 class="perm-title"><img src="${html_encode(requestingEntity.icon)}"/> ${html_encode(requestingEntity.title)}</h1>`;

// description (already HTML encoded)
h += `<p class="perm-description">${html_encode(requestingEntity)} is requesting permission to ${permission_description}</p>`;
h += `<p class="perm-description">${html_encode(requestingEntity.title)} is requesting permission to ${permission_description}</p>`;

// Allow/Don't Allow
h += `<button type="button" class="app-auth-allow button button-primary button-block" style="margin-top: 10px;">${i18n('allow')}</button>`;
Expand Down Expand Up @@ -255,12 +265,12 @@ async function get_standard_folder_description (resource_id, action) {
const whoami = await puter.auth.whoami();
const directories = whoami.directories || {};

// Standard folder names we recognize - maps to i18n keys
// Standard folder names we recognize - maps to i18n keys per action
const folder_i18n_keys = {
'Desktop': 'perm_folder_desktop',
'Documents': 'perm_folder_documents',
'Pictures': 'perm_folder_pictures',
'Videos': 'perm_folder_videos',
'Desktop': { read: 'perm_folder_read_desktop', write: 'perm_folder_write_desktop' },
'Documents': { read: 'perm_folder_read_documents', write: 'perm_folder_write_documents' },
'Pictures': { read: 'perm_folder_read_pictures', write: 'perm_folder_write_pictures' },
'Videos': { read: 'perm_folder_read_videos', write: 'perm_folder_write_videos' },
};

// Check if resource_id matches any of the user's standard directories
Expand All @@ -274,14 +284,13 @@ async function get_standard_folder_description (resource_id, action) {
if ( path_parts.length !== 2 ) continue;

const folder_name = path_parts[1];
const folder_i18n_key = folder_i18n_keys[folder_name];
const folder_actions = folder_i18n_keys[folder_name];
if ( ! folder_actions ) continue;

const folder_i18n_key = folder_actions[action];
if ( ! folder_i18n_key ) continue;

const folder_desc = i18n(folder_i18n_key);
return i18n('perm_folder_access', {
access: `<strong>${html_encode(action)}</strong>`,
folder: folder_desc,
}, false);
return i18n(folder_i18n_key);
}

return null;
Expand Down
5 changes: 4 additions & 1 deletion src/gui/src/css/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3619,7 +3619,10 @@ fieldset[name=number-code] {
}

.perm-title {
text-align: center;
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
margin-top: 0;
padding-bottom: 15px;
font-size: 20px;
Expand Down
13 changes: 8 additions & 5 deletions src/gui/src/i18n/translations/en.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -564,15 +564,18 @@ const en = {
// Permission Descriptions
'perm_fs_file_access': 'use {{name}} located at {{path}} with {{access}} access.',
'perm_fs_resource_access': 'access {{resource_id}} with {{access}} access.',
'perm_folder_access': '{{access}} {{folder}}.',
'perm_thread_post': 'post to thread {{thread}}.',
'perm_service_invoke': 'use {{service}} to invoke {{interface}}.',
'perm_driver_use': 'use {{driver}} to {{action}}.',
'perm_email_read': 'see your email address',
'perm_folder_desktop': 'your Desktop folder',
'perm_folder_documents': 'your Documents folder',
'perm_folder_pictures': 'your Pictures folder',
'perm_folder_videos': 'your Videos folder',
'perm_folder_read_desktop': 'read files from your Desktop',
'perm_folder_write_desktop': 'save and modify files on your Desktop',
'perm_folder_read_documents': 'read files in your Documents folder',
'perm_folder_write_documents': 'save and modify files in your Documents folder',
'perm_folder_read_pictures': 'view files in your Pictures folder',
'perm_folder_write_pictures': 'save and modify files in your Pictures folder',
'perm_folder_read_videos': 'access files in your Videos folder',
'perm_folder_write_videos': 'save and modify files in your Videos folder',
'perm_apps_read': 'see your apps',
'perm_apps_write': 'manage your apps',
'perm_subdomains_read': 'see your subdomains',
Expand Down
13 changes: 8 additions & 5 deletions src/gui/src/i18n/translations/fr.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -534,15 +534,18 @@ const fr = {
// Permission Descriptions
'perm_fs_file_access': 'utiliser {{name}} situé à {{path}} avec un accès {{access}}.',
'perm_fs_resource_access': 'accéder à {{resource_id}} avec un accès {{access}}.',
'perm_folder_access': '{{access}} {{folder}}.',
'perm_thread_post': 'publier sur le fil {{thread}}.',
'perm_service_invoke': 'utiliser {{service}} pour invoquer {{interface}}.',
'perm_driver_use': 'utiliser {{driver}} pour {{action}}.',
'perm_email_read': 'voir votre adresse e-mail',
'perm_folder_desktop': 'votre dossier Bureau',
'perm_folder_documents': 'votre dossier Documents',
'perm_folder_pictures': 'votre dossier Images',
'perm_folder_videos': 'votre dossier Vidéos',
'perm_folder_read_desktop': 'lire les fichiers de votre Bureau, afin de pouvoir accéder à vos fichiers et les ouvrir',
'perm_folder_write_desktop': 'enregistrer et modifier des fichiers sur votre Bureau, afin de pouvoir stocker des fichiers pour vous',
'perm_folder_read_documents': 'lire les fichiers de votre dossier Documents, afin de pouvoir ouvrir vos documents',
'perm_folder_write_documents': 'enregistrer et modifier des fichiers dans votre dossier Documents, afin de pouvoir sauvegarder votre travail',
'perm_folder_read_pictures': 'consulter les fichiers de votre dossier Images, afin de pouvoir afficher vos images',
'perm_folder_write_pictures': 'enregistrer et modifier des fichiers dans votre dossier Images, afin de pouvoir stocker vos images',
'perm_folder_read_videos': 'accéder aux fichiers de votre dossier Vidéos, afin de pouvoir lire vos vidéos',
'perm_folder_write_videos': 'enregistrer et modifier des fichiers dans votre dossier Vidéos, afin de pouvoir stocker vos vidéos',
'perm_apps_read': 'voir vos applications',
'perm_apps_write': 'gérer vos applications',
'perm_subdomains_read': 'voir vos sous-domaines',
Expand Down
Loading