Merge pull request #28 from sheibeck/develop

Develop

Author: sheibeck

src/App.vue

@@ -46,10 +46,9 @@ import { computed, onMounted } from 'vue';
 
 const globalStore = useGlobalStore();
 const route = useRoute();
-const isLogin = computed(() => route.name === "login");
 
-onMounted(() => {
-  globalStore.getUserId();
+onMounted(async () => {
+  await globalStore.getUserId();
 })
 
 const isUserLoggedIn = computed( () => {

src/components/CharacterDetail.vue

@@ -3,6 +3,11 @@
         Loading ...
     </div>
     <div v-else class="character mt-2">
+        <div class="d-print-none d-flex justify-content-center" v-if="isGuest"> 
+            <span class="text-danger">
+                You must <a href="/login">sign in</a> to save characters. While not logged in, data you enter will be lost if you navigate away from this page.
+            </span>
+        </div>
         <div class="gradient-background"></div>
         <div class="page page1" v-if="pageNumber == 1 || isPrinting">
             <div class="sheet-label">
@@ -78,7 +83,7 @@
             </div>
         </div>
 
-        <div class="d-print-none action-bar d-flex justify-content-end border-top p-1 mt-5" v-if="isAuthenticated">
+        <div class="d-print-none action-bar d-flex justify-content-end border-top p-1 mt-5">
             <a href="/characters" type="button" class="btn btn-danger me-2">Close</a>
             <button type="button" class="btn btn-secondary me-2" @click="nextPage()"> View {{ pageLabel }}</button>
             <button type="button" class="btn btn-secondary me-2" @click="printCharacter()">Print</button>
@@ -122,7 +127,11 @@ const userId = ref<null|String>(null);
 const hasOverflowMoves = computed(() => character.value.startingMoves?.filter( (m: any) => m.isOverflow == true).length > 0);
 
 const isOwner = computed(()=> {  
-    return character.value.userId === userId.value || characterId == "new-character";
+    return userId.value !== null && (character.value.userId === userId.value || characterId == "new-character");
+});
+
+const isGuest = computed(()=> {
+  return userId.value == null;
 });
 
 window.onafterprint = function(){

src/main.ts

@@ -10,7 +10,6 @@ import 'bootstrap/dist/js/bootstrap.bundle.min.js';
 import Vue3Toastify, { type ToastContainerOptions } from 'vue3-toastify';
 import { VueShowdownPlugin } from 'vue-showdown';
 
-
 awsconfig.oauth.redirectSignIn = `${window.location.origin}/`;
 awsconfig.oauth.redirectSignOut = `${window.location.origin}/`;
 

src/services/lookupTableService.ts

@@ -8,7 +8,11 @@ const client = generateClient();
 
 export const getProfessions = async() => {
 
-    const { data, errors} = await client.graphql({ query: queries.listProfessions, variables: { limit: 1000 } });
+    const { data, errors} = await client.graphql({ 
+        query: queries.listProfessions, 
+        variables: { limit: 1000 },
+        authMode: 'iam',
+    });
 
     const professions =  await data.listProfessions.items;
 
@@ -23,7 +27,10 @@ export const getProfessions = async() => {
 
 export const getAbilityScores = async() => {
 
-    const { data, errors} = await client.graphql({ query: queries.listAbilityScores});
+    const { data, errors} = await client.graphql({ 
+        query: queries.listAbilityScores,
+        authMode: 'iam',
+    });
 
     return data.listAbilityScores.items.sort((a, b) => (a?.sortOrder ?? 0) - (b?.sortOrder ?? 0));
 }
@@ -39,7 +46,8 @@ export const getProfessionByName = async(name: string) => {
                 }
             },
             limit: 1000,
-        }
+        },
+        authMode: 'iam',
     });
 
     const professsions =  await result.data.listProfessions.items;
@@ -64,7 +72,8 @@ export const getBondsByProfession = async(profession: ProfessionType) => {
                     }
                 },
                 limit: 1000,
-            } 
+            },
+            authMode: 'iam',
         });
 
     return data.listBonds.items;
@@ -79,7 +88,8 @@ export const getMovesByProfession = async(profession: ProfessionType) => {
                     }
                 },
                 limit: 1000, 
-            } 
+            },
+            authMode: 'iam',
         });
 
     return await data.listMoves.items;
@@ -94,7 +104,8 @@ export const getLooksByProfession = async(profession: ProfessionType) => {
                     }
                 } ,
                 limit: 1000,
-            } 
+            },
+            authMode: 'iam', 
         });
 
     return data.listLooks.items;
@@ -109,7 +120,8 @@ export const getAlignmentsByProfession = async(profession: ProfessionType) => {
                     }
                 },
                 limit: 1000,
-            } 
+            },
+            authMode: 'iam',
         });
 
     return data.listAlignments.items;
@@ -124,7 +136,8 @@ export const getRaceByProfession = async(profession: ProfessionType) => {
                     or: [{ profession: { eq: capitalizeWords(profession) } }, { profession: { eq: 'Any' } }]
                 },
                 limit: 1000,
-            }
+            },
+            authMode: 'iam',
         });
 
     return data.listRaces.items;
@@ -139,7 +152,8 @@ export const getStartingGearByProfession = async(profession: ProfessionType) =>
                     and: [{ profession: { eq: capitalizeWords(profession) } }, { isStartingGear: { eq: true } }]
                 },
                 limit: 1000,
-            }
+            },
+            authMode: 'iam',
         });
 
     return data.listGears.items;

src/stores/globalStore.ts

@@ -18,37 +18,29 @@ export const useGlobalStore = defineStore('globalStore', () => {
                 return true;
             }
             else {
-                throw("Not authenticated");
+                //is a guest user
+                throw("guest users not allowed");
             }
 
         }
         catch {
             currentUser.value = null;
-            await router.push({ name: "login" });
+            //await router.push({ name: "login" });
             return false;
         }
 
     };
 
     async function getUserId() {
-        return new Promise<string|null>(async (resolve) => {
-            try {
-                const { username, userId, signInDetails } = await getCurrentUser();
-                currentUser.value = userId;
-                resolve(userId);
-            }
-            catch {
-                try {
-                    const isAuthed = await isAuthenticated();
-                    if (!isAuthed) {
-                        throw("session expired");
-                    }
-                }
-                catch {
-                    await router.push({ name: "login" });
-                }
-            }
-        });
+        try {
+            const { username, userId, signInDetails } = await getCurrentUser();
+            currentUser.value = userId;
+            return userId;
+        }
+        catch {
+            currentUser.value = null;
+            return null;    
+        }
     }
 
     async function signOffUser() {