diff --git a/src/App.svelte b/src/App.svelte
index 3931250..8310add 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -10,11 +10,10 @@
   let relpermalink = "";
   let protocol = "";
   let title = "Foo bar";
- let hases = [];
- let hasesCandidates = [];
- let frontmatter = {};
- let frontmatterLoaded = false;
- frontmatter["triad"] = [];
+  let hases = [];
+  let hasesCandidates = [];
+  let frontmatter = {};
+  frontmatter["triad"] = [];
   frontmatter["ascriptions"] = [];
   frontmatter["notsand"] = [];
 
@@ -32,8 +31,27 @@
     return Array.from(diff);
   }
 
+  function newTier(fmKeyType, fmKey, fmValue = "") {
+    console.log("newTier", fmKeyType, fmKey);
+    let tiers = [];
+    let candidates = [];
+    METASP[fmKey].tiers.forEach((t) => {
+      if (fmValue.includes(t.file)) {
+        tiers.push(t);
+      } else {
+        candidates.push(t);
+      }
+    });
+    frontmatter[fmKeyType].push({
+      fmKey: fmKey,
+      tiers: tiers,
+      candidates: candidates,
+    });
+    frontmatter = { ...frontmatter };
+  }
+
   function newHasTiers(arrgs) {
-    let [fmKeyType, index, oldFmKey, newFmKey] = arrgs.detail;
+    const [fmKeyType, index, oldFmKey, newFmKey] = arrgs.detail;
     frontmatter[fmKeyType][index] = {
       fmKey: newFmKey,
       tiers: [],
@@ -41,10 +59,11 @@
     };
     hasesCandidates = hasesCandidates.filter((h) => h != newFmKey);
     hasesCandidates = [...hasesCandidates, oldFmKey];
+    toggleNewTriadButton();
   }
 
   function loadHugoPageMetadata(editHash) {
-    var el = document.createElement("script");
+    let el = document.createElement("script");
     el.onload = () => {
       v = repo.content;
       if (v.startsWith("\n")) {
@@ -54,8 +73,8 @@
       relpath = repo.path;
       relpermalink = repo.relpermalink;
       protocol = document.location.protocol.substring(0, 4);
-      let notSelf = Object.entries(METASP).filter(n => n[1].singular == relpath.split("/")[0])[0][0]
-      hases = Object.keys(METASP).filter(k => k != notSelf);
+      const notSelf = Object.entries(METASP).filter((n) => n[1].singular == relpath.split("/")[0])[0][0];
+      hases = Object.keys(METASP).filter((k) => k != notSelf);
       Object.entries(repo.frontmatter).forEach(([fmKey, fmValue]) => {
         let fmKeyType = "";
         if (fmKey.toLowerCase().startsWith("has_")) {
@@ -73,20 +92,7 @@
 
         if (["triad", "ascriptions"].includes(fmKeyType)) {
           if (Array.isArray(fmValue)) {
-            let tiers = [];
-            let candidates = [];
-            METASP[fmKey].tiers.forEach((t) => {
-              if (fmValue.includes(t.file)) {
-                tiers.push(t);
-              } else {
-                  candidates.push(t);
-              }
-            });
-            frontmatter[fmKeyType].push({
-              fmKey: fmKey,
-              tiers: tiers,
-              candidates: candidates,
-            });
+            newTier(fmKeyType, fmKey, fmValue);
           }
         } else if (fmKeyType == "journal") {
           frontmatter["journal"] || (frontmatter["journal"] = []);
@@ -99,25 +105,28 @@
           }
         }
       });
-      hasesCandidates = diffArrr(hases, [
-        ...frontmatter["triad"].map((t) => {
-          return t.fmKey;
-        }),
-        ...frontmatter["ascriptions"].map((t) => {
-          return t.fmKey;
-        }),
-      ]);
-
-      let tkey = Object.keys(repo.frontmatter).filter((t) => t.toLowerCase() == "title")[0];
+      hasesCandidates = reckonHasesCandidates();
+      const tkey = Object.keys(repo.frontmatter).filter((t) => t.toLowerCase() == "title")[0];
       title = repo.frontmatter[tkey];
-      frontmatterLoaded = true;
+
+      toggleNewTriadButton();
     };
     el.src = `../js/repo/${editHash}.js`;
     document.body.appendChild(el);
   }
 
+  function reckonHasesCandidates() {
+    return diffArrr(hases, [
+      ...frontmatter["triad"].map((t) => {
+        return t.fmKey;
+      }),
+      ...frontmatter["ascriptions"].map((t) => {
+        return t.fmKey;
+      }),
+    ]);
+  }
   function addToCandidatesRemoveFromTiers(arrgs) {
-    let [fmKeyType, index, fmKey, tier] = arrgs.detail;
+    const [fmKeyType, index, fmKey, tier] = arrgs.detail;
     frontmatter[fmKeyType][index]["fmKey"] = fmKey;
     frontmatter[fmKeyType][index]["tiers"] = frontmatter[fmKeyType][index]["tiers"].filter(
       (t) => t !== tier
@@ -126,7 +135,7 @@
   }
 
   function addToTiersRemoveFromCandidates(arrgs) {
-    let [fmKeyType, index, , value] = arrgs.detail;
+    const [fmKeyType, index, , value] = arrgs.detail;
     const tier = frontmatter[fmKeyType][index]["candidates"].filter((t) => t.file == value);
     if (tier.length > 0) {
       frontmatter[fmKeyType][index]["tiers"] = [...frontmatter[fmKeyType][index]["tiers"], tier[0]];
@@ -155,37 +164,45 @@
     }
   }
 
- function newFrontmatter() {
-   return Object.entries(frontmatter).filter(val => val[1].length == 0).map(key => key[0])
- }
+  function newFrontmatter() {
+    return Object.entries(frontmatter)
+      .filter((val) => val[1].length == 0)
+      .map((key) => key[0]);
+  }
 
- function checkTriad() {
-   let ct = Object.entries(frontmatter).filter(i => i[1].length == 0 && i[0] == "triad")
-   return ct.length == 0 ? false : true
- }
+  function toggleNewTriadButton() {
+    const ct = Object.entries(frontmatter).filter((i) => i[1].length == 0 && i[0] == "triad");
+    if (document.getElementById("newtier")) {
+      if (ct.length == 0) {
+        document.getElementById("newtier").style.display = "none";
+      } else {
+        document.getElementById("newtier").style.display = "block";
+      }
+    }
+  }
 
- function newTriad() {
-   newHasTiers({"detail": ["triad", 0, "authors", "editors"]})
- }
+  function newTriad() {
+    newHasTiers({ detail: ["triad", 0, "authors", "editors"] });
+  }
 
- function dispatchHash() {
-   var searchParams = new URLSearchParams(location.search);
-   let editHash = searchParams.get('edit')
-   if (editHash) {
-     loadHugoPageMetadata(editHash)
-   } else {
-     let newPage = searchParams.get('new')
-     console.log(newPage)
-   }
- }
+  function dispatchHash() {
+    const searchParams = new URLSearchParams(location.search);
+    const editHash = searchParams.get("edit");
+    if (editHash) {
+      loadHugoPageMetadata(editHash);
+    } else {
+      let newPage = searchParams.get("new");
+      console.log(newPage);
+    }
+  }
 
- onMount(() => {
-   dispatchHash();
-   // loadHugoPageMetadata();
-   console.dir(frontmatter);
- });
+  onMount(() => {
+    dispatchHash();
+    // loadHugoPageMetadata();
+    console.dir(frontmatter);
+  });
 
- $: hashChanged = ()=> dispatchHash();
+  $: hashChanged = () => dispatchHash();
 </script>
 
 <svelte:window on:keyup={keyUp} on:hashchange={hashChanged} />
@@ -224,9 +241,12 @@
           {/if}
         {/each}
       {/each}
-      {#if frontmatterLoaded && checkTriad()}
-        <div on:click="{newTriad}">NEW TRIAD TIER</div>
-      {/if}
+      <div class="buttons news">
+        <div id="newtier" class="button" on:click={newTriad}>NEW TIER</div>
+        <div id="newascription" class="button" on:click={() => newTier("ascriptions", "editors")}>
+          NEW ASCRIPTION
+        </div>
+      </div>
     </span>
     <div class="formgrid">
       <label for="pagecontent">Content:</label>