Change inner paragraph in InfoCard to div (#2040)

Author: hasparus

.changeset/rich-socks-decide.md

@@ -0,0 +1,5 @@
+---
+"@theguild/components": patch
+---
+
+Change inner paragraph in InfoCard to div

packages/components/src/components/info-card.tsx

@@ -20,7 +20,7 @@ export function InfoCard({
     <Root className={cn('bg-beige-100 p-6 md:p-12', className)} {...rest}>
       <Stud>{icon}</Stud>
       <h3 className="mt-4 text-xl font-medium leading-[1.4] text-green-1000 md:mt-6">{heading}</h3>
-      <p className="mt-2 text-green-800 md:mt-4">{children}</p>
+      <div className="mt-2 space-y-2 text-green-800 md:mt-4">{children}</div>
     </Root>
   );
 }

packages/og-image/global.d.ts

@@ -1,7 +1,9 @@
+import { toMatchImageSnapshot } from 'jest-image-snapshot';
+
 declare global {
   namespace jest {
     interface Matchers<R> {
-      toMatchImageSnapshot(): R;
+      toMatchImageSnapshot(options?: Parameters<typeof toMatchImageSnapshot>[0]): R;
     }
   }
 }

packages/og-image/package.json

@@ -6,6 +6,7 @@
     "deploy": "wrangler publish",
     "postinstall": "tsx ../../scripts/copy-wasm.ts",
     "start": "NODE_ENV=development wrangler dev",
+    "test": "pnpm -w test packages/og-image",
     "types:check": "tsc --noEmit"
   },
   "dependencies": {

packages/og-image/src/__image_snapshots__/handler-test-ts-handler-should-work-1-snap.png

@@ -9,25 +9,36 @@ vi.mock('../vender/index_bg.wasm', async () => {
 });
 
 describe('handler()', () => {
-  it('should works', async () => {
+  it('should work', async () => {
     const response = await handler({
       url: 'http://localhost:3000?product=CONDUCTOR',
     } as Request);
     const result = Buffer.from(await response.arrayBuffer());
-    expect(result).toMatchImageSnapshot();
+    expect(result).toMatchImageSnapshot({
+      failureThresholdType: 'percent',
+      failureThreshold: 0.2,
+    });
   });
+
   it('should align title and have container padding', async () => {
     const response = await handler({
       url: 'http://localhost:3000?product=ESLINT&title=Hello this is a test of really really really really really really long title',
     } as Request);
     const result = Buffer.from(await response.arrayBuffer());
-    expect(result).toMatchImageSnapshot();
+    expect(result).toMatchImageSnapshot({
+      failureThresholdType: 'percent',
+      failureThreshold: 0.2,
+    });
   });
+
   it('should align title without whitespaces', async () => {
     const response = await handler({
       url: 'http://localhost:3000?product=FETS&title=Home',
     } as Request);
     const result = Buffer.from(await response.arrayBuffer());
-    expect(result).toMatchImageSnapshot();
+    expect(result).toMatchImageSnapshot({
+      failureThresholdType: 'percent',
+      failureThreshold: 0.2,
+    });
   });
 });