Fix assorted small errors (#245)

src/common/components/atoms/card.tsx

@@ -48,7 +48,7 @@ const CardDescription = React.forwardRef<
   HTMLParagraphElement,
   React.HTMLAttributes<HTMLParagraphElement>
 >(({ className, ...props }, ref) => (
-  <p
+  <div
     ref={ref}
     className={mergeClasses("text-sm text-muted-foreground", className)}
     {...props}

src/fidgets/farcaster/components/CastRow.tsx

@@ -90,8 +90,12 @@ const CastEmbeds = ({ cast }) => {
     >
       <ErrorBoundary>
         {map(cast.embeds, (embed) => {
-          if (isEmbedUrl(embed)) return renderEmbedForUrl(embed);
-          return renderEmbedForUrl({ castId: embed.cast_id });
+          if (isEmbedUrl(embed))
+            return renderEmbedForUrl({ ...embed, key: embed.url });
+          return renderEmbedForUrl({
+            castId: embed.cast_id,
+            key: embed.cast_id,
+          });
         })}
       </ErrorBoundary>
     </div>

src/fidgets/farcaster/components/Embeds/index.tsx

@@ -15,40 +15,41 @@ export type CastEmbed = {
     fid: number;
     hash: string | Uint8Array;
   };
+  key?: string;
 };
 
-export const renderEmbedForUrl = ({ url, castId }: CastEmbed) => {
+export const renderEmbedForUrl = ({ url, castId, key }: CastEmbed) => {
   if (castId) {
-    return <EmbededCast castId={castId} />;
+    return <EmbededCast castId={castId} key={key} />;
   }
   if (!url) return null;
 
   if (
     url.includes("i.imgur.com") ||
     url.startsWith("https://imagedelivery.net")
   ) {
-    return <WarpcastImage url={url} />;
+    return <WarpcastImage url={url} key={key} />;
   } else if (url.startsWith('"chain:')) {
-    return <OnchainEmbed url={url} />;
+    return <OnchainEmbed url={url} key={key} />;
   } else if (url.startsWith("https://stream.warpcast.com")) {
-    return <VideoEmbed url={url} />;
+    return <VideoEmbed url={url} key={key} />;
   } else if (url.startsWith("https://warpcast.com") && !url.includes("/~/")) {
-    return <EmbededCast url={url} />;
+    return <EmbededCast url={url} key={key} />;
   } else if (
     (url.includes("twitter.com") || url.startsWith("https://x.com")) &&
     url.includes("status/")
   ) {
     const tweetId = url.split("/").pop();
-    return tweetId ? <TweetEmbed tweetId={tweetId} /> : null;
+    return tweetId ? <TweetEmbed tweetId={tweetId} key={key} /> : null;
   } else if (url.startsWith("https://nouns.build")) {
-    return <NounsBuildEmbed url={url} />;
+    return <NounsBuildEmbed url={url} key={key} />;
   } else if (url.includes("paragraph.xyz") || url.includes("pgrph.xyz")) {
-    return <ParagraphXyzEmbed url={url} />;
+    return <ParagraphXyzEmbed url={url} key={key} />;
   } else if (!isImageUrl(url)) {
     // NOTE: Need a better resolver
     // Currently all URLs that aren't otherise caputured try
     // To be frames, including things like youtube videos
-    return <FrameEmbed url={url} showError={false} />;
+    return <FrameEmbed url={url} showError={false} key={key} />;
   } else {
     return null;
   }

src/fidgets/ui/Text.tsx

@@ -3,8 +3,6 @@ import TextInput from "@/common/components/molecules/TextInput";
 import CSSInput from "@/common/components/molecules/CSSInput";
 import ColorSelector from "@/common/components/molecules/ColorSelector";
 import FontSelector from "@/common/components/molecules/FontSelector";
-import BorderSelector from "@/common/components/molecules/BorderSelector";
-import ShadowSelector from "@/common/components/molecules/ShadowSelector";
 import { FidgetArgs, FidgetProperties, FidgetModule } from "@/common/fidgets";
 import ReactMarkdown from "react-markdown";
 import rehypeRaw from "rehype-raw";
@@ -17,7 +15,6 @@ import {
   CardTitle,
   CardDescription,
 } from "@/common/components/atoms/card";
-import { FontFamily, Color } from "@/common/lib/theme";
 import { MarkdownRenderers } from "@/common/lib/utils/markdownRenderers";
 
 export type TextFidgetSettings = {