From 592eab99ae8c4134ee78c5564768f6376cc634ab Mon Sep 17 00:00:00 2001
From: brunoravera <bruno@process.st>
Date: Sat, 2 Mar 2024 12:54:55 -0300
Subject: [PATCH] WIP

---
 .../Patterns/details/pattern-details.tsx      |  6 +++---
 web/src/pages/Patterns/patterns.spec.tsx      | 21 +++++++++++++++----
 web/src/pages/Patterns/patterns.stories.tsx   |  3 +--
 web/src/pages/Patterns/patterns.tsx           |  8 ++++---
 web/src/pages/home/home.spec.tsx              |  4 ++--
 5 files changed, 28 insertions(+), 14 deletions(-)

diff --git a/web/src/pages/Patterns/details/pattern-details.tsx b/web/src/pages/Patterns/details/pattern-details.tsx
index 70bc9ec..0073689 100644
--- a/web/src/pages/Patterns/details/pattern-details.tsx
+++ b/web/src/pages/Patterns/details/pattern-details.tsx
@@ -16,15 +16,15 @@ export const PatternDetails: React.FC = () => {
     <VStack w="full" px="4" aria-label="hey" alignItems="flex-start">
       <Heading as="h2">{pattern.title}</Heading>
       <Text>{pattern.description}</Text>
-      <VStack w="full" justifyContent="center" spacing="2">
+      <VStack w="full" justifyContent="center" spacing="8">
         <VStack alignItems="flex-start">
-          <Text pl="8" mb="-4" fontWeight="bold">
+          <Text pl="8" fontWeight="bold">
             Implementaciones
           </Text>
           <Implementations patternId={pattern.id} />
         </VStack>
         <VStack alignItems="flex-start">
-          <Text pl="8" mb="-4" fontWeight="bold">
+          <Text pl="8" fontWeight="bold">
             Animaciones
           </Text>
           <Animations patternId={pattern.id} />
diff --git a/web/src/pages/Patterns/patterns.spec.tsx b/web/src/pages/Patterns/patterns.spec.tsx
index 8f872b8..06eb91f 100644
--- a/web/src/pages/Patterns/patterns.spec.tsx
+++ b/web/src/pages/Patterns/patterns.spec.tsx
@@ -1,12 +1,25 @@
 import * as RTL from '@redwoodjs/testing/web'
-
-import { Patterns } from '.'
+import { Patterns } from './patterns'
 
 describe('Patterns page', () => {
-  it('renders successfully', () => {
+  it('renders successfully', async () => {
     RTL.render(<Patterns />)
 
     RTL.screen.getByText('Patrones')
-    RTL.screen.getByText(/contenido de patrones/i)
+    // columns
+    RTL.screen.getByText(/titulo/i)
+    RTL.screen.getByText(/descripcion/i)
+    RTL.screen.getByText(/#implementaciones/i)
+
+    // rows
+    RTL.screen.getByText('API Gateway')
+    RTL.screen.getByText(/el patrón de gateway api/i)
+    RTL.screen.getByText('Orquestación de Microservicios')
+    RTL.screen.getByText(/este patrón implica la coordinación/i)
+    RTL.screen.getByText('Service Discovery')
+    RTL.screen.getByText(/en una arquitectura de microservicios/i)
+
+    // caption
+    RTL.screen.getByText('Patrones disponibles')
   })
 })
diff --git a/web/src/pages/Patterns/patterns.stories.tsx b/web/src/pages/Patterns/patterns.stories.tsx
index 5c680d5..06f1941 100644
--- a/web/src/pages/Patterns/patterns.stories.tsx
+++ b/web/src/pages/Patterns/patterns.stories.tsx
@@ -1,6 +1,5 @@
 import type { StoryObj } from '@storybook/react'
-
-import { Patterns } from '.'
+import { Patterns } from './patterns'
 
 export default {
   component: Patterns,
diff --git a/web/src/pages/Patterns/patterns.tsx b/web/src/pages/Patterns/patterns.tsx
index 01c70ca..8b490a1 100644
--- a/web/src/pages/Patterns/patterns.tsx
+++ b/web/src/pages/Patterns/patterns.tsx
@@ -43,9 +43,11 @@ export const Patterns = () => {
           <Tbody>
             {patterns.map((pattern, index) => (
               <Tr key={`pattern-${pattern.title}-${index}`}>
-                <Link to={routes.pattern({ id: pattern.id })}>
-                  <Td>{pattern.title}</Td>
-                </Link>
+                <Td>
+                  <Link to={routes.pattern({ id: pattern.id })}>
+                    {pattern.title}
+                  </Link>
+                </Td>
                 <Td>
                   <Tooltip label={pattern.description} hasArrow>
                     <Text isTruncated maxW="sm">
diff --git a/web/src/pages/home/home.spec.tsx b/web/src/pages/home/home.spec.tsx
index 6870e75..0aa6f7f 100644
--- a/web/src/pages/home/home.spec.tsx
+++ b/web/src/pages/home/home.spec.tsx
@@ -6,9 +6,9 @@ describe('Home page', () => {
   it('renders successfully', () => {
     RTL.render(<Home />)
 
-    RTL.screen.getByText(/welcome to my app/i)
+    RTL.screen.getByText(/Testing de Microservicios/i)
     RTL.screen.getByText(
-      /This is a simple example of how to add content to your app./i
+      /En este lugar se describe lo que hace la aplicacion, el objetivo del proyect, etc.../i
     )
   })
 })
-- 
GitLab