Merge pull request #227 from chingu-x/fix/resources-spacing-issue

fix/Fix spacing and validation issues
chingu-x · Aug 30, 2024 · ea1780f · ea1780f
2 parents 4c5773f + 96ef471
commit ea1780f
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 21 deletions.
diff --git a/src/app/(main)/my-voyage/[teamId]/voyage-resources/components/ResourceInput.tsx b/src/app/(main)/my-voyage/[teamId]/voyage-resources/components/ResourceInput.tsx
@@ -70,23 +70,20 @@ export default function ResourceInput() {
       className="flex w-full items-center rounded-xl bg-base-200 p-1 shadow-lg"
       onSubmit={handleSubmit(onSubmit)}
     >
-      <div className="m-4 flex w-3/4 flex-col">
+      <div className="mx-4 mb-1 mt-3 flex w-3/4 flex-col">
         <TextInput
           id="url"
           placeholder="Paste your resource link here."
           ariaLabel="link"
-          errorMessage={
-            errors.url?.type === "invalid_string"
-              ? "Must start with https://"
-              : ""
-          }
+          errorMessage={errors.url?.message}
           {...register("url")}
           inputGroupContent={<LinkIcon />}
         />
         <TextInput
           id="title"
           placeholder="Name your resource here."
           ariaLabel="resource name"
+          errorMessage={errors.title?.message}
           {...register("title")}
         />
       </div>

diff --git a/src/app/(main)/my-voyage/[teamId]/voyage-resources/components/ResourcesContainer.tsx b/src/app/(main)/my-voyage/[teamId]/voyage-resources/components/ResourcesContainer.tsx
@@ -49,21 +49,23 @@ export default function ResourcesContainer({ data }: ResourceContainerProps) {
           isDisabled={!voyageResources?.length}
         />
       </div>
-      {formattedResources?.length ? (
-        formattedResources.map((item) => (
-          <ResourceCard
-            key={item.id}
-            resourceId={item.id}
-            title={item.title}
-            user={item.addedBy.member}
-            date={item.date}
-            userId={item.addedBy.member.id}
-            url={item.url}
-          />
-        ))
-      ) : (
-        <EmptyBanner />
-      )}
+      <div className="flex flex-col gap-y-6">
+        {formattedResources?.length ? (
+          formattedResources.map((item) => (
+            <ResourceCard
+              key={item.id}
+              resourceId={item.id}
+              title={item.title}
+              user={item.addedBy.member}
+              date={item.date}
+              userId={item.addedBy.member.id}
+              url={item.url}
+            />
+          ))
+        ) : (
+          <EmptyBanner />
+        )}
+      </div>
     </>
   );
 }