Dashboard: NFT asset page UI updates (#7388)

<!--

## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes"

If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000):

## Notes for the reviewer

Anything important to call out? Be sure to also clarify these in your comments.

## How to test

Unit tests, playground, etc.

-->

<!-- start pr-codex -->

---

## PR-Codex overview
This PR enhances the `TokenInfoUI` component by adding a new claim condition check, improving the UI for displaying NFT purchase availability, and restructuring the layout for better clarity. It also introduces a tabbed interface for viewing traits and purchasing options for ERC1155 tokens.

### Detailed summary
- Added a new check for claim conditions in `TokenInfoUI`.
- Introduced a "Not available for purchase" message when no claim conditions are set.
- Implemented a tabbed interface for ERC1155 tokens to switch between traits and purchase options.
- Reorganized the layout of the NFT details section for improved readability.
- Adjusted spacing in the `BuyEditionDrop` form for consistency.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
	- Introduced a tabbed interface for ERC1155 tokens, allowing users to switch between viewing traits and purchasing options.
	- Added badges displaying token type, token ID, and chain metadata for improved clarity.

- **Improvements**
	- Enhanced handling of claim conditions, now clearly indicating when an NFT is not available for purchase.
	- Refined the display of NFT traits, showing a "No Traits" message if none exist.
	- Updated form and input styling for a cleaner and more consistent appearance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Author: MananTank

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/nft/overview/buy-edition-drop/buy-edition-drop.client.tsx

@@ -184,7 +184,7 @@ export function BuyEditionDrop(props: BuyEditionDropProps) {
 
   return (
     <Form {...form}>
-      <form className="space-y-5" onSubmit={handleSubmit}>
+      <form className="space-y-4" onSubmit={handleSubmit}>
         <FormField
           control={form.control}
           name="amount"
@@ -215,7 +215,7 @@ export function BuyEditionDrop(props: BuyEditionDropProps) {
                       }
                     }
                   }}
-                  className="!text-2xl h-auto bg-muted/50 font-bold"
+                  className="bg-muted/50"
                 />
               </FormControl>
               <FormMessage />

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/nft/overview/nfts-grid.tsx

@@ -282,6 +282,18 @@ function RenderClaimConditionInfo(props: {
     enabled: !props.isSkeleton,
   });
 
+  const noClaimConditionSet = !claimCondition.isPending && !claimCondition.data;
+
+  if (noClaimConditionSet) {
+    return (
+      <div>
+        <p className="text-muted-foreground text-sm">
+          Not available for purchase
+        </p>
+      </div>
+    );
+  }
+
   return (
     <div className="flex flex-col items-start gap-0.5">
       <div className="flex items-center gap-1.5">