Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improvements to access type and sign in and out process.

Browse Source
This commit is contained in:
Scott Idem
2025-05-01 17:09:06 -04:00
parent 63cb0f2969
commit 9687fe0c90
4 changed files with 232 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/lib/ae_stores.ts
View File

@@ -97,14 +97,15 @@ const ae_app_local_data_defaults: key_val = {
// 'trusted_passcode': '19111',
// 'authenticated_passcode': 'auth2024',
'access_type': 'anonymous',
'administrator_access': false,
'trusted_access': false,
'public_access': false,
'authenticated_access': false,
'anonymous_access': true,
access_type: 'anonymous',
administrator_access: false,
trusted_access: false,
public_access: false,
authenticated_access: false,
anonymous_access: true,
'user_email': null, // Currently used with Sponsorships only?
user_email: null, // Currently used with Sponsorships only?
user_access_type: null, // Used to revert back to the user's access type after quick access (temporarily escalate permissions) turned off.
// Added 2025-04-04
person_id: null, // The current person_id of the logged-in user (if any)
@@ -135,8 +136,10 @@ const ae_app_local_data_defaults: key_val = {
super: false, // Is the user a super user
manager: false, // Is the user a global manager (can manage accounts and users)
administrator: false, // Is the user an account administrator
verified: false, // Is the user verified
public: false, // Is the user a public user (can view public content)
person_id: null, // The person ID of the logged-in user
access_type: null, // The access type of the logged-in user
},
'qry__enabled': 'enabled', // all, disabled, enabled

113
src/lib/element_access_type.svelte
View File

@@ -6,6 +6,10 @@ import { afterNavigate } from '$app/navigation';
// *** Import other supporting libraries
// import { liveQuery } from "dexie";
import {
ShieldEllipsis, ShieldMinus, ShieldPlus, ShieldUser,
User, UserCheck
} from '@lucide/svelte';
// *** Import Aether specific variables and functions
import { ae_util } from '$lib/ae_utils/ae_utils';
@@ -183,13 +187,18 @@ function handle_check_access_type_passcode() {
$ae_loc.access_type = 'authenticated';
} else {
console.log('Passcode does not match');
if (log_lvl > 1) {
console.log('Entered passcode does not match any of the site access codes.');
}
window.localStorage.setItem('access_type', 'anonymous');
if ($ae_loc.access_type != 'anonymous') {
console.log('Access type is not anonymous');
}
// window.localStorage.setItem('access_type', 'anonymous');
$ae_loc.access_type = 'anonymous';
// $ae_loc.access_type = 'anonymous';
trigger = 'process_permission_check';
// trigger = 'process_permission_check';
// $ae_loc = $ae_loc; // Trigger Svelte just in case
// ae_loc.set($ae_loc);
@@ -241,11 +250,12 @@ function handle_clear_access() {
window.localStorage.setItem('access_type', 'anonymous');
// $ae_loc.access_type = null; // 'anonymous';
$ae_loc.access_type = 'anonymous';
// Revert back to the user's access type after quick access (temporarily escalate permissions) is turned off.
$ae_loc.access_type = $ae_loc.user_access_type ?? 'anonymous';
trigger = 'process_permission_check';
entered_passcode = ''; // Clear the entered passcode
show_passcode_input = false;
show_passcode_input = true;
$ae_loc.app_cfg.show_element__menu = false;
$ae_loc.app_cfg.show_element__menu_btn = true;
@@ -382,9 +392,36 @@ function handle_clear_access() {
{/if}
</div>
<div class="transition-all">
{#if $ae_loc.access_type && $ae_loc.access_type != 'anonymous'}
<span class="fas fa-unlock mx-1"></span>
<div class="transition-all flex flex-row flex-wrap gap-1 items-end justify-end">
{#if $ae_loc?.access_type && $ae_loc?.access_type == 'anonymous' && 1==3}
<span>
<button
type="button"
onclick={() => {
// handle_check_access_type_passcode();
trigger = true;
}}
class="btn btn-sm variant-glass-success hover:variant-filled-warning access_type_unlock_btn transition-all"
title="Anonymous public access is currently set. Access mode is disabled/locked."
>
<span class="fas fa-lock mx-1"></span>
<span class="lock_icon">Locked</span>
<span class="fas fa-unlock mx-1 unlock_icon hidden"></span>
{#if (show_passcode_input)}
<span class="unlock_text">Cancel</span>
{:else}
<span class="unlock_text">Access?</span>
{/if}
</button>
</span>
{/if}
{#if ($ae_loc?.access_type && $ae_loc?.access_type != 'anonymous')}
<span class="flex flex-row gap-1 items-center justify-center">
<!-- <span class="fas fa-unlock mx-1"></span> -->
<ShieldPlus class="inline-block" />
<span
class="*:hover:inline"
@@ -414,18 +451,43 @@ function handle_clear_access() {
{/if}
</span>
<button
type="button"
onclick={() => {
// handle_clear_access();
trigger_clear_access = true;
}}
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning transition-all"
title="Access mode is currently enabled/unlocked. Click to exit and lock."
>
<span class="fas fa-lock mx-1"></span> Lock?
</button>
{:else}
{#if $ae_loc?.user_access_type && $ae_loc?.access_type == $ae_loc?.user_access_type && !show_passcode_input}
<button
type="button"
onclick={() => {
// handle_clear_access();
// trigger_clear_access = true;
show_passcode_input = !show_passcode_input;
}}
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning transition-all"
title="Access mode is currently enabled/unlocked. Click to exit and lock."
>
<!-- <span class="fas fa-lock mx-1"></span> -->
<!-- <ShieldMinus /> -->
<ShieldEllipsis class="inline-block" />
Passcode?
</button>
{:else if (!show_passcode_input)}
<button
type="button"
onclick={() => {
// handle_clear_access();
trigger_clear_access = true;
// show_passcode_input = true;
}}
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning transition-all"
title="Access mode is currently enabled/unlocked. Click to exit and lock."
>
<!-- <span class="fas fa-lock mx-1"></span> -->
<ShieldMinus class="inline-block" />
Clear?
</button>
{/if}
</span>
{/if}
{#if (show_passcode_input)}
<span class="flex flex-row gap-1 items-center justify-center">
<button
type="button"
onclick={async () => {
@@ -438,7 +500,7 @@ function handle_clear_access() {
entered_passcode = ''; // Clear the entered passcode when showing the input
}
}}
class="btn btn-sm variant-glass-success hover:variant-filled-warning access_type_unlock_btn transition-all"
class="btn btn-sm variant-glass-success hover:variant-filled-warning access_type_unlock_btn transition-all hidden"
title="Anonymous public access is currently set. Access mode is disabled/locked."
>
<span class="fas fa-lock mx-1 lock_icon"></span>
@@ -453,17 +515,22 @@ function handle_clear_access() {
<!-- <span class="unlock_text">Cancel?</span> -->
</button>
<ShieldEllipsis class="inline-block" />
<span class="unlock_text">Passcode?</span>
<input
id="access_passcode_input"
bind:value={entered_passcode}
class="input w-32 transition-all"
class:hidden={!show_passcode_input}
type="text"
placeholder="Access code"
placeholder="Passcode"
autofocus={show_passcode_input}
/>
<!-- <div class="current_text transition-all">{$ae_loc.access_type}</div> -->
</span>
{/if}
</div>
</section>

32
src/lib/element_sign_in_out.svelte
View File

@@ -2,7 +2,7 @@
// *** Import Svelte specific
import { browser } from '$app/environment';
import { goto } from '$app/navigation';
import { goto, invalidateAll } from '$app/navigation';
import { Modal } from 'flowbite-svelte';
// *** Import other supporting libraries
@@ -90,6 +90,7 @@ function sign_in() {
} else {
$ae_loc.access_type = 'authenticated';
}
$ae_loc.user_access_type = $ae_loc.access_type; // Used to revert back to the user's access type after quick access (temporarily escalate permissions) is turned off.
let access_checks_results = ae_util.process_permission_checks($ae_loc.access_type);
// WARNING: I think this is causing a loop in Svelte or something.
@@ -138,6 +139,35 @@ function sign_out() {
// $ae_sess.auth__entered_username = null; // Keeping the username
$ae_sess.auth__entered_password = null;
indexedDB.deleteDatabase('ae_archives_db'); // Archives module
indexedDB.deleteDatabase('ae_core_db');
indexedDB.deleteDatabase('ae_events_db'); // Events module
indexedDB.deleteDatabase('ae_journals_db'); // Journals module
indexedDB.deleteDatabase('ae_posts_db'); // Posts module
indexedDB.deleteDatabase('ae_sponsorships_db'); // Sponsorships module
// $ae_loc.allow_access = false;
$ae_loc.authenticated_access = false;
$ae_loc.edit_mode = false;
localStorage.clear();
sessionStorage.clear();
console.log('Remove the sign out fields from the URL.');
data.url.searchParams.delete('user_id');
data.url.searchParams.delete('user_key');
data.url.searchParams.delete('username');
data.url.searchParams.delete('user_email');
data.url.searchParams.delete('valid_email'); // Part of sign in email for possible future use
let new_url = data.url.toString();
// We need to set browser history and force all load functions to rerun.
// goto(new_url, {replaceState: true, invalidateAll: true});
// invalidateAll();
window.location.reload();
console.log('Signed out successfully.');
}

138
src/routes/+layout.svelte
View File

@@ -32,7 +32,7 @@ import {
LogIn, LogOut, LockKeyhole,
Mail, MailCheck,
Menu,
ShieldUser,
ShieldEllipsis, ShieldMinus, ShieldPlus, ShieldUser,
User, UserCheck
} from '@lucide/svelte';
@@ -173,12 +173,16 @@ if ($ae_loc && $ae_sess && ($ae_loc.ver != $ae_sess.ver)) {
// Minutes reference:
// 240 = 4 hours; 720 = 12 hours; 2880 = 48 hours;
// 10080 = 1 week; 20160 = 2 weeks; 43200 = 1 month;
let default_refresh_minutes: number = 60;
let trusted_refresh_minutes: number = 120;
let manager_refresh_minutes: number = 2880;
let default_refresh_minutes: number = 120;
let authenticated_refresh_minutes: number = 240;
let trusted_refresh_minutes: number = 10080;
let manager_refresh_minutes: number = 20160;
if ($ae_loc?.site_cfg_json?.default_refresh_minutes) {
default_refresh_minutes = $ae_loc.site_cfg_json.default_refresh_minutes;
}
if ($ae_loc?.site_cfg_json?.authenticated_refresh_minutes) {
authenticated_refresh_minutes = $ae_loc.site_cfg_json.authenticated_refresh_minutes;
}
if ($ae_loc?.site_cfg_json?.trusted_refresh_minutes) {
trusted_refresh_minutes = $ae_loc.site_cfg_json.trusted_refresh_minutes;
}
@@ -186,13 +190,14 @@ if ($ae_loc?.site_cfg_json?.manager_refresh_minutes) {
manager_refresh_minutes = $ae_loc.site_cfg_json.manager_refresh_minutes;
}
let default_refresh_time = default_refresh_minutes * 60 * 1000; // 48 hours or 2880 minutes? 48 * 60 *
let trusted_refresh_time = trusted_refresh_minutes * 60 * 1000; // 1 week or 10080 minutes?
let manager_refresh_time = manager_refresh_minutes * 60 * 1000; // 1 week or 10080 minutes?
let default_refresh_time = default_refresh_minutes * 60 * 1000;
let authenticated_refresh_time = authenticated_refresh_minutes * 60 * 1000;
let trusted_refresh_time = trusted_refresh_minutes * 60 * 1000;
let manager_refresh_time = manager_refresh_minutes * 60 * 1000;
// IDB caches - Check if the last refresh timestamp for $ae_loc.last_cache_refresh is no more than 15 minutes ago.
let default_idb_refresh_time = 120 * 60 * 60 * 1000; // 15 minutes?
let trusted_idb_refresh_time = 120 * 60 * 60 * 1000; // 4 hours or 120 minutes?
let trusted_idb_refresh_time = 240 * 60 * 60 * 1000; // 4 hours or 120 minutes?
if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
console.log(`ROOT: Last reload not found. Need to set!`);
@@ -215,7 +220,18 @@ if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
console.log(`ROOT: Last diff: ${Date.now() - $ae_loc?.last_cache_refresh}`);
}
if ($ae_loc?.trusted_access && (Date.now() - $ae_loc?.last_cache_refresh) > trusted_refresh_time) {
if ($ae_loc?.manager_access && (Date.now() - $ae_loc?.last_cache_refresh) > manager_refresh_time) {
console.log(`ROOT: Last (manager) local config reload too old for all caches: ${$ae_loc.last_cache_refresh}`);
flag_clear_idb = true;
flag_clear_local = true;
flag_clear_sess = true;
flag_reload = true;
flag_expired = true;
$ae_loc.cache_expired = true;
$ae_loc.allow_access = false;
} else if ($ae_loc?.trusted_access && (Date.now() - $ae_loc?.last_cache_refresh) > trusted_refresh_time) {
console.log(`ROOT: Last (trusted) local config reload too old for all caches: ${$ae_loc.last_cache_refresh}`);
flag_clear_idb = true;
@@ -226,8 +242,8 @@ if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
$ae_loc.cache_expired = true;
$ae_loc.allow_access = false;
} else if (!$ae_loc?.trusted_access && (Date.now() - $ae_loc?.last_cache_refresh) > default_refresh_time) {
console.log(`ROOT: Last (default) local config reload too old for all caches: ${$ae_loc.last_cache_refresh}`);
} else if ($ae_loc?.authenticated_access && (Date.now() - $ae_loc?.last_cache_refresh) > authenticated_refresh_time) {
console.log(`ROOT: Last (authenticated) local config reload too old for all caches: ${$ae_loc.last_cache_refresh}`);
flag_clear_idb = true;
flag_clear_local = true;
@@ -237,8 +253,8 @@ if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
$ae_loc.cache_expired = true;
$ae_loc.allow_access = false;
} else if ($ae_loc?.manager_access && (Date.now() - $ae_loc?.last_cache_refresh) > manager_refresh_time) {
console.log(`ROOT: Last (manager) local config reload too old for all caches: ${$ae_loc.last_cache_refresh}`);
} else if ((Date.now() - $ae_loc?.last_cache_refresh) > default_refresh_time) {
console.log(`ROOT: Last (default) local config reload too old for all caches: ${$ae_loc.last_cache_refresh}`);
flag_clear_idb = true;
flag_clear_local = true;
@@ -254,6 +270,7 @@ if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
}
}
// Only clear IDB, not the local or session storage.
if ($ae_loc?.trusted_access && (Date.now() - $ae_loc?.last_cache_refresh) > trusted_idb_refresh_time) {
console.log(`ROOT: Last (trusted) IDB reload too old for IDB: ${$ae_loc.last_cache_refresh}`);
@@ -432,7 +449,7 @@ function clear_idb() {
// indexedDB.deleteDatabase('presenters'); // Events module <-- WARNING
// indexedDB.deleteDatabase('sessions'); // Events module <-- WARNING
// indexedDB.deleteDatabase('file'); // Core - Hosted Files module
indexedDB.deleteDatabase('ae_journals_db');
indexedDB.deleteDatabase('ae_journals_db'); // Journals module
// indexedDB.deleteDatabase('journal_entry');
// indexedDB.deleteDatabase('notes');
indexedDB.deleteDatabase('ae_posts_db'); // Posts module
@@ -913,12 +930,13 @@ max-w-max -->
</button>
{/if}
<div class="transition-all *:hover:inline">
<div class="flex flex-row flex-wrap gap-1 items-center justify-center transition-all *:hover:inline">
{#if $ae_loc.access_type && $ae_loc.access_type != 'anonymous'}
<span
class="*:hover:inline"
>
<span class="fas fa-unlock mx-1"></span>
<!-- <span class="fas fa-unlock mx-1"></span> -->
<ShieldPlus class="inline-block" />
{#if $ae_loc.access_type == 'super'}
@@ -946,25 +964,63 @@ max-w-max -->
{/if}
</span>
<button
type="button"
onclick={() => {
trigger_clear_access = true;
{#if $ae_loc?.user_access_type && $ae_loc?.access_type == $ae_loc?.user_access_type}
<button
type="button"
onclick={() => {
// handle_clear_access();
// trigger_clear_access = true;
// $ae_loc.app_cfg.show_element__passcode_input = !$ae_loc.app_cfg.show_element__passcode_input;
if ($ae_loc?.app_cfg?.show_element__menu_btn) {
$ae_loc.app_cfg.show_element__menu = true;
$ae_loc.app_cfg.show_element__menu_btn = false;
$ae_loc.app_cfg.show_element__access_type = true;
} else {
$ae_loc.app_cfg.show_element__menu = false;
$ae_loc.app_cfg.show_element__menu_btn = true;
}
}}
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning transition-all hidden"
title="Access mode is currently enabled/unlocked. Click to exit and lock."
>
<span class="fas fa-lock mx-1"></span> Lock?
</button>
if ($ae_loc?.app_cfg?.show_element__menu_btn) {
$ae_loc.app_cfg.show_element__menu = true;
$ae_loc.app_cfg.show_element__menu_btn = false;
$ae_loc.app_cfg.show_element__access_type = true;
$ae_loc.app_cfg.show_element__passcode_input = true;
} else {
$ae_loc.app_cfg.show_element__menu = false;
$ae_loc.app_cfg.show_element__menu_btn = true;
}
}}
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning transition-all *:hover:inline"
title="Access mode is currently enabled/unlocked. Click to exit and lock."
>
<!-- <span class="fas fa-lock mx-1"></span> -->
<!-- <ShieldMinus /> -->
<ShieldEllipsis class="inline-block" />
<span class="hidden">Passcode?</span>
</button>
{:else}
<button
type="button"
onclick={() => {
trigger_clear_access = true;
if ($ae_loc?.app_cfg?.show_element__menu_btn) {
$ae_loc.app_cfg.show_element__menu = true;
$ae_loc.app_cfg.show_element__menu_btn = false;
$ae_loc.app_cfg.show_element__access_type = true;
$ae_loc.app_cfg.show_element__passcode_input = true;
// await tick();
// console.log('Layout button click: Focus on passcode input!');
// /** @type {HTMLElement | null} */
// const to_focus = document.getElementById('access_passcode_input');
// to_focus?.focus();
} else {
$ae_loc.app_cfg.show_element__menu = false;
$ae_loc.app_cfg.show_element__menu_btn = true;
}
}}
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning transition-all hidden"
title="Access mode is currently enabled/unlocked. Click to exit and lock."
>
<!-- <span class="fas fa-lock mx-1"></span> Lock? -->
<ShieldMinus class="inline-block" />
Clear?
</button>
{/if}
{:else}
<button
type="button"
@@ -993,7 +1049,7 @@ max-w-max -->
>
<!-- <span class="fas fa-lock mx-1 lock_icon"></span> -->
<!-- <span class="">Unlock?</span> -->
<ShieldUser />
<ShieldUser class="inline-block" />
<span class="hidden">Auth?</span>
</button>
{/if}
@@ -1009,7 +1065,13 @@ max-w-max -->
$ae_loc.app_cfg.show_element__menu = true;
$ae_loc.app_cfg.show_element__menu_btn = false;
$ae_loc.app_cfg.show_element__access_type = true;
$ae_loc.app_cfg.show_element__passcode_input = true;
if ($ae_loc?.access_type == 'anonymous') {
$ae_loc.app_cfg.show_element__passcode_input = true;
} else {
$ae_loc.app_cfg.show_element__passcode_input = false;
}
// $ae_loc.app_cfg.show_element__passcode_input = true;
await tick();
console.log('Layout button click: Focus on passcode input!');
/** @type {HTMLElement | null} */
@@ -1018,6 +1080,7 @@ max-w-max -->
} else {
$ae_loc.app_cfg.show_element__menu = false;
$ae_loc.app_cfg.show_element__menu_btn = true;
$ae_loc.app_cfg.show_element__passcode_input = false;
}
// $ae_loc.app_cfg.show_element__menu_btn = !$ae_loc?.app_cfg?.show_element__menu_btn;
}}
@@ -1039,6 +1102,7 @@ max-w-max -->
</section>
<!-- Show menu on right side of page -->
<!-- min-h-96 -->
<section
class="
ae_app__menu
@@ -1047,7 +1111,7 @@ max-w-max -->
items-center
justify-end
gap-4
min-h-96
min-w-48
absolute right-0 bottom-10
bg-white dark:bg-gray-800