Merge pull request #2 from IslemMedjahdi/mohammed

Added necessary IDs
IslemMedjahdi · Feb 4, 2023 · e7fda8f · e7fda8f
2 parents c6b4ba3 + 0349eaa
commit e7fda8f
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 35 deletions.
diff --git a/src/components/announcements/add-announcement/PhotosPicker.tsx b/src/components/announcements/add-announcement/PhotosPicker.tsx
@@ -36,7 +36,11 @@ const PhotosPicker: React.FC<Props> = ({ onImageChange }) => {
       </label>
       <div className="mt-2 flex flex-wrap items-center justify-center gap-4 md:justify-start">
         {[0, 1, 2, 3].map((item) => (
-          <div className="w-full max-w-[12rem] grow" key={item}>
+          <div
+            className="w-full max-w-[12rem] grow"
+            key={item}
+            id={`photo-picker-${item}`}
+          >
             <ReactImagePickerEditor
               config={config2}
               imageChanged={async (newDataUri: any) => {

diff --git a/src/components/announcements/posted-announcement/PostedAnnouncementIndex.tsx b/src/components/announcements/posted-announcement/PostedAnnouncementIndex.tsx
@@ -235,46 +235,49 @@ const PostedAnnouncementIndex: React.FC = () => {
             <div className="flex w-full justify-center sm:w-fit sm:justify-start">
               <Link
                 href={ROUTES.ADD_ANNOUNCEMENT.path}
+                id={`route-${ROUTES.ADD_ANNOUNCEMENT.path.replace("/", "")}`}
                 className="rounded-sm bg-blue-primary px-4 py-2 text-sm font-medium text-white transition duration-200 hover:bg-blue-hover"
               >
                 Ajouter une announce
               </Link>
             </div>
           </div>
-          <DataTable
-            columns={columns}
-            data={filteredAnnouncements()}
-            noDataComponent={
-              <div className="flex h-52 flex-col items-center justify-center gap-2">
-                <p className="text-center text-lg font-medium text-gray-800">
-                  {announcements?.length === 0
-                    ? "Vous n'avez pas encore d'annonce, cliquez ici pour ajouter une nouvelle annonce"
-                    : `il n'y a pas d'annonce avec la recherche "${searchText}"`}
-                </p>
-                <Link
-                  href={ROUTES.ADD_ANNOUNCEMENT.path}
-                  className="rounded-sm bg-blue-primary px-4 py-2 text-sm font-medium text-white transition duration-200 hover:bg-blue-hover"
-                >
-                  Ajouter une announce
-                </Link>
-              </div>
-            }
-            customStyles={{
-              headCells: {
-                style: {
-                  fontWeight: 700,
-                  fontFamily: "'Merriweather', sarif",
+          <div id="announcements-table">
+            <DataTable
+              columns={columns}
+              data={filteredAnnouncements()}
+              noDataComponent={
+                <div className="flex h-52 flex-col items-center justify-center gap-2">
+                  <p className="text-center text-lg font-medium text-gray-800">
+                    {announcements?.length === 0
+                      ? "Vous n'avez pas encore d'annonce, cliquez ici pour ajouter une nouvelle annonce"
+                      : `il n'y a pas d'annonce avec la recherche "${searchText}"`}
+                  </p>
+                  <Link
+                    href={ROUTES.ADD_ANNOUNCEMENT.path}
+                    className="rounded-sm bg-blue-primary px-4 py-2 text-sm font-medium text-white transition duration-200 hover:bg-blue-hover"
+                  >
+                    Ajouter une announce
+                  </Link>
+                </div>
+              }
+              customStyles={{
+                headCells: {
+                  style: {
+                    fontWeight: 700,
+                    fontFamily: "'Merriweather', sarif",
+                  },
                 },
-              },
-            }}
-            pagination
-            progressPending={loading}
-            progressComponent={
-              <div className="flex h-52 w-full items-center justify-center dark:bg-slate-800">
-                <Loading />
-              </div>
-            }
-          />
+              }}
+              pagination
+              progressPending={loading}
+              progressComponent={
+                <div className="flex h-52 w-full items-center justify-center dark:bg-slate-800">
+                  <Loading />
+                </div>
+              }
+            />
+          </div>
         </div>
       </div>
     </div>

diff --git a/src/components/layout/header/Header.tsx b/src/components/layout/header/Header.tsx
@@ -38,6 +38,7 @@ const Header = () => {
               currentUser && allowedRoles.includes(currentUser.role) ? (
                 <Link
                   key={index}
+                  id={`route-${path.replace("/", "") || "home"}`}
                   className={`relative text-base font-semibold after:absolute after:top-full after:left-0  after:h-1 after:w-full after:origin-left after:skew-y-1 ${
                     path === router.pathname
                       ? "after:scale-x-100"

diff --git a/src/components/shared/Select.tsx b/src/components/shared/Select.tsx
@@ -35,7 +35,7 @@ const Select: React.FC<Props> = ({
           {required && <span className="text-red-500">*</span>}
         </label>
       )}
-      <div className="w-full text-sm">
+      <div className="w-full text-sm" id={`${label}-select`}>
         <Listbox value={value} onChange={onChange}>
           <div className="relative ">
             <Listbox.Button