From 1e3086560d4ef79a71b6d5b0dba87cccd1fe7230 Mon Sep 17 00:00:00 2001
From: Scott Idem <stidem@gmail.com>
Date: Mon, 16 Sep 2024 18:10:55 -0400
Subject: [PATCH] Creating version to of the data store element. Hopefully
 better now.

---
 src/lib/ae_events_stores.ts                  |  14 +-
 src/lib/ae_stores.ts                         |   9 +-
 src/lib/element_access_type.svelte           |  14 +-
 src/lib/element_data_store_v2.svelte         | 804 +++++++++++++++++++
 src/routes/+layout.svelte                    |  19 +-
 src/routes/+layout.ts                        |  29 +-
 src/routes/+page.svelte                      |   2 +-
 src/routes/admin/+layout.svelte              |  40 -
 src/routes/events_badges/+layout.svelte      |  17 -
 src/routes/events_badges/review/+page.svelte |   2 +-
 src/routes/events_badges/stats/+page.svelte  |   2 +-
 11 files changed, 833 insertions(+), 119 deletions(-)
 create mode 100644 src/lib/element_data_store_v2.svelte

diff --git a/src/lib/ae_events_stores.ts b/src/lib/ae_events_stores.ts
index 279ada6b..42116b79 100644
--- a/src/lib/ae_events_stores.ts
+++ b/src/lib/ae_events_stores.ts
@@ -23,9 +23,7 @@ let events_local_data_struct: key_val = {
 
     'events_cfg_json': {},
 
-    'default__event_id': null, // OSIT Demo pjrcghqwert
-    'default__location_id': null,
-    'default__session_id': null,
+    'event_id': null,
 
     // all, disabled, enabled
     'qry__enabled': 'enabled',
@@ -96,8 +94,8 @@ let events_local_data_struct: key_val = {
     },
 
     // Event Files - uploads for sessions, presenters, etc
-    'files': {
-    },
+    // 'files': {
+    // },
 
     // Event Presentation Launcher (and native Electron app)
     'launcher': {
@@ -247,10 +245,8 @@ let events_local_data_struct: key_val = {
     },
 
     // Speakers Management (Collection)
-    'speakers': {
-        'default__session_id': null, // Assign to new presenters by default
-        status__submit: null, // 'saving', 'created', 'updated'
-    },
+    // 'speakers': {
+    // },
 
     // other
 }
diff --git a/src/lib/ae_stores.ts b/src/lib/ae_stores.ts
index cd14014a..a1f0a999 100644
--- a/src/lib/ae_stores.ts
+++ b/src/lib/ae_stores.ts
@@ -73,9 +73,8 @@ export let ae_app_local_data_struct: key_val = {
         header_image_path: null,
     },
 
-    // The page access codes can be pulled from the data store "hub__page__access_code_li_json" per account.
-    // Currently configured for OSIT, ASCM, LCI
-    'page_access_code_li': {
+    // The site access codes can be pulled from the site records for an account.
+    'site_access_code_kv': {
         // 'manager': '10240',
         'administrator': '11500',
         'trusted': '19111',
@@ -94,7 +93,7 @@ export let ae_app_local_data_struct: key_val = {
     'authenticated_access': false,
     'anonymous_access': true,
 
-    'user_email': null,
+    'user_email': null, // Currently used with Sponsorships only?
 
     'qry__enabled': 'enabled', // all, disabled, enabled
     'qry__hidden': 'not_hidden', // all, hidden, not_hidden
@@ -281,7 +280,7 @@ if (ae_no_account_id) {
 }
 ae_api_data_struct['headers'] = ae_api_headers;
 
-console.log(`AE Stores - API Data:`, ae_api_data_struct);
+// console.log(`AE Stores - API Data:`, ae_api_data_struct);
 export let ae_api = writable(ae_api_data_struct);
 
 // *** BEGIN *** Trigger to update the slct variables and other things.
diff --git a/src/lib/element_access_type.svelte b/src/lib/element_access_type.svelte
index c81306a8..2ab3da8b 100644
--- a/src/lib/element_access_type.svelte
+++ b/src/lib/element_access_type.svelte
@@ -44,41 +44,41 @@ $: if (trigger && $ae_loc.access_type) {
 
 
 function handle_check_access_type_passcode() {
-    console.log(`*** handle_check_access_type_passcode() *** passcode list:`, $ae_loc.page_access_code_li);
+    console.log(`*** handle_check_access_type_passcode() *** passcode list:`, $ae_loc.site_access_code_kv);
 
     if (entered_passcode && entered_passcode.length >= 5) {
 
-        if ($ae_loc.page_access_code_li.super == entered_passcode) {
+        if ($ae_loc.site_access_code_kv.super == entered_passcode) {
             console.log('Super passcode matched');
 
             window.localStorage.setItem('access_type', 'super');
 
             $ae_loc.access_type = 'super';
-        } else if ($ae_loc.page_access_code_li.manager == entered_passcode) {
+        } else if ($ae_loc.site_access_code_kv.manager == entered_passcode) {
             console.log('Manager passcode matched');
 
             window.localStorage.setItem('access_type', 'manager');
 
             $ae_loc.access_type = 'manager';
-        } else if ($ae_loc.page_access_code_li.administrator == entered_passcode) {
+        } else if ($ae_loc.site_access_code_kv.administrator == entered_passcode) {
             console.log('Administrator passcode matched');
 
             window.localStorage.setItem('access_type', 'administrator');
 
             $ae_loc.access_type = 'administrator';
-        } else if ($ae_loc.page_access_code_li.trusted == entered_passcode) {
+        } else if ($ae_loc.site_access_code_kv.trusted == entered_passcode) {
             console.log('Trusted passcode matched');
 
             window.localStorage.setItem('access_type', 'trusted');
 
             $ae_loc.access_type = 'trusted';
-        } else if ($ae_loc.page_access_code_li.public == entered_passcode) {
+        } else if ($ae_loc.site_access_code_kv.public == entered_passcode) {
             console.log('Public passcode matched');
 
             window.localStorage.setItem('access_type', 'public');
 
             $ae_loc.access_type = 'public';
-        } else if ($ae_loc.page_access_code_li.authenticated == entered_passcode) {
+        } else if ($ae_loc.site_access_code_kv.authenticated == entered_passcode) {
             console.log('Authenticated passcode matched');
 
             window.localStorage.setItem('access_type', 'authenticated');
diff --git a/src/lib/element_data_store_v2.svelte b/src/lib/element_data_store_v2.svelte
new file mode 100644
index 00000000..25365d1a
--- /dev/null
+++ b/src/lib/element_data_store_v2.svelte
@@ -0,0 +1,804 @@
+<script lang="ts">
+import { browser } from '$app/environment';
+import { onMount } from 'svelte';
+// import type { Writable } from 'svelte/store';
+// import { localStorageStore } from '@skeletonlabs/skeleton';
+
+import { api } from '$lib/api';
+import { ae_loc, ae_sess, ae_api, slct, slct_trigger, ae_trig } from '$lib/ae_stores';
+import { ae_util } from '$lib/ae_utils';
+import type { key_val } from '$lib/ae_stores';
+
+export let log_lvl: number = 1;
+export let expire_minutes: number = 10;
+export let mount_reload_sec: number = 0;
+
+export let ds_code: string;
+export let ds_name: null|string = null;
+export let ds_type: string = 'text';
+export let for_type: null|string = null;
+export let for_id: null|string = null;
+console.log(`ae_e_data_store ${ds_code} account_id=${$ae_loc.account_id} for_type=${for_type} for_id=${for_id}`);
+
+// export let store: string = 'local';
+// export let display: string = 'block'; // Avoid; Use class list instead
+export let class_li: string = ''; // : string[] = [];
+export let try_cache: boolean = true;
+
+export let hide: boolean = false; // Hide the entire element
+export let show_edit: boolean = false;
+export let show_edit_btn: boolean = true;
+export let show_view: boolean = true;
+// export let show_delete_btn: boolean = false;
+
+export let ds_loaded: boolean = false;
+
+export let debug: boolean = false;
+
+let ae_promises: key_val = {};
+// let ae_tmp: key_val = {};
+// let ae_triggers: key_val = {};
+
+let ds_get_results: Promise<any>|key_val;
+let ds_loading_status: string = 'starting...';
+let ds_submit_results: Promise<any>|key_val;
+
+let val_json: key_val;
+let val_html: key_val;
+let val_md: key_val;
+export let val_sql: null|key_val = null;
+let val_text: string;
+
+
+let ds_code_obj =
+    {
+        id: null,
+        account_id: null,
+        code: ds_code,
+        name: ds_name,
+        type: ds_type,
+        for_type: null, // for_type
+        for_id: null, // for_id
+        access_read: null, // 'super', 'manager', 'administrator', 'trusted', 'authenticated', 'anonymous'
+        access_write: null, // 'super', 'manager', 'administrator', 'trusted', 'authenticated', 'anonymous'
+        access_delete: null, // 'super', 'manager', 'administrator', 'trusted', 'authenticated', 'anonymous'
+        html: null,
+        json: null,
+        md: null,
+        text: null,
+        updated_on: null,
+        chk_account_id: null,
+    };
+
+let ae_ds_tmp: key_val;
+if (browser && try_cache && localStorage.getItem(`ae_ds__${ds_code}`)) {
+    if (log_lvl) {
+        console.log(`ae_e_data_store: Found cached data for ${ds_code}`);
+    }
+    ae_ds_tmp = JSON.parse(localStorage.getItem(`ae_ds__${ds_code}`));
+    if (log_lvl) {
+        console.log(`ae_e_data_store cached: ${ds_code} account_id=${$ae_loc.account_id}`, ae_ds_tmp);
+    }
+} else {
+    ae_ds_tmp = ds_code_obj;
+    ds_loading_status = '-- loading --';
+}
+
+$ae_sess.ds.submit_status = null;
+$ae_sess.ds.create_status = null;
+$ae_sess.ds.update_status = null;
+
+let trigger: null|string = null;
+
+// This is a quick check to make sure the data store is not stale. If it is, then we need to trigger a reload.
+if (browser && ae_ds_tmp && ae_ds_tmp.loaded_on && ae_ds_tmp.chk_account_id == $ae_loc.account_id) {
+    console.log(`ae_e_data_store ${ds_code} loaded_on: ${ae_ds_tmp.loaded_on}`);
+    let loaded_on = new Date(ae_ds_tmp.loaded_on);
+    let now = new Date();
+    let diff = now.getTime() - loaded_on.getTime();
+    let diff_minutes = diff / (1000 * 60);
+    if (diff_minutes > expire_minutes) {
+        console.log(`ae_e_data_store: Data Store ${ds_code} stale. Last loaded on: ${loaded_on.toISOString()}`);
+        // Wait for random number of milliseconds to avoid all data stores being reloaded at the same time.
+        let random_ms = Math.floor(Math.random() * 500);
+        console.log(`ae_e_data_store: Random number of milliseconds: ${random_ms}`);
+        setTimeout(() => {
+            trigger = 'load__ds__code';
+        }, random_ms);
+    }
+} else if (browser) {
+    console.log('ae_e_data_store: No loaded_on date found and or the account_id check failed. Need to trigger reload.');
+    trigger = 'load__ds__code';
+}
+
+// This is a secondary check... The account_id should either be null or match the current account_id.
+if (!ae_ds_tmp || !ae_ds_tmp.account_id === null || $ae_loc.account_id == $ae_loc.account_id) {
+    trigger = 'load__ds__code';
+}
+
+if (browser && mount_reload_sec) {
+    // Wait for random number of milliseconds to avoid all data stores being reloaded at the same time.
+    let random_ms = Math.floor(Math.random() * mount_reload_sec * 1000);
+    if (log_lvl) {
+        console.log(`ae_e_data_store: Random number of milliseconds: ${random_ms}`);
+    }
+    setTimeout(() => {
+        trigger = 'load__ds__code';
+    }, random_ms);
+}
+
+// let ds_code_li = {}; //: key_val; // = ae_loc_tmp.ds;
+// console.log(`ae_ ds_code_li = `, ds_code_li);
+
+$: if (trigger == 'load__ds__code' && ds_code && ds_type) {
+    console.log(`ae_e_data_store: ae_ load__ds__code: ${ds_code} ds_type=${ds_type} for_type=${for_type} for_id=${for_id} ${try_cache}`);
+
+    trigger = null;
+
+    load_data_store({
+        code: ds_code,
+        type: ds_type,
+        for_type: for_type,
+        for_id: for_id,
+        try_cache: try_cache
+    });
+}
+
+async function load_data_store(
+        {
+            code,
+            type = 'text',
+            for_type = null,
+            for_id = null,
+            try_cache = true,
+            log_lvl = 0
+        }: {
+            code: string,
+            type?: string,
+            for_type?: string|null,
+            for_id?: string|null,
+            try_cache?: boolean,
+            log_lvl?: number
+        }
+    ) {
+
+    // let ds_code_val = await api.get_data_store_obj_w_code({
+    ds_get_results = api.get_data_store_obj_w_code({
+        api_cfg: $ae_api,
+        data_store_code: code,
+        data_type: type,
+        log_lvl: log_lvl
+        })
+    .then( function (ds_results) {
+        // console.log(`ae_ Data Store ${code} = `, ds_results);
+        if (ds_results) {
+            if (log_lvl) {
+                console.log(`ae_e_data_store: Got a result for code ${code}`);
+            }
+            if (!ds_results.data_store_id_random) {
+                console.log('Something went wrong? No data store ID found.');
+                return false;
+            }
+
+            ds_loaded = true;
+            ds_loading_status = '-- loaded --';
+
+            // Set the loaded_on datetime to the current time for reference later. This will be used to determine if the data store is stale.
+            ae_ds_tmp.loaded_on = new Date().toISOString();
+            // Set the chk_account_id as a backup check to make sure the data store belongs to the account for the current site. This should not be needed, but here we are...
+            ae_ds_tmp.chk_account_id = $ae_loc.account_id;
+
+            ae_ds_tmp.id = ds_results.data_store_id_random;
+            ae_ds_tmp.account_id = ds_results.account_id_random;
+            ae_ds_tmp.code = ds_results.code; // This will overwrite whatever was passed in.
+            ae_ds_tmp.name = ds_results.name;
+            ae_ds_tmp.type = ds_results.type; // This will overwrite whatever was passed in.
+            if (type == 'html') {
+                ae_ds_tmp.html = ds_results.text;
+                val_html = ds_results.text;
+                return ds_results.html;
+            } else if (type == 'json') {
+                ae_ds_tmp.json = ds_results.json;
+                val_json = ds_results.json;
+                return ds_results.json;
+            } else if (type == 'md') {
+                ae_ds_tmp.text = ds_results.text;
+                val_md = ds_results.text;
+                return ds_results.text;
+            } else if (type == 'sql') {
+                ae_ds_tmp.text = ds_results.text;
+                val_sql = ds_results.text;
+                return ds_results.text;
+            } else {
+                ae_ds_tmp.text = ds_results.text;
+                val_text = ds_results.text;
+                return ds_results.text;
+            }
+        } else {
+            ds_loaded = false;
+            ds_loading_status = '-- not found --';
+        }
+    })
+    .then(function () {
+        if (browser && try_cache) {
+            if (log_lvl) {
+                console.log(`ae_e_data_store: Caching data store ${code} in localStorage.`);
+            }
+            localStorage.setItem(`ae_ds__${code}`, JSON.stringify(ae_ds_tmp));
+        } else {
+            // console.log(`ae_e_data_store: Not in browser. Not caching.`);
+        }
+    })
+    .catch(function (error) {
+        console.log(`Something went wrong. for code ${code}`);
+        console.log(error);
+        ds_loading_status = '-- error --';
+        return false;
+    });
+    // .finally(function (ds_val_result) {
+        // console.log(`ae_ ds_code_val = `, ds_val_result);
+
+        // ae_ds_loc.set(ds_val_result);
+        // localStorage.setItem(ds_code, ds_val_result);
+        // sessionStorage.setItem(ds_code, ds_val_result);
+
+        // return ds_val_result;
+    // });
+    // console.log(`ae_ ds_code_val = `, ds_code_val);
+}
+
+
+async function handle_submit_form(event: any) {
+    // console.log('*** handle_submit_form() ***');
+
+    $ae_sess.ds.submit_status = 'processing';
+
+
+    // Data in
+    let form_data = new FormData(event.target);
+    // console.log(form_data);
+
+    let data_store_di: key_val = ae_util.extract_prefixed_form_data({prefix: null, form_data: form_data, trim_values: true, bool_tf_str: true, log_lvl: 0});
+    // console.log(data_store_di);
+
+    // Data out
+    let data_store_do: key_val = {};
+
+    if (typeof data_store_di.ds_id_random !== 'undefined') {
+        data_store_do['data_store_id_random'] = data_store_di.ds_id_random;
+    }
+
+    // if (!$slct.data_store_id) {
+    if (!ae_ds_tmp.id) {
+        data_store_do['account_id_random'] = $ae_loc.account_id;
+    }
+
+    if (typeof data_store_di.ds_account_id !== 'undefined' && data_store_di.ds_account_id && data_store_di.ds_use_account_id) {
+        data_store_do['account_id_random'] = data_store_di.ds_account_id;
+    } else if (data_store_di.ds_use_account_id && $ae_loc.account_id) {
+        data_store_do['account_id_random'] = $ae_loc.account_id;
+    } else {
+        data_store_do['account_id_random'] = null;
+    }
+
+    if (typeof data_store_di.ds_code !== 'undefined') {
+        data_store_do['code'] = data_store_di.ds_code;
+    } else {
+        data_store_do['code'] = ds_code;
+    }
+
+    if (typeof data_store_di.ds_name !== 'undefined') {
+        data_store_do['name'] = data_store_di.ds_name;
+    } else {
+        data_store_do['name'] = ds_name;
+    }
+
+    if (typeof data_store_di.ds_type !== 'undefined') {
+        data_store_do['type'] = data_store_di.ds_type;
+    } else {
+        data_store_do['type'] = ds_type;
+    }
+
+    if (typeof data_store_di.ds_for_type !== 'undefined' && data_store_di.ds_for_type) {
+        data_store_do['for_type'] = data_store_di.ds_for_type;
+    } else {
+        data_store_do['for_type'] = null;
+    }
+
+    if (typeof data_store_di.ds_for_id !== 'undefined' && data_store_di.ds_for_id) {
+        data_store_do['for_id_random'] = data_store_di.ds_for_id;
+    } else {
+        data_store_do['for_id_random'] = null;
+    }
+
+    if (typeof data_store_di.ds_access_read !== 'undefined') {
+        data_store_do['access_read'] = data_store_di.ds_access_read;
+    }
+
+    if (typeof data_store_di.ds_access_write !== 'undefined') {
+        data_store_do['access_write'] = data_store_di.ds_access_write;
+    }
+
+    if (typeof data_store_di.ds_access_delete !== 'undefined') {
+        data_store_do['access_delete'] = data_store_di.ds_access_delete;
+    }
+
+    if (typeof data_store_di.ds_value !== 'undefined') {
+        if (data_store_di.ds_type == 'html') {
+            data_store_do['text'] = data_store_di.ds_value;
+        } else if (data_store_di.ds_type == 'json') {
+            data_store_do['json'] = data_store_di.ds_value;
+        } else if (data_store_di.ds_type == 'md') {
+            data_store_do['text'] = data_store_di.ds_value;
+        } else if (data_store_di.ds_type == 'sql') {
+            data_store_do['text'] = data_store_di.ds_value;
+        } else {
+            data_store_do['text'] = data_store_di.ds_value;
+        }
+    }
+
+    if (typeof data_store_di.ds_enable !== 'undefined') {
+        data_store_do['enable'] = data_store_di.ds_enable;
+    } else {
+        data_store_do['enable'] = true;
+    }
+
+    console.log(data_store_do);
+
+    if (!ae_ds_tmp.id) {
+        // Create
+        console.log(`ae_ Data Store Create:`, data_store_do);
+        ds_submit_results = handle_create__data_store({
+        obj_type: 'data_store',
+        data: data_store_do
+        })
+        .then( function (ds_results) {
+            console.log(`ae_ Data Store Create Results:`, ds_results);
+            if (ds_results) {
+                ae_ds_tmp.id = ds_results.data_store_id_random;
+                ae_ds_tmp.updated_on = ds_results.updated_on;
+            }
+            return ds_results;
+        })
+        .finally(function (ds_val_result) {
+            console.log(`ae_ ds_val_result = `, ds_val_result);
+            trigger = 'load__ds__code';
+            $ae_sess.ds.submit_status = 'created';
+        });
+    } else {
+        // Update
+        console.log(`ae_ Data Store Update:`, data_store_do);
+        ds_submit_results = handle_update__data_store({
+        obj_type: 'data_store',
+        obj_id: ae_ds_tmp.id,
+        data: data_store_do
+        })
+        .then( function (ds_results) {
+            console.log(`ae_ Data Store Update Results:`, ds_results);
+            if (ds_results) {
+                ae_ds_tmp.updated_on = ds_results.updated_on;
+            }
+            return ds_results;
+        // })
+        // .finally(function (ds_val_result) {
+        //     // console.log(`ae_ ds_code_val = `, ds_val_result);
+        })
+        .finally(function () {
+            // console.log(`ae_ ds_val_result = `, ds_val_result);
+            console.log(`ae_ load__ds__code: ${ds_code} ${ds_type} ${for_type} ${for_id} ${try_cache}`);
+            trigger = 'load__ds__code';
+            $ae_sess.ds.submit_status = 'updated';
+        });
+    }
+
+
+}
+
+
+async function handle_create__data_store({
+        obj_type,
+        data
+        }) {
+    console.log('*** handle_create__data_store() ***');
+
+    $ae_sess.ds.create_status = 'starting';
+    ae_promises.api_create__data_store_obj = api.create_ae_obj_crud({
+        api_cfg: $ae_api,
+        obj_type: obj_type,
+        fields: data,
+        key: $ae_api.api_crud_super_key,
+        log_lvl: log_lvl
+        })
+    .then(async function (create__obj_result) {
+        if (!create__obj_result) {
+            console.log('The result was null or false.');
+            return false;
+        }
+        return create__obj_result;
+    })
+    .catch(function (error) {
+        console.log('Something went wrong.');
+        console.log(error);
+        return false;
+    })
+    .finally(function (create__obj_result) {
+        $ae_sess.ds.create_status = 'finished';
+        return create__obj_result;
+    });
+
+    return ae_promises.api_create__data_store_obj;
+}
+
+
+async function handle_update__data_store({
+        obj_type,
+        obj_id,
+        data
+        }) {
+    console.log('*** handle_update__data_store() ***');
+
+    $ae_sess.ds.update_status = 'starting';
+    ae_promises.update__data_store_obj = api.update_ae_obj_id_crud({
+        api_cfg: $ae_api,
+        obj_type: obj_type,
+        obj_id: obj_id,
+        fields: data,
+        key: $ae_api.api_crud_super_key,
+        log_lvl: log_lvl
+        })
+    .then(async function (update__obj_result) {
+        if (!update__obj_result) {
+            console.log('The result was null or false.');
+            return false;
+        }
+        return update__obj_result;
+    })
+    .catch(function (error) {
+        console.log('Something went wrong.');
+        console.log(error);
+        return false;
+    })
+    .finally(function (update__obj_result) {
+        $ae_sess.ds.update_status = 'finished';
+        return update__obj_result;
+    })
+
+    return ae_promises.update__data_store_obj;
+}
+</script>
+
+
+<div
+    class="ae__elem__data_store relative {class_li}"
+    class:hide={hide}
+    >
+{#if ae_ds_tmp}
+
+
+{#if debug || $ae_loc.debug == 'debug'}
+
+    <pre>
+    id: {ae_ds_tmp.id},
+    code: {ae_ds_tmp.code},
+    type: {ae_ds_tmp.type},
+    for_type: {ae_ds_tmp.for_type},
+    for_id: {ae_ds_tmp.for_id},
+    access_read: {ae_ds_tmp.access_read},
+    access_write: {ae_ds_tmp.access_write},
+    access_delete: {ae_ds_tmp.access_delete},
+    name: {ae_ds_tmp.name},
+    html: {ae_ds_tmp.html},
+    json: {ae_ds_tmp.json},
+    md: {ae_ds_tmp.md},
+    text: {ae_ds_tmp.text},
+    updated_on: {ae_ds_tmp.updated_on},
+    </pre>
+
+{/if}
+
+{#if show_edit}
+    <section class="edit z-50">
+    <form
+        class="ae__elem__data_store__form"
+        on:submit|preventDefault={handle_submit_form}
+        >
+
+    <input
+        type="hidden"
+        name="ds_id_random"
+        value={ae_ds_tmp.id}
+        />
+
+    {#if $ae_loc.trusted_access}
+        <label for="ds_use_account_id" class="label text-xs inline">Use Account ID
+        <input
+            type="checkbox"
+            name="ds_use_account_id"
+            class="checkbox"
+            value="true"
+            checked={ae_ds_tmp.account_id ? true : false}
+            />
+        </label>
+    {/if}
+    {#if $ae_loc.manager_access}
+        <input
+            type="text"
+            name="ds_account_id"
+            class="input max-w-48 text-xs"
+            placeholder="Account ID"
+            value={ae_ds_tmp.account_id}
+            />
+
+        <input
+            type="text"
+            name="ds_code"
+            class="input text-xs"
+            placeholder="Data store code"
+            value={ae_ds_tmp.code}
+            required
+            />
+    {/if}
+    {#if $ae_loc.trusted_access}
+        <input
+            type="text"
+            name="ds_name"
+            class="input text-xs"
+            placeholder="Data store name"
+            value={ae_ds_tmp.name}
+            required
+            />
+    {/if}
+    {#if $ae_loc.manager_access}
+        <input
+            type="text"
+            name="ds_type"
+            class="input max-w-48 text-xs"
+            placeholder="Data store type (html, json, md, sql, text)"
+            value={ae_ds_tmp.type}
+            required
+            />
+        <input
+            type="text"
+            name="ds_for_type"
+            class="input max-w-48 text-xs"
+            placeholder="Data store For Type"
+            value={ae_ds_tmp.for_type}
+            />
+        <input
+            type="text"
+            name="ds_for_id"
+            class="input max-w-48 text-xs"
+            placeholder="Data store For ID"
+            value={ae_ds_tmp.for_id}
+            />
+        <input
+            type="text"
+            name="ds_access_read"
+            class="input max-w-48 text-xs"
+            placeholder="Access read"
+            value={ae_ds_tmp.access_read}
+            />
+        <input
+            type="text"
+            name="ds_access_write"
+            class="input max-w-48 text-xs"
+            placeholder="Access write"
+            value={ae_ds_tmp.access_write}
+            />
+        <input
+            type="text"
+            name="ds_access_delete"
+            class="input max-w-48 text-xs"
+            placeholder="Access delete"
+            value={ae_ds_tmp.access_delete}
+            />
+    {:else}
+        Code: {ae_ds_tmp.code}
+        <!-- Name: {ae_ds_tmp.name} -->
+        Type: {ae_ds_tmp.type}
+    {/if}
+
+    <!-- Handle HTML type -->
+    {#if ae_ds_tmp.type == 'html' || ae_ds_tmp.type == null}
+    <textarea
+        name="ds_value"
+        class="textarea type_html font-mono text-sm"
+        cols="75"
+        rows="25"
+        placeholder="Enter the HTML here"
+        >{ae_ds_tmp.type == 'html' && ae_ds_tmp.html ? ae_ds_tmp.html : ''}</textarea>
+    <!-- Handle SQL type -->
+    {:else if ae_ds_tmp.type == 'sql'}
+    <textarea
+        name="ds_value"
+        class="textarea type_sql font-mono text-sm"
+        cols="75"
+        rows="25"
+        placeholder="Enter the SQL here"
+        >{ae_ds_tmp.type == 'sql' && ae_ds_tmp.text ? ae_ds_tmp.text : ''}</textarea>
+
+    <!-- Handle text type -->
+    {:else if ae_ds_tmp.type == 'text'}
+    <textarea
+        name="ds_value"
+        class="textarea type_text"
+        cols="70"
+        rows="10"
+        placeholder="Enter the text here"
+        >{ae_ds_tmp.type == 'text' ? ae_ds_tmp.text : ''}</textarea>
+    {/if}
+    <div class="flex gap-1 justify-center justify-evenly items-center p-1">
+
+    <button
+        type="button"
+        class="btn variant-soft-warning"
+        on:click={() => {
+            if (confirm('Are you sure you want to delete this data store?')) {
+                trigger = 'delete__ds__code';
+                // $slct_trigger = 'delete__ds__code';
+            }
+            show_edit = false;
+            show_view = true;
+        }}
+        >
+        <span class="fas fa-trash mx-1"></span>
+        Delete
+    </button>
+
+    <button
+        type="button"
+        class="btn variant-soft-primary"
+        on:click={() => {
+            show_edit = false;
+            show_view = true;
+        }}
+        >
+        <span class="fas fa-times mx-1"></span>
+        Close
+    </button>
+
+    <button
+        type="submit"
+        class="btn variant-soft-primary"
+        disabled={ds_submit_results instanceof Promise && !ds_submit_results}
+        on:click={() => {
+            trigger = 'save__ds__code';
+            // $slct_trigger = 'save__ds__code';
+        }}
+        >
+        <span class="fas fa-save mx-1"></span>
+        Save
+    </button>
+
+    {#await ds_submit_results}
+        <div class="modal-loading">
+            <span class="fas fa-spinner fa-spin"></span>
+            <span class="loading-text">
+                Saving...
+            </span>
+        </div>
+    {:then ds_submit_results}
+        {#if ds_submit_results}
+        <div>
+            <span class="fas fa-check text-green-500"></span>
+            <span class="saved-text">
+                Saved
+            </span>
+        </div>
+        {/if}
+    {/await}
+
+    <div
+        class="ae_debug"
+        class:hidden={!debug && $ae_loc.debug != 'debug'}
+        >
+    submit: {$ae_sess.ds.submit_status}
+    create: {$ae_sess.ds.create_status}
+    update: {$ae_sess.ds.update_status}
+    </div>
+
+    </div>
+
+    </form>
+    </section>
+{/if}
+
+<!-- {#if mode == 'view'} -->
+
+{#if !ae_ds_tmp.type && !ae_ds_tmp.html && !ae_ds_tmp.json && !ae_ds_tmp.md && !ae_ds_tmp.text}
+    {#if $ae_loc.manager_access}
+        <span class="variant-soft-warning">No data found! Is the data store correct or new?</span>
+    {:else}
+        <!-- <span class="variant-soft">loading</span> -->
+    {/if}
+{/if}
+
+{#if ae_ds_tmp.type == 'html' && ae_ds_tmp.html}
+    {@html ae_ds_tmp.html}
+{:else if ae_ds_tmp.type == 'html'}
+    {#if $ae_loc.manager_access}
+        <span class="variant-soft-warning">No HTML found! Is the data store type correct?</span>
+    {:else}
+        <!-- <span class="variant-soft">loading</span> -->
+    {/if}
+{/if}
+
+{#if ae_ds_tmp.type == 'text' && ae_ds_tmp.text}
+    {ae_ds_tmp.text}
+{:else if ae_ds_tmp.type == 'text'}
+    {#if $ae_loc.manager_access}
+        <span class="variant-soft-warning">No text found! Is the data store type correct?</span>
+    {:else}
+        <!-- <span class="variant-soft">loading</span> -->
+    {/if}
+{/if}
+
+<button
+    type="button"
+    class="ae_btn_edit__ds btn hover:variant-glass-warning text-xs absolute top-0 right-0 opacity-30 hover:opacity-100 transition delay-700 hover:delay-200 m-1 p-1"
+    class:opacity-5={!$ae_loc.manager_access}
+    class:hidden={!show_edit_btn || !$ae_loc.trusted_access}
+    on:dblclick={() => {
+        trigger = 'load__ds__code';
+        show_edit = true;
+        show_view = false;
+    }}
+    title="Double click to edit data store: {ds_code} with {ae_ds_tmp.account_id ? `account ID=${ae_ds_tmp.account_id}` : 'no account ID'}"
+    >
+    <span class="fas fa-edit mx-1"></span>
+    Edit
+</button>
+
+<!-- {/if} -->
+{:else}
+    <!-- Nothing to see yet -->
+{/if}
+
+<!-- Text:
+<pre>
+{val_text}
+</pre> -->
+
+<!-- JSON:
+<pre>
+{val_json}
+</pre> -->
+
+{#await ds_get_results}
+    <div class="modal-loading text-xs absolute bottom-0 left-0 opacity-30 hover:opacity-100 transition delay-700 hover:delay-200">
+        <span class="fas fa-spinner fa-spin"></span>
+        <span class="loading-text">
+            Loading...
+        </span>
+    </div>
+{/await}
+
+<!-- {ds_loading_status} -->
+
+</div>
+
+
+<style lang="postcss">
+/* .ae_btn_edit__ds {
+    opacity: .5;
+} */
+
+/* The section.edit should be above the rest of the content and centered on the page */
+section.edit {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 100;
+    background-color: hsla(0, 0%, 100%, .95);
+    padding: 1rem;
+    border-radius: .5rem;
+    box-shadow: 0 0 1rem hsla(0, 0%, 0%, .5);
+
+    min-width: 80%;
+}
+
+.hide {
+    display: none;
+}
+</style>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index ee489394..63558e76 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -61,7 +61,7 @@ import type { key_val } from '$lib/ae_stores';
 
 import Element_access_type from '$lib/element_access_type.svelte';
 import Element_app_cfg from '$lib/element_app_cfg.svelte';
-import Element_data_store from '$lib/element_data_store.svelte';
+import Element_data_store from '$lib/element_data_store_v2.svelte';
 
 // let account_id = localStorage.getItem('ae_account_id');
 // console.log(`account_id = `, account_id);
@@ -93,33 +93,28 @@ $slct = {
 }
 // console.log(`$slct = `, $slct);
 
+// There should almost always be an event_id set.
 if ($ae_loc?.site_cfg_json.slct__event_id) {
     $events_slct.event_id = $ae_loc.site_cfg_json.slct__event_id;
     $events_loc.event_id = $ae_loc.site_cfg_json.slct__event_id;
 } else if ($events_slct.event_id) {
     // console.log(`Event ID already set:`, $events_slct.event_id);
     $events_loc.event_id = $events_slct.event_id;
-} else if ($ae_loc.default__event_id) {
-    $events_slct.event_id = $ae_loc.default__event_id;
-    $events_loc.event_id = $ae_loc.default__event_id;
 } else {
-    console.log(`No Event ID set.`);
+    console.log(`No Event ID set!`);
 }
 
+// This is mainly for Precon CHOW
 if ($ae_loc.site_cfg_json.slct__sponsorship_cfg_id) {
     $slct.sponsorship_cfg_id = $ae_loc.site_cfg_json.slct__sponsorship_cfg_id;
     $ae_loc.mod.sponsorships.cfg_id = $ae_loc.site_cfg_json.slct__sponsorship_cfg_id;
-} else if ($ae_loc.default__sponsorship_cfg_id) {
-    $slct.sponsorship_cfg_id = $ae_loc.default__sponsorship_cfg_id;
-    $ae_loc.mod.sponsorships.cfg_id = $ae_loc.default__sponsorship_cfg_id;
+} else if ($ae_loc.sponsorship_cfg_id) {
+    $slct.sponsorship_cfg_id = $ae_loc.sponsorship_cfg_id;
+    $ae_loc.mod.sponsorships.cfg_id = $ae_loc.sponsorship_cfg_id;
 } else {
     console.log(`No Sponsorship Config ID set.`);
 }
 
-if (!$ae_loc.user_email) {
-    $ae_loc.user_email = 'test@oneskyit.com';
-}
-
 if (browser) {
     // Waiting until the browser exists.
     if ($ae_loc && $ae_sess && $ae_loc.ver_idb != $ae_sess.ver_idb) {
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index de5deb56..51cfc260 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -161,7 +161,6 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
             ae_loc_init['site_style_href'] = site_domain_results.style_href;
             ae_loc_init['site_google_tracking_id'] = site_domain_results.google_tracking_id;
             ae_loc_init['site_access_code_kv'] = site_domain_results.access_code_kv_json;
-            ae_loc_init['page_access_code_li'] = site_domain_results.access_code_kv_json; // Old style. This is only temporary. Start using site_*_kv version.
             ae_loc_init['site_cfg_json'] = site_domain_results.cfg_json;
 
             console.log(`root layout.ts: Returning account_id = `, site_domain_results.account_id_random);
@@ -183,28 +182,6 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
     }
     // console.log(ae_loc_init);
 
-    // NOTE: We need to wait for the account_id to be returned before we can continue. It is required for the api_cfg.
-    // let ds_type: null|string = 'json';
-    // ds_code = 'hub__page__access_code_li_json';
-    // // console.log(`INFO: ae_ account_id = `, account_id);
-    // // ae_acct['ds'][ds_code]
-    // ds_code_li[ds_code] = await core_func.handle_load_ae_obj_code__data_store({
-    //     api_cfg: ae_api_init,
-    //     code: ds_code,
-    //     data_type: ds_type,
-    //     save_idb: false
-    // })
-    // .then(function (ds_results) {
-    //     if (ds_results) {
-    //         console.log(`ae_ ds_results = `, ds_results);
-    //         return ds_results;
-    //     }
-
-    // }
-    // );
-
-    // ae_loc_init['page_access_code_li'] = ds_code_li['hub__page__access_code_li_json'];
-
     ae_acct['api'] = ae_api_init;
     ae_acct['loc'] = ae_loc_init;
     ae_acct['ds'] = ds_code_li;
@@ -214,11 +191,11 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
         'site_id': ae_loc_init.site_id,
 
         // For events_leads, events_badges, events_speakers
-        'event_id': ae_loc_init.site_cfg_json.slct__event_id,
-        'event_badge_template': ae_loc_init.site_cfg_json.slct__event_badge_template,
+        'event_id': ae_loc_init.site_cfg_json?.slct__event_id,
+        'event_badge_template': ae_loc_init.site_cfg_json?.slct__event_badge_template,
 
         // For sponsorships
-        'sponsorship_cfg_id': ae_loc_init.site_cfg_json.slct__sponsorship_cfg_id,
+        'sponsorship_cfg_id': ae_loc_init.site_cfg_json?.slct__sponsorship_cfg_id,
     }
     // console.log(`ae_acct = `, ae_acct);
 
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index d6e95cdb..f618faae 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -8,7 +8,7 @@ import { onMount } from 'svelte';
 // import { PUBLIC_TESTING } from '$env/static/public';
 // console.log(`AE Config - +page.svelte PUBLIC_TESTING:`, PUBLIC_TESTING);
 
-import Element_data_store from '$lib/element_data_store.svelte';
+import Element_data_store from '$lib/element_data_store_v2.svelte';
 
 // import { api } from '$lib/api';
 import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
diff --git a/src/routes/admin/+layout.svelte b/src/routes/admin/+layout.svelte
index 19a4ca73..3ba3e0ae 100644
--- a/src/routes/admin/+layout.svelte
+++ b/src/routes/admin/+layout.svelte
@@ -35,49 +35,9 @@ $events_slct.event_obj = ae_acct.slct.event_obj;
 
 let ae_promises: key_val = {};
 
-// if (ae_acct.loc.site_cfg_json.slct__event_id) {
-//     $events_slct.event_id = ae_acct.loc.site_cfg_json.slct__event_id;
-//     $events_loc.event_id = ae_acct.loc.site_cfg_json.slct__event_id;
-// } else if ($events_loc.default__event_id) {
-//     $events_slct.event_id = $events_loc.default__event_id;
-//     $events_loc.event_id = $events_loc.default__event_id;
-// } else if ($events_slct.event_id) {
-//     console.log(`Event ID already set:`, $events_slct.event_id);
-//     $events_loc.event_id = $events_slct.event_id;
-// } else {
-//     console.log(`No Event ID set.`);
-// }
-
-// if ($events_slct.event_id) {
-//     $events_trigger = 'load__event_obj';
-// }
-
-
-// Updated 2024-03-06
-// $: if ($events_trigger == 'load__event_obj' && $events_slct.event_id) {
-//     console.log(`$events_slct.event_id=${$events_slct.event_id}`);
-//     $events_trigger = null;
-
-//     let load_obj_results = handle_load_ae_obj_id__event({event_id: $events_slct.event_id, try_cache: false})
-//     .then(function (load_obj_results) {
-//         if (load_obj_results) {
-//             console.log(`load_obj_results=`, load_obj_results);
-//         } else {
-//             console.log('No results returned.');
-//         }
-//     });
-//     $events_slct.event_obj = load_obj_results;
-//     console.log(`load_obj_results=`, load_obj_results);
-// }
-
 
 onMount(() => {
     console.log('Admin: +layout.svelte');
-
-    // if (data.url.searchParams.get('event_id')) {
-    //     $events_slct.event_id = data.url.searchParams.get('event_id');
-    //     $events_loc.event_id = data.url.searchParams.get('event_id');
-    // }
 });
 
 // Updated 2024-03-06
diff --git a/src/routes/events_badges/+layout.svelte b/src/routes/events_badges/+layout.svelte
index 72902d02..180de1d5 100644
--- a/src/routes/events_badges/+layout.svelte
+++ b/src/routes/events_badges/+layout.svelte
@@ -31,23 +31,6 @@ $events_slct.event_obj = ae_acct.slct.event_obj;
 
 let ae_promises: key_val = {};
 
-// if (ae_acct.loc.site_cfg_json.slct__event_id) {
-//     $events_slct.event_id = ae_acct.loc.site_cfg_json.slct__event_id;
-//     $events_loc.event_id = ae_acct.loc.site_cfg_json.slct__event_id;
-// } else if ($events_loc.default__event_id) {
-//     $events_slct.event_id = $events_loc.default__event_id;
-//     $events_loc.event_id = $events_loc.default__event_id;
-// } else if ($events_slct.event_id) {
-//     console.log(`Event ID already set:`, $events_slct.event_id);
-//     $events_loc.event_id = $events_slct.event_id;
-// } else {
-//     console.log(`No Event ID set.`);
-// }
-
-// if ($events_slct.event_id) {
-//     $events_trigger = 'load__event_obj';
-// }
-
 
 // Updated 2024-03-06
 // $: if ($events_trigger == 'load__event_obj' && $events_slct.event_id) {
diff --git a/src/routes/events_badges/review/+page.svelte b/src/routes/events_badges/review/+page.svelte
index b2302b2f..3f1d4d63 100644
--- a/src/routes/events_badges/review/+page.svelte
+++ b/src/routes/events_badges/review/+page.svelte
@@ -333,7 +333,7 @@ function handle_qr_camera(event) {
 <!-- {#if $ae_loc.ds.hub__page__events_badges__create_info_header} -->
 {#if $ae_loc.iframe}
     <span class="flex flex-row items-center justify-center">
-    <img src={$ae_loc.site_cfg_json.header_image_path} alt="header" class="w-auto max-h-20 m-2" />
+    <img src={$ae_loc.site_cfg_json?.header_image_path} alt="header" class="w-auto max-h-20 m-2" />
     <h1 class="h3 text-center m-2">Review &amp; Print<br>Your Badge</h1>
     </span>
 {:else}
diff --git a/src/routes/events_badges/stats/+page.svelte b/src/routes/events_badges/stats/+page.svelte
index 0e11dd95..ca7a82da 100644
--- a/src/routes/events_badges/stats/+page.svelte
+++ b/src/routes/events_badges/stats/+page.svelte
@@ -340,7 +340,7 @@ function handle_qr_camera(event) {
 <!-- {#if $ae_loc.ds.hub__page__events_badges__create_info_header} -->
 {#if $ae_loc.iframe}
     <span class="flex flex-row items-center justify-center">
-    <img src={$ae_loc.site_cfg_json.header_image_path} alt="header" class="w-auto max-h-20 m-2" />
+    <img src={$ae_loc.site_cfg_json?.header_image_path} alt="header" class="w-auto max-h-20 m-2" />
     <h1 class="h3 text-center m-2">Review &amp; Print<br>Your Badge</h1>
     </span>
 {:else}