From 3587b9149ad981de26a4e0e8e82a66a4cedbb02a Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Thu, 19 Oct 2023 15:40:41 -0700
Subject: [PATCH 1/7] fw-5045, refactor rounded corners on dashboard tiles

- eliminates rogue rounded top-right corner on tile 2
---
 .../DashboardTilesPresentation.js             | 54 ++++++++-----------
 1 file changed, 23 insertions(+), 31 deletions(-)

diff --git a/src/components/DashboardTiles/DashboardTilesPresentation.js b/src/components/DashboardTiles/DashboardTilesPresentation.js
index 471146d5..f8c1185e 100644
--- a/src/components/DashboardTiles/DashboardTilesPresentation.js
+++ b/src/components/DashboardTiles/DashboardTilesPresentation.js
@@ -8,46 +8,38 @@ import RequireAuth from 'common/RequireAuth'
 import { MEMBER } from 'common/constants/roles'
 
 function DashboardTilesPresentation({ tileContent }) {
+  const tileCount = tileContent.length
+  const rowSize = Math.min(tileCount, 4)
+  const topLeft = 0
+  const topRight = Math.min(rowSize - 1, tileCount - 1)
+  const bottomLeft = Math.floor(tileCount / rowSize - 1 / rowSize) * rowSize
+  const bottomRight = tileCount - 1
+
   const tileClass = (index) => {
     const baseClass =
       'relative group bg-white p-5 focus-within:ring-2 focus-within:ring-inset focus-within:ring-secondary'
-    if (tileContent?.length === 1) {
-      return `${baseClass} rounded-lg`
-    }
-    if (
-      (tileContent.length % 3 === 0 && index === 1) ||
-      (tileContent.length % 3 === 0 && index === tileContent.length - 2)
-    ) {
-      return baseClass
-    }
-    if (index === tileContent.length - 2) {
-      return `${baseClass} rounded-bl-lg`
+
+    let tileStyle = baseClass
+    if (index === topLeft) {
+      tileStyle += ' rounded-tl-lg'
     }
-    if (index === tileContent.length - 1) {
-      return `${baseClass} rounded-br-lg`
+    if (index === topRight) {
+      tileStyle += ' rounded-tr-lg'
     }
-    if (index === 0) {
-      return `${baseClass} rounded-tl-lg`
+    if (index === bottomLeft) {
+      tileStyle += ' rounded-bl-lg'
     }
-    if (index === 1) {
-      return `${baseClass} rounded-tr-lg`
+    if (index === bottomRight) {
+      tileStyle += ' rounded-br-lg'
     }
-    return baseClass
-  }
 
-  const gridClass = () => {
-    const numberOfTiles = tileContent?.length
-    switch (numberOfTiles) {
-      case 1:
-        return 'max-w-lg rounded-lg bg-gray-200 overflow-hidden shadow'
-      case 2:
-        return 'divide-y divide-gray-200 sm:divide-y-0 sm:grid sm:grid-cols-2 sm:gap-px rounded-lg bg-gray-200 overflow-hidden shadow'
-      case 3:
-        return 'divide-y divide-gray-200 sm:divide-y-0 sm:grid sm:grid-cols-3 sm:gap-px rounded-lg bg-gray-200 overflow-hidden shadow'
-      default:
-        return 'divide-y divide-gray-200 sm:divide-y-0 sm:grid sm:grid-cols-4 sm:gap-px rounded-lg bg-gray-200 overflow-hidden shadow'
-    }
+    return tileStyle
   }
+
+  const gridClass = () =>
+    tileCount === 1
+      ? 'max-w-lg rounded-lg bg-gray-200 overflow-hidden shadow'
+      : `divide-y divide-gray-200 sm:divide-y-0 sm:grid sm:grid-cols-${rowSize} sm:gap-px rounded-lg bg-gray-200 overflow-hidden shadow`
   return (
     <section id="DashboardTilesPresentation">
       <div className={gridClass()}>

From a372659b93c227e187de60e4af216b38f8ec9c6f Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Thu, 19 Oct 2023 15:54:36 -0700
Subject: [PATCH 2/7] fw-5045, match create/edit dashboard tiles

---
 .../DashboardCreate/DashboardCreateData.js    | 36 +++++-----
 .../DashboardEdit/DashboardEditData.js        | 66 +++++++++++--------
 2 files changed, 58 insertions(+), 44 deletions(-)

diff --git a/src/components/DashboardCreate/DashboardCreateData.js b/src/components/DashboardCreate/DashboardCreateData.js
index bf89ac45..35395ef5 100644
--- a/src/components/DashboardCreate/DashboardCreateData.js
+++ b/src/components/DashboardCreate/DashboardCreateData.js
@@ -23,18 +23,18 @@ function DashboardCreateData() {
       auth: ASSISTANT,
     },
     {
-      icon: 'WebPages',
-      name: 'Create a Custom Page',
-      description: 'Add a new page to your site',
-      href: 'page',
+      icon: 'Speak',
+      name: 'Add a Speaker',
+      description: 'Add a new speaker to your site',
+      href: 'speaker',
       iconColor: 'wordText',
-      auth: LANGUAGE_ADMIN,
+      auth: EDITOR,
     },
     {
-      icon: 'Widget',
-      name: 'Create a Widget',
-      description: "Add a new Widget to your site's collection",
-      href: 'widget',
+      icon: 'Category',
+      name: 'Add a Category',
+      description: 'Add a new category to your dictionary',
+      href: 'category',
       iconColor: 'wordText',
       auth: LANGUAGE_ADMIN,
     },
@@ -55,20 +55,20 @@ function DashboardCreateData() {
       auth: ASSISTANT,
     },
     {
-      icon: 'Category',
-      name: 'Add a Category',
-      description: 'Add a new category to your dictionary',
-      href: 'category',
+      icon: 'WebPages',
+      name: 'Create a Custom Page',
+      description: 'Add a new page to your site',
+      href: 'page',
       iconColor: 'wordText',
       auth: LANGUAGE_ADMIN,
     },
     {
-      icon: 'Speak',
-      name: 'Add a Speaker',
-      description: 'Add a new speaker to your site',
-      href: 'speaker',
+      icon: 'Widget',
+      name: 'Create a Widget',
+      description: "Add a new Widget to your site's collection",
+      href: 'widget',
       iconColor: 'wordText',
-      auth: EDITOR,
+      auth: LANGUAGE_ADMIN,
     },
   ]
   const headerContent = {
diff --git a/src/components/DashboardEdit/DashboardEditData.js b/src/components/DashboardEdit/DashboardEditData.js
index 938b1dac..cfb8c682 100644
--- a/src/components/DashboardEdit/DashboardEditData.js
+++ b/src/components/DashboardEdit/DashboardEditData.js
@@ -1,20 +1,51 @@
 // FPCC
 import { useSiteStore } from 'context/SiteContext'
-import { TYPES, TYPE_DICTIONARY, TYPE_SONG, TYPE_STORY } from 'common/constants'
+import {
+  TYPES,
+  TYPE_WORD,
+  TYPE_PHRASE,
+  TYPE_SONG,
+  TYPE_STORY,
+} from 'common/constants'
 import { EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
 function DashboardEditData() {
   const { site } = useSiteStore()
 
   const tileContent = [
+    {
+      icon: 'Word',
+      name: 'Edit Words',
+      description: 'Edit the words in your dictionary',
+      href: `entries?${TYPES}=${TYPE_WORD}`,
+      iconColor: 'wordText',
+      auth: EDITOR,
+    },
     {
       icon: 'Phrase',
-      name: 'Edit Words and Phrases',
-      description: 'Edit the words and phrases in your dictionary',
-      href: `entries?${TYPES}=${TYPE_DICTIONARY}`,
+      name: 'Edit Phrases',
+      description: 'Edit the phrases in your dictionary',
+      href: `entries?${TYPES}=${TYPE_PHRASE}`,
       iconColor: 'phraseText',
       auth: EDITOR,
     },
+    {
+      icon: 'Speak',
+      name: 'Edit Speakers',
+      description: 'Edit the speakers on your site',
+      href: 'speakers',
+      iconColor: 'storyText',
+      auth: EDITOR,
+    },
+    {
+      icon: 'Categories',
+      name: 'Edit Categories',
+      description:
+        'Edit the categories for words and phrases in your dictionary',
+      href: 'categories',
+      iconColor: 'tertiaryB',
+      auth: LANGUAGE_ADMIN,
+    },
     {
       icon: 'Song',
       name: 'Edit Songs',
@@ -31,14 +62,6 @@ function DashboardEditData() {
       iconColor: 'storyText',
       auth: EDITOR,
     },
-    {
-      icon: 'Home',
-      name: 'Edit Homepage',
-      description: 'Edit the main homepage for your site',
-      href: 'home',
-      iconColor: 'wordText',
-      auth: LANGUAGE_ADMIN,
-    },
     {
       icon: 'WebPages',
       name: 'Edit Custom Pages',
@@ -56,22 +79,13 @@ function DashboardEditData() {
       auth: LANGUAGE_ADMIN,
     },
     {
-      icon: 'Categories',
-      name: 'Edit Categories',
-      description:
-        'Edit the categories for words and phrases in your dictionary',
-      href: 'categories',
-      iconColor: 'tertiaryB',
+      icon: 'Home',
+      name: 'Edit Homepage',
+      description: 'Edit the main homepage for your site',
+      href: 'home',
+      iconColor: 'wordText',
       auth: LANGUAGE_ADMIN,
     },
-    {
-      icon: 'Speak',
-      name: 'Edit Speakers',
-      description: 'Edit the speakers on your site',
-      href: 'speakers',
-      iconColor: 'storyText',
-      auth: EDITOR,
-    },
     {
       icon: 'Alphabet',
       name: 'Edit your Alphabet',

From 4793dcd036364fb311bcabb625e839de540b7313 Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Thu, 19 Oct 2023 16:16:01 -0700
Subject: [PATCH 3/7] consistent tile colours

---
 src/components/DashboardCreate/DashboardCreateData.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/DashboardCreate/DashboardCreateData.js b/src/components/DashboardCreate/DashboardCreateData.js
index 35395ef5..0697c5a4 100644
--- a/src/components/DashboardCreate/DashboardCreateData.js
+++ b/src/components/DashboardCreate/DashboardCreateData.js
@@ -27,7 +27,7 @@ function DashboardCreateData() {
       name: 'Add a Speaker',
       description: 'Add a new speaker to your site',
       href: 'speaker',
-      iconColor: 'wordText',
+      iconColor: 'storyText',
       auth: EDITOR,
     },
     {
@@ -35,7 +35,7 @@ function DashboardCreateData() {
       name: 'Add a Category',
       description: 'Add a new category to your dictionary',
       href: 'category',
-      iconColor: 'wordText',
+      iconColor: 'tertiaryB',
       auth: LANGUAGE_ADMIN,
     },
     {
@@ -59,7 +59,7 @@ function DashboardCreateData() {
       name: 'Create a Custom Page',
       description: 'Add a new page to your site',
       href: 'page',
-      iconColor: 'wordText',
+      iconColor: 'tertiaryA',
       auth: LANGUAGE_ADMIN,
     },
     {
@@ -67,7 +67,7 @@ function DashboardCreateData() {
       name: 'Create a Widget',
       description: "Add a new Widget to your site's collection",
       href: 'widget',
-      iconColor: 'wordText',
+      iconColor: 'songText',
       auth: LANGUAGE_ADMIN,
     },
   ]

From 921ad024a70ac98e4278f84387ecc35de34505e4 Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Tue, 24 Oct 2023 11:29:10 -0700
Subject: [PATCH 4/7] fw-5045, tweak tile order

---
 src/components/Dashboard/DashboardData.js     | 48 ++++++++++++-------
 .../DashboardCreate/DashboardCreateData.js    | 42 ++++++++--------
 .../DashboardEdit/DashboardEditData.js        | 42 ++++++++--------
 3 files changed, 73 insertions(+), 59 deletions(-)

diff --git a/src/components/Dashboard/DashboardData.js b/src/components/Dashboard/DashboardData.js
index 0bb86e80..541f74cc 100644
--- a/src/components/Dashboard/DashboardData.js
+++ b/src/components/Dashboard/DashboardData.js
@@ -3,9 +3,15 @@ import { useParams } from 'react-router-dom'
 // FPCC
 import { useUserStore } from 'context/UserContext'
 import { useSiteStore } from 'context/SiteContext'
-import { ASSISTANT, LANGUAGE_ADMIN, MEMBER } from 'common/constants/roles'
+import {
+  ASSISTANT,
+  EDITOR,
+  LANGUAGE_ADMIN,
+  MEMBER,
+} from 'common/constants/roles'
 import { useMySites } from 'common/dataHooks/useMySites'
 import useLoginLogout from 'common/hooks/useLoginLogout'
+import { TYPES, TYPE_WORD, TYPE_PHRASE } from 'common/constants'
 
 function DashboardData() {
   const { user } = useUserStore()
@@ -30,6 +36,30 @@ function DashboardData() {
   }
 
   const homeTiles = [
+    {
+      icon: 'Word',
+      name: 'Create a Word',
+      description: 'Add a new word to your dictionary',
+      href: 'create/word',
+      iconColor: 'wordText',
+      auth: ASSISTANT,
+    },
+    {
+      icon: 'Phrase',
+      name: 'Create a Phrase',
+      description: 'Add a new phrase to your dictionary',
+      href: 'create/phrase',
+      iconColor: 'phraseText',
+      auth: ASSISTANT,
+    },
+    {
+      icon: 'Phrase',
+      name: 'Edit Words and Phrases',
+      description: 'Edit the words and phrases in your dictionary',
+      href: `entries?${TYPES}=${TYPE_WORD},${TYPE_PHRASE}`,
+      iconColor: 'storyText',
+      auth: EDITOR,
+    },
     {
       icon: 'Widget',
       name: 'Create a Widget',
@@ -54,22 +84,6 @@ function DashboardData() {
       iconColor: 'wordText',
       auth: LANGUAGE_ADMIN,
     },
-    {
-      icon: 'Word',
-      name: 'Create a Word',
-      description: 'Add a new word to your dictionary',
-      href: 'create/word',
-      iconColor: 'wordText',
-      auth: ASSISTANT,
-    },
-    {
-      icon: 'Phrase',
-      name: 'Create a Phrase',
-      description: 'Add a new phrase to your dictionary',
-      href: 'create/phrase',
-      iconColor: 'phraseText',
-      auth: ASSISTANT,
-    },
     {
       icon: 'QuestionCircleSolid',
       name: 'Support',
diff --git a/src/components/DashboardCreate/DashboardCreateData.js b/src/components/DashboardCreate/DashboardCreateData.js
index 0697c5a4..80c8b8ee 100644
--- a/src/components/DashboardCreate/DashboardCreateData.js
+++ b/src/components/DashboardCreate/DashboardCreateData.js
@@ -22,22 +22,6 @@ function DashboardCreateData() {
       iconColor: 'phraseText',
       auth: ASSISTANT,
     },
-    {
-      icon: 'Speak',
-      name: 'Add a Speaker',
-      description: 'Add a new speaker to your site',
-      href: 'speaker',
-      iconColor: 'storyText',
-      auth: EDITOR,
-    },
-    {
-      icon: 'Category',
-      name: 'Add a Category',
-      description: 'Add a new category to your dictionary',
-      href: 'category',
-      iconColor: 'tertiaryB',
-      auth: LANGUAGE_ADMIN,
-    },
     {
       icon: 'Song',
       name: 'Create a Song',
@@ -55,11 +39,19 @@ function DashboardCreateData() {
       auth: ASSISTANT,
     },
     {
-      icon: 'WebPages',
-      name: 'Create a Custom Page',
-      description: 'Add a new page to your site',
-      href: 'page',
-      iconColor: 'tertiaryA',
+      icon: 'Speak',
+      name: 'Add a Speaker',
+      description: 'Add a new speaker to your site',
+      href: 'speaker',
+      iconColor: 'storyText',
+      auth: EDITOR,
+    },
+    {
+      icon: 'Category',
+      name: 'Add a Category',
+      description: 'Add a new category to your dictionary',
+      href: 'category',
+      iconColor: 'tertiaryB',
       auth: LANGUAGE_ADMIN,
     },
     {
@@ -70,6 +62,14 @@ function DashboardCreateData() {
       iconColor: 'songText',
       auth: LANGUAGE_ADMIN,
     },
+    {
+      icon: 'WebPages',
+      name: 'Create a Custom Page',
+      description: 'Add a new page to your site',
+      href: 'page',
+      iconColor: 'tertiaryA',
+      auth: LANGUAGE_ADMIN,
+    },
   ]
   const headerContent = {
     title: 'Create',
diff --git a/src/components/DashboardEdit/DashboardEditData.js b/src/components/DashboardEdit/DashboardEditData.js
index cfb8c682..524f6e15 100644
--- a/src/components/DashboardEdit/DashboardEditData.js
+++ b/src/components/DashboardEdit/DashboardEditData.js
@@ -29,6 +29,22 @@ function DashboardEditData() {
       iconColor: 'phraseText',
       auth: EDITOR,
     },
+    {
+      icon: 'Song',
+      name: 'Edit Songs',
+      description: 'Edit the songs on your site',
+      href: `entries?${TYPES}=${TYPE_SONG}`,
+      iconColor: 'songText',
+      auth: EDITOR,
+    },
+    {
+      icon: 'Story',
+      name: 'Edit Stories',
+      description: 'Edit the stories on your site',
+      href: `entries?${TYPES}=${TYPE_STORY}`,
+      iconColor: 'storyText',
+      auth: EDITOR,
+    },
     {
       icon: 'Speak',
       name: 'Edit Speakers',
@@ -47,20 +63,12 @@ function DashboardEditData() {
       auth: LANGUAGE_ADMIN,
     },
     {
-      icon: 'Song',
-      name: 'Edit Songs',
-      description: 'Edit the songs on your site',
-      href: `entries?${TYPES}=${TYPE_SONG}`,
+      icon: 'Widget',
+      name: 'Edit Widgets',
+      description: 'Manage and edit the Widgets on your site',
+      href: 'widgets',
       iconColor: 'songText',
-      auth: EDITOR,
-    },
-    {
-      icon: 'Story',
-      name: 'Edit Stories',
-      description: 'Edit the stories on your site',
-      href: `entries?${TYPES}=${TYPE_STORY}`,
-      iconColor: 'storyText',
-      auth: EDITOR,
+      auth: LANGUAGE_ADMIN,
     },
     {
       icon: 'WebPages',
@@ -70,14 +78,6 @@ function DashboardEditData() {
       iconColor: 'tertiaryA',
       auth: LANGUAGE_ADMIN,
     },
-    {
-      icon: 'Widget',
-      name: 'Edit Widgets',
-      description: 'Manage and edit the Widgets on your site',
-      href: 'widgets',
-      iconColor: 'songText',
-      auth: LANGUAGE_ADMIN,
-    },
     {
       icon: 'Home',
       name: 'Edit Homepage',

From d5e9799c037de1416f42ba0db092f4b2891f0178 Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Tue, 24 Oct 2023 11:36:31 -0700
Subject: [PATCH 5/7] fix url

---
 src/components/Dashboard/DashboardData.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Dashboard/DashboardData.js b/src/components/Dashboard/DashboardData.js
index 541f74cc..18e76d0c 100644
--- a/src/components/Dashboard/DashboardData.js
+++ b/src/components/Dashboard/DashboardData.js
@@ -56,7 +56,7 @@ function DashboardData() {
       icon: 'Phrase',
       name: 'Edit Words and Phrases',
       description: 'Edit the words and phrases in your dictionary',
-      href: `entries?${TYPES}=${TYPE_WORD},${TYPE_PHRASE}`,
+      href: `edit/entries?${TYPES}=${TYPE_WORD},${TYPE_PHRASE}`,
       iconColor: 'storyText',
       auth: EDITOR,
     },

From 92138c3d333118bc0a7d9b29713823f62392775f Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Tue, 24 Oct 2023 12:42:32 -0700
Subject: [PATCH 6/7] fw-5045, reusable dashboard tile definitions

---
 src/components/Dashboard/DashboardData.js     | 57 ++++------------
 .../DashboardCreateContainer.js               |  2 +-
 .../DashboardCreate/DashboardCreateData.js    | 56 +++++++++++-----
 .../DashboardEdit/DashboardEditContainer.js   |  2 +-
 .../DashboardEdit/DashboardEditData.js        | 66 ++++++++++++-------
 5 files changed, 95 insertions(+), 88 deletions(-)

diff --git a/src/components/Dashboard/DashboardData.js b/src/components/Dashboard/DashboardData.js
index 18e76d0c..d4cce973 100644
--- a/src/components/Dashboard/DashboardData.js
+++ b/src/components/Dashboard/DashboardData.js
@@ -3,15 +3,12 @@ import { useParams } from 'react-router-dom'
 // FPCC
 import { useUserStore } from 'context/UserContext'
 import { useSiteStore } from 'context/SiteContext'
-import {
-  ASSISTANT,
-  EDITOR,
-  LANGUAGE_ADMIN,
-  MEMBER,
-} from 'common/constants/roles'
+import { EDITOR, LANGUAGE_ADMIN, MEMBER } from 'common/constants/roles'
 import { useMySites } from 'common/dataHooks/useMySites'
 import useLoginLogout from 'common/hooks/useLoginLogout'
 import { TYPES, TYPE_WORD, TYPE_PHRASE } from 'common/constants'
+import DashboardEditData from 'components/DashboardEdit/DashboardEditData'
+import DashboardCreateData from 'components/DashboardCreate/DashboardCreateData'
 
 function DashboardData() {
   const { user } = useUserStore()
@@ -35,23 +32,12 @@ function DashboardData() {
     sites: userSitesData,
   }
 
+  const { createTiles } = DashboardCreateData('create')
+  const { editTiles } = DashboardEditData('edit')
+
   const homeTiles = [
-    {
-      icon: 'Word',
-      name: 'Create a Word',
-      description: 'Add a new word to your dictionary',
-      href: 'create/word',
-      iconColor: 'wordText',
-      auth: ASSISTANT,
-    },
-    {
-      icon: 'Phrase',
-      name: 'Create a Phrase',
-      description: 'Add a new phrase to your dictionary',
-      href: 'create/phrase',
-      iconColor: 'phraseText',
-      auth: ASSISTANT,
-    },
+    createTiles.WORD,
+    createTiles.PHRASE,
     {
       icon: 'Phrase',
       name: 'Edit Words and Phrases',
@@ -60,30 +46,9 @@ function DashboardData() {
       iconColor: 'storyText',
       auth: EDITOR,
     },
-    {
-      icon: 'Widget',
-      name: 'Create a Widget',
-      description: "Add a new Widget to your site's collection",
-      href: 'create/widget',
-      iconColor: 'wordText',
-      auth: LANGUAGE_ADMIN,
-    },
-    {
-      icon: 'WebPages',
-      name: 'Custom Pages',
-      description: 'Manage all custom pages on your site',
-      href: 'edit/pages',
-      iconColor: 'phraseText',
-      auth: LANGUAGE_ADMIN,
-    },
-    {
-      icon: 'Home',
-      name: 'Edit Your Homepage',
-      description: 'Edit the main homepage for your site',
-      href: 'edit/home',
-      iconColor: 'wordText',
-      auth: LANGUAGE_ADMIN,
-    },
+    createTiles.WIDGET,
+    editTiles.PAGES,
+    editTiles.HOMEPAGE,
     {
       icon: 'QuestionCircleSolid',
       name: 'Support',
diff --git a/src/components/DashboardCreate/DashboardCreateContainer.js b/src/components/DashboardCreate/DashboardCreateContainer.js
index 7d87b848..d2305492 100644
--- a/src/components/DashboardCreate/DashboardCreateContainer.js
+++ b/src/components/DashboardCreate/DashboardCreateContainer.js
@@ -17,7 +17,7 @@ import { TYPE_PHRASE, TYPE_WORD } from 'common/constants'
 import { ASSISTANT, EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
 function DashboardCreateContainer() {
-  const { tileContent, headerContent, site } = DashboardCreateData()
+  const { tileContent, headerContent, site } = DashboardCreateData('')
   return (
     <div id="DashboardCreateContainer">
       <Routes>
diff --git a/src/components/DashboardCreate/DashboardCreateData.js b/src/components/DashboardCreate/DashboardCreateData.js
index 80c8b8ee..42f9bfaf 100644
--- a/src/components/DashboardCreate/DashboardCreateData.js
+++ b/src/components/DashboardCreate/DashboardCreateData.js
@@ -2,74 +2,93 @@
 import { useSiteStore } from 'context/SiteContext'
 import { ASSISTANT, EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
-function DashboardCreateData() {
+function DashboardCreateData(urlPrefix = '') {
   const { site } = useSiteStore()
 
-  const tileContent = [
-    {
+  function addUrlPrefix(href) {
+    if (!urlPrefix) {
+      return href
+    }
+
+    return [urlPrefix, href].join('/')
+  }
+
+  const createTiles = {
+    WORD: {
       icon: 'Word',
       name: 'Create a Word',
       description: 'Add a new word to your dictionary',
-      href: 'word',
+      href: addUrlPrefix('word'),
       iconColor: 'wordText',
       auth: ASSISTANT,
     },
-    {
+    PHRASE: {
       icon: 'Phrase',
       name: 'Create a Phrase',
       description: 'Add a new phrase to your dictionary',
-      href: 'phrase',
+      href: addUrlPrefix('phrase'),
       iconColor: 'phraseText',
       auth: ASSISTANT,
     },
-    {
+    SONG: {
       icon: 'Song',
       name: 'Create a Song',
       description: 'Add a new song to your site',
-      href: 'song',
+      href: addUrlPrefix('song'),
       iconColor: 'songText',
       auth: ASSISTANT,
     },
-    {
+    STORY: {
       icon: 'Story',
       name: 'Create a Story',
       description: 'Add a new story to your site',
-      href: 'story',
+      href: addUrlPrefix('story'),
       iconColor: 'storyText',
       auth: ASSISTANT,
     },
-    {
+    SPEAKER: {
       icon: 'Speak',
       name: 'Add a Speaker',
       description: 'Add a new speaker to your site',
-      href: 'speaker',
+      href: addUrlPrefix('speaker'),
       iconColor: 'storyText',
       auth: EDITOR,
     },
-    {
+    CATEGORY: {
       icon: 'Category',
       name: 'Add a Category',
       description: 'Add a new category to your dictionary',
-      href: 'category',
+      href: addUrlPrefix('category'),
       iconColor: 'tertiaryB',
       auth: LANGUAGE_ADMIN,
     },
-    {
+    WIDGET: {
       icon: 'Widget',
       name: 'Create a Widget',
       description: "Add a new Widget to your site's collection",
-      href: 'widget',
+      href: addUrlPrefix('widget'),
       iconColor: 'songText',
       auth: LANGUAGE_ADMIN,
     },
-    {
+    PAGE: {
       icon: 'WebPages',
       name: 'Create a Custom Page',
       description: 'Add a new page to your site',
-      href: 'page',
+      href: addUrlPrefix('page'),
       iconColor: 'tertiaryA',
       auth: LANGUAGE_ADMIN,
     },
+  }
+
+  const tileContent = [
+    createTiles.WORD,
+    createTiles.PHRASE,
+    createTiles.SONG,
+    createTiles.STORY,
+    createTiles.SPEAKER,
+    createTiles.CATEGORY,
+    createTiles.WIDGET,
+    createTiles.PAGE,
   ]
   const headerContent = {
     title: 'Create',
@@ -81,6 +100,7 @@ function DashboardCreateData() {
     headerContent,
     site,
     tileContent,
+    createTiles,
   }
 }
 
diff --git a/src/components/DashboardEdit/DashboardEditContainer.js b/src/components/DashboardEdit/DashboardEditContainer.js
index 6fc4d0a2..e8b06292 100644
--- a/src/components/DashboardEdit/DashboardEditContainer.js
+++ b/src/components/DashboardEdit/DashboardEditContainer.js
@@ -27,7 +27,7 @@ import DashboardWidgets from 'components/DashboardWidgets'
 import { EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
 function DashboardEditContainer() {
-  const { tileContent, headerContent, site } = DashboardEditData()
+  const { tileContent, headerContent, site } = DashboardEditData('')
   return (
     <div id="DashboardEditContainer">
       <Routes>
diff --git a/src/components/DashboardEdit/DashboardEditData.js b/src/components/DashboardEdit/DashboardEditData.js
index 524f6e15..9ca8ac66 100644
--- a/src/components/DashboardEdit/DashboardEditData.js
+++ b/src/components/DashboardEdit/DashboardEditData.js
@@ -9,92 +9,113 @@ import {
 } from 'common/constants'
 import { EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
-function DashboardEditData() {
+function DashboardEditData(urlPrefix = '') {
   const { site } = useSiteStore()
 
-  const tileContent = [
-    {
+  function addUrlPrefix(href) {
+    if (!urlPrefix) {
+      return href
+    }
+
+    return [urlPrefix, href].join('/')
+  }
+
+  const editTiles = {
+    WORDS: {
       icon: 'Word',
       name: 'Edit Words',
       description: 'Edit the words in your dictionary',
-      href: `entries?${TYPES}=${TYPE_WORD}`,
+      href: addUrlPrefix(`entries?${TYPES}=${TYPE_WORD}`),
       iconColor: 'wordText',
       auth: EDITOR,
     },
-    {
+    PHRASES: {
       icon: 'Phrase',
       name: 'Edit Phrases',
       description: 'Edit the phrases in your dictionary',
-      href: `entries?${TYPES}=${TYPE_PHRASE}`,
+      href: addUrlPrefix(`entries?${TYPES}=${TYPE_PHRASE}`),
       iconColor: 'phraseText',
       auth: EDITOR,
     },
-    {
+    SONGS: {
       icon: 'Song',
       name: 'Edit Songs',
       description: 'Edit the songs on your site',
-      href: `entries?${TYPES}=${TYPE_SONG}`,
+      href: addUrlPrefix(`entries?${TYPES}=${TYPE_SONG}`),
       iconColor: 'songText',
       auth: EDITOR,
     },
-    {
+    STORIES: {
       icon: 'Story',
       name: 'Edit Stories',
       description: 'Edit the stories on your site',
-      href: `entries?${TYPES}=${TYPE_STORY}`,
+      href: addUrlPrefix(`entries?${TYPES}=${TYPE_STORY}`),
       iconColor: 'storyText',
       auth: EDITOR,
     },
-    {
+    SPEAKERS: {
       icon: 'Speak',
       name: 'Edit Speakers',
       description: 'Edit the speakers on your site',
-      href: 'speakers',
+      href: addUrlPrefix('speakers'),
       iconColor: 'storyText',
       auth: EDITOR,
     },
-    {
+    CATEGORIES: {
       icon: 'Categories',
       name: 'Edit Categories',
       description:
         'Edit the categories for words and phrases in your dictionary',
-      href: 'categories',
+      href: addUrlPrefix('categories'),
       iconColor: 'tertiaryB',
       auth: LANGUAGE_ADMIN,
     },
-    {
+    WIDGETS: {
       icon: 'Widget',
       name: 'Edit Widgets',
       description: 'Manage and edit the Widgets on your site',
-      href: 'widgets',
+      href: addUrlPrefix('widgets'),
       iconColor: 'songText',
       auth: LANGUAGE_ADMIN,
     },
-    {
+    PAGES: {
       icon: 'WebPages',
       name: 'Edit Custom Pages',
       description: 'Manage and edit the custom pages on your site',
-      href: 'pages',
+      href: addUrlPrefix('pages'),
       iconColor: 'tertiaryA',
       auth: LANGUAGE_ADMIN,
     },
-    {
+    HOMEPAGE: {
       icon: 'Home',
       name: 'Edit Homepage',
       description: 'Edit the main homepage for your site',
-      href: 'home',
+      href: addUrlPrefix('home'),
       iconColor: 'wordText',
       auth: LANGUAGE_ADMIN,
     },
-    {
+    ALPHABET: {
       icon: 'Alphabet',
       name: 'Edit your Alphabet',
       description:
         'Update media and linked content for your alphabet characters',
-      href: 'alphabet',
+      href: addUrlPrefix('alphabet'),
       iconColor: 'primary',
       auth: LANGUAGE_ADMIN,
     },
+  }
+
+  const tileContent = [
+    editTiles.WORDS,
+    editTiles.PHRASES,
+    editTiles.SONGS,
+    editTiles.STORIES,
+    editTiles.SPEAKERS,
+    editTiles.CATEGORIES,
+    editTiles.WIDGETS,
+    editTiles.PAGES,
+    editTiles.HOMEPAGE,
+    editTiles.ALPHABET,
     // Temp. hiding for FW-4514.
     // {
     //   icon: 'Translate',
@@ -115,6 +136,7 @@ function DashboardEditData() {
     headerContent,
     site,
     tileContent,
+    editTiles,
   }
 }
 

From 5aabe76a1e7ba149ec59ba4ce9ec4efc66d47648 Mon Sep 17 00:00:00 2001
From: Sarah Mundy <109107992+sarahfirstvoices@users.noreply.github.com>
Date: Tue, 24 Oct 2023 13:44:59 -0700
Subject: [PATCH 7/7] fw-5045, code review feedback

---
 src/components/Dashboard/DashboardData.js                  | 4 ++--
 src/components/DashboardCreate/DashboardCreateContainer.js | 4 +++-
 src/components/DashboardCreate/DashboardCreateData.js      | 2 +-
 src/components/DashboardEdit/DashboardEditContainer.js     | 4 +++-
 src/components/DashboardEdit/DashboardEditData.js          | 2 +-
 5 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/components/Dashboard/DashboardData.js b/src/components/Dashboard/DashboardData.js
index d4cce973..cb98db74 100644
--- a/src/components/Dashboard/DashboardData.js
+++ b/src/components/Dashboard/DashboardData.js
@@ -32,8 +32,8 @@ function DashboardData() {
     sites: userSitesData,
   }
 
-  const { createTiles } = DashboardCreateData('create')
-  const { editTiles } = DashboardEditData('edit')
+  const { createTiles } = DashboardCreateData({ urlPrefix: 'create' })
+  const { editTiles } = DashboardEditData({ urlPrefix: 'edit' })
 
   const homeTiles = [
     createTiles.WORD,
diff --git a/src/components/DashboardCreate/DashboardCreateContainer.js b/src/components/DashboardCreate/DashboardCreateContainer.js
index d2305492..d0a49732 100644
--- a/src/components/DashboardCreate/DashboardCreateContainer.js
+++ b/src/components/DashboardCreate/DashboardCreateContainer.js
@@ -17,7 +17,9 @@ import { TYPE_PHRASE, TYPE_WORD } from 'common/constants'
 import { ASSISTANT, EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
 function DashboardCreateContainer() {
-  const { tileContent, headerContent, site } = DashboardCreateData('')
+  const { tileContent, headerContent, site } = DashboardCreateData({
+    urlPrefix: '',
+  })
   return (
     <div id="DashboardCreateContainer">
       <Routes>
diff --git a/src/components/DashboardCreate/DashboardCreateData.js b/src/components/DashboardCreate/DashboardCreateData.js
index 42f9bfaf..e0f67c18 100644
--- a/src/components/DashboardCreate/DashboardCreateData.js
+++ b/src/components/DashboardCreate/DashboardCreateData.js
@@ -2,7 +2,7 @@
 import { useSiteStore } from 'context/SiteContext'
 import { ASSISTANT, EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
-function DashboardCreateData(urlPrefix = '') {
+function DashboardCreateData({ urlPrefix = '' }) {
   const { site } = useSiteStore()
 
   function addUrlPrefix(href) {
diff --git a/src/components/DashboardEdit/DashboardEditContainer.js b/src/components/DashboardEdit/DashboardEditContainer.js
index e8b06292..b45faa0a 100644
--- a/src/components/DashboardEdit/DashboardEditContainer.js
+++ b/src/components/DashboardEdit/DashboardEditContainer.js
@@ -27,7 +27,9 @@ import DashboardWidgets from 'components/DashboardWidgets'
 import { EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
 function DashboardEditContainer() {
-  const { tileContent, headerContent, site } = DashboardEditData('')
+  const { tileContent, headerContent, site } = DashboardEditData({
+    urlPrefix: '',
+  })
   return (
     <div id="DashboardEditContainer">
       <Routes>
diff --git a/src/components/DashboardEdit/DashboardEditData.js b/src/components/DashboardEdit/DashboardEditData.js
index 9ca8ac66..7c88ceef 100644
--- a/src/components/DashboardEdit/DashboardEditData.js
+++ b/src/components/DashboardEdit/DashboardEditData.js
@@ -9,7 +9,7 @@ import {
 } from 'common/constants'
 import { EDITOR, LANGUAGE_ADMIN } from 'common/constants/roles'
 
-function DashboardEditData(urlPrefix = '') {
+function DashboardEditData({ urlPrefix = '' }) {
   const { site } = useSiteStore()
 
   function addUrlPrefix(href) {