Merge branch 'admin-nav-link'

cypress/e2e/adminNavLink.cy.js

@@ -0,0 +1,70 @@
+describe('The admin nav link', () => {
+    beforeEach(() => {
+        cy.exec('npm run db:seed')
+    })
+    afterEach(() => {
+        cy.exec('npm run db:wipe')
+    })
+
+    describe('when logged in as an admin', () => {
+        beforeEach(() => {
+            cy.loginAsAdmin()
+        })
+
+        it('shows the admin link on the home page', () => {
+            cy.visit('/home')
+            cy.get('#admin-link')
+                .should('be.visible')
+                .and('have.attr', 'href', '/admin')
+        })
+
+        it('shows the admin link on the today page', () => {
+            cy.visit('/today')
+            cy.get('#admin-link')
+                .should('be.visible')
+                .and('have.attr', 'href', '/admin')
+        })
+
+        it('shows the admin link on the user texts page', () => {
+            cy.visit('/texts')
+            cy.get('#admin-link')
+                .should('be.visible')
+                .and('have.attr', 'href', '/admin')
+        })
+
+        it('navigates to the admin page when clicked', () => {
+            cy.visit('/home')
+            cy.get('#admin-link').click()
+            cy.url().should('include', '/admin')
+            cy.get('h1').should('contain', 'Admin')
+        })
+    })
+
+    describe('when logged in as a regular user', () => {
+        beforeEach(() => {
+            cy.loginAsUser()
+        })
+
+        it('does not show the admin link on the home page', () => {
+            cy.visit('/home')
+            cy.get('#admin-link').should('not.be.visible')
+        })
+
+        it('does not show the admin link on the today page', () => {
+            cy.visit('/today')
+            cy.get('#admin-link').should('not.be.visible')
+        })
+
+        it('does not show the admin link on the user texts page', () => {
+            cy.visit('/texts')
+            cy.get('#admin-link').should('not.be.visible')
+        })
+
+        it('does not show the admin link on a user text page', () => {
+            cy.intercept('GET', '/api/texts/0').as('getText')
+            cy.visit('/texts/0')
+            cy.wait('@getText')
+            cy.get('#admin-link').should('not.be.visible')
+        })
+    })
+})

public/js/nav.js

@@ -0,0 +1,18 @@
+document.addEventListener('DOMContentLoaded', async () => {
+    const adminLink = document.getElementById('admin-link');
+    if (adminLink === null) {
+        return;
+    }
+
+    const response = await fetch('/api/auth/me', {
+        credentials: 'same-origin',
+    });
+    if (!response.ok) {
+        return;
+    }
+
+    const body = await response.json();
+    if (body.user && body.user.isAdmin === true) {
+        adminLink.hidden = false;
+    }
+});

views/templates/home.php

@@ -17,6 +17,8 @@
                 <a class="btn btn-secondary" href="/today">
                     Today's schedule
                 </a>
+                <a id="admin-link" class="btn btn-secondary"
+                   href="/admin" hidden>Admin</a>
                 <button id="logout" class="btn btn-danger">Logout</button>
             </div>
         </div>
@@ -43,6 +45,7 @@
         </div>
     </div>
     <script src="/js/auth.js"></script>
+    <script src="/js/nav.js"></script>
     <script src="/js/home.js"></script>
 </body>
 </html>

views/templates/today.php

@@ -12,6 +12,8 @@
             <h1>Today</h1>
             <div class="cluster">
                 <a class="btn btn-secondary" href="/home">Home</a>
+                <a id="admin-link" class="btn btn-secondary"
+                   href="/admin" hidden>Admin</a>
                 <button id="logout" class="btn btn-danger">Logout</button>
             </div>
         </div>
@@ -23,6 +25,7 @@
         </p>
     </main>
     <script src="/js/auth.js"></script>
+    <script src="/js/nav.js"></script>
     <script src="/js/today.js"></script>
 </body>
 </html>

views/templates/userText.php

@@ -14,6 +14,8 @@
                 <a class="btn btn-secondary" href="/texts" id="back">
                     My texts
                 </a>
+                <a id="admin-link" class="btn btn-secondary"
+                   href="/admin" hidden>Admin</a>
                 <button id="logout" class="btn btn-danger">Logout</button>
             </div>
         </div>
@@ -22,6 +24,7 @@
         <div id="text-detail" class="node-tree stack"></div>
     </main>
     <script src="/js/auth.js"></script>
+    <script src="/js/nav.js"></script>
     <script src="/js/text.js"></script>
 </body>
 </html>

views/templates/userTexts.php

@@ -14,6 +14,8 @@
                 <a class="btn btn-secondary" href="/home" id="back">
                     Back to Home
                 </a>
+                <a id="admin-link" class="btn btn-secondary"
+                   href="/admin" hidden>Admin</a>
                 <button id="logout" class="btn btn-danger">Logout</button>
             </div>
         </div>
@@ -33,6 +35,7 @@
         </form>
     </main>
     <script src="/js/auth.js"></script>
+    <script src="/js/nav.js"></script>
     <script src="/js/userTexts.js"></script>
 </body>
 </html>