(add) create buttons for when pages are empty

karrioapi · Dec 16, 2023 · 680b223 · 680b223
1 parent d95a214
commit 680b223
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 26 deletions.
diff --git a/apps/dashboard/src/modules/Settings/addresses.tsx b/apps/dashboard/src/modules/Settings/addresses.tsx
@@ -49,7 +49,11 @@ export default function AddressPage(pageProps: any) {
 
         <header className="px-0 pb-0 pt-4 is-flex is-justify-content-space-between">
           <span className="title is-4">Settings</span>
-          <div></div>
+          <div>
+            <button className="button is-primary is-small is-pulled-right" onClick={() => editAddress()}>
+              <span>Create address</span>
+            </button>
+          </div>
         </header>
 
         <div className="tabs">
@@ -89,11 +93,7 @@ export default function AddressPage(pageProps: any) {
 
                 <tr>
                   <td className="is-size-7" colSpan={2}>ADDRESS TEMPLATES</td>
-                  <td className="action pr-0">
-                    <button className="button is-primary is-small is-pulled-right" onClick={() => editAddress()}>
-                      <span>Create address</span>
-                    </button>
-                  </td>
+                  <td className="action pr-0"></td>
                 </tr>
 
                 {query!.data!.address_templates!.edges.map(({ node: template }) => (
@@ -147,8 +147,8 @@ export default function AddressPage(pageProps: any) {
           <div className="card my-6">
 
             <div className="card-content has-text-centered">
-              <p>No address has been added yet.</p>
-              <p>Use the <strong>New Address</strong> button above to add</p>
+              <p>{`There aren't any results for that query.`}</p>
+              <p>{`Create a new address`}</p>
             </div>
 
           </div>}

diff --git a/apps/dashboard/src/modules/Settings/parcels.tsx b/apps/dashboard/src/modules/Settings/parcels.tsx
@@ -50,7 +50,11 @@ export default function ParcelsPage(pageProps: any) {
 
         <header className="px-0 pb-0 pt-4 is-flex is-justify-content-space-between">
           <span className="title is-4">Settings</span>
-          <div></div>
+          <div>
+            <button className="button is-primary is-small is-pulled-right" onClick={() => editParcel()}>
+              <span>Create parcel</span>
+            </button>
+          </div>
         </header>
 
         <div className="tabs">
@@ -89,11 +93,7 @@ export default function ParcelsPage(pageProps: any) {
             <tbody className="templates-table">
               <tr>
                 <td className="is-size-7" colSpan={2}>PARCEL TEMPLATES</td>
-                <td className="action pr-0">
-                  <button className="button is-primary is-small is-pulled-right" onClick={() => editParcel()}>
-                    <span>Create parcel</span>
-                  </button>
-                </td>
+                <td className="action pr-0"></td>
               </tr>
 
               {(parcel_templates?.edges || []).map(({ node: template }) => (
@@ -158,8 +158,8 @@ export default function ParcelsPage(pageProps: any) {
           <div className="card my-6">
 
             <div className="card-content has-text-centered">
-              <p>No parcel has been added yet.</p>
-              <p>Use the <strong>New Parcel</strong> button above to add</p>
+              <p>{`There aren't any results for that query.`}</p>
+              <p>{`Create a new parcel`}</p>
             </div>
 
           </div>}

diff --git a/apps/dashboard/src/modules/Settings/templates.tsx b/apps/dashboard/src/modules/Settings/templates.tsx
@@ -42,7 +42,11 @@ export default function TemplatesPage(pageProps: any) {
 
         <header className="px-0 pb-0 pt-4 is-flex is-justify-content-space-between">
           <span className="title is-4">Settings</span>
-          <div></div>
+          <div>
+            <AppLink className="button is-primary is-small is-pulled-right" href="/settings/template?id=new">
+              <span>Create template</span>
+            </AppLink>
+          </div>
         </header>
 
         <div className="tabs">
@@ -62,12 +66,12 @@ export default function TemplatesPage(pageProps: any) {
                 <span>Addresses</span>
               </AppLink>
             </li>
-            <li className={`is-capitalized has-text-weight-semibold is-active`}>
+            <li className={`is-capitalized has-text-weight-semibold`}>
               <AppLink href="/settings/parcels" shallow={false} prefetch={false}>
                 <span>Parcels</span>
               </AppLink>
             </li>
-            <li className={`is-capitalized has-text-weight-semibold`}>
+            <li className={`is-capitalized has-text-weight-semibold is-active`}>
               <AppLink href="/settings/templates" shallow={false} prefetch={false}>
                 <span>Templates</span>
               </AppLink>
@@ -81,11 +85,7 @@ export default function TemplatesPage(pageProps: any) {
             <tbody className="templates-table">
               <tr>
                 <td className="is-size-7">DOCUMENT TEMPLATES</td>
-                <td className="action pr-0">
-                  <AppLink className="button is-primary is-small is-pulled-right" href="/settings/template?id=new">
-                    <span>Create template</span>
-                  </AppLink>
-                </td>
+                <td className="action pr-0"></td>
               </tr>
 
               {(document_templates?.edges || []).map(({ node: template }) => (
@@ -148,8 +148,8 @@ export default function TemplatesPage(pageProps: any) {
         {(query.isFetched && (document_templates?.edges || [])?.length == 0) && <div className="card my-6">
 
           <div className="card-content has-text-centered">
-            <p>No template has been added yet.</p>
-            <p>Use the <strong>Create Template</strong> button above to add</p>
+            <p>{`There aren't any results for that query.`}</p>
+            <p>{`Create a new template`}</p>
           </div>
 
         </div>}