The roofstore from rooftopacademy

Hotfix: error en la linea 10 y 11 del componente TextInput

Error de sintaxis en la linea 10 y 11 del componente TextInput

El interprete de javascript al ver un salto de linea después del return asume que debe colocar un ; , por ende retorna undefined y el código de abajo no se ejecuta

Solución

Agregar Parentesis al return

return (
 <input 
     type={type}
     className={className} 
     placeholder={holderText}
  />
)

o hacerlo one line

return <input type={type} className={className} placeholder={holderText} />

Además, debe retornar algo por defecto si no se cumple la condición... puede ser return null

Pagina para confirmar clasificacion del producto

Se muestra un texto de guia para el usuario
Arbol de categorias, hasta 3 niveles
La categoria indicada en negrita
Dos botones de 100% de ancho, uno para aprobar otro para modificar

Crear layout para paginas de ayuda

Incluir el navbar y el footer reutilizando componentes
Nombre del componente: TextPageLayout
Un titulo y el bloque de texto
Solo contiene un buscador (se hace en otro ticket)
Abajo la votacion si fue util o no (se hace en otro ticket)

Crear una vista que sea como la pagina de login de Mercado Libre.

Pagina principal de ayuda

Ej https://www.mercadolibre.com.ar/ayuda#menu-user
Tiene 3 bloques con las principales categorias
Por cada bloque muestra las principales subcategorias de preguntas
Al clickear sobre una opcion redirige al listado de preguntas especificas

Quiero un componente para mostrar un texto de una sola linea

Crear una vista que sea como la pagina de registro de Mercado Libre.

Pagina de Categorias

Crear pagina similar a https://www.mercadolibre.com.ar/categorias

Pagina de defensa del consumidor

Crear pagina siguiendo el ejemplo de https://www.mercadolibre.com.ar/ayuda/Defensa-del-Consumidor_s20014
Corregir el link en el footer

Quiero un componente para mostrar un link, que se pueda customizar el texto y la url

Quiero un componente para mostrar un logo, como el de la marca del sitio

Crear una vista que sea como la pagina de detalle de producto, a partir de la seccion de Garantía.

Quiero un componente para mostrar una imagen tipo banner, que ocupe el 100% del ancho

Componente Icon: agregar íconos y parámetro className

Modificaciones incluídas en el branch feature-menu-mobile

const icons = {
	cart: "fas fa-shopping-cart",
	search: "fas fa-search",
	"pin-marker": "fas fa-map-marker-alt",
	clock: "fas fa-clock",  //modificado, antes "fas fa-clock"
	home: "fas fa-home",
	tag: "fas fa-tag",
	"empty-heart": "far fa-heart",
	"full-heart": "fas fa-heart",
	"full-star": "fas fa-star",
	"half-star": "fas fa-star-half-alt",
	"empty-star": "far fa-star",
	"arrow-right": "fas fa-angle-right",
	enter: "fas fa-arrow-right",
	"arrow-down": "fas fa-angle-down",
	lightning: "fas fa-bolt",
	//nuevos íconos
	bag: "fas fa-shopping-bag",
	tshirt: "fas fa-tshirt",
	store: "fas fa-store-alt",
	list: "fas fa-list",
	headset: "fas fa-headset",
	download: "fas fa-download",
	//
};

function Icon({ className, icon }) {
	return (
		<>
			<i className={`${className} ${icons[icon]}`}></i>
		</>
	);
}

export default Icon;

Crear componente de votacion

Solo tiene un titulo que dice "Te fue util la informacion ?"
Dos botones de igual tamaño en horizontal con Si y No

Crear componente de buscador para paginas de ayuda

Si se puede reutilizar algun componente, mejor
El placeholder dice "Buscá en Ayuda"
Al escribir el usuario debe desplegar las sugerencias en otro contendor
El maximo de sugerencias es 6
Al clickear el icono de flecha de la sugerencia, el texto queda en el input
Al clickear la flecha en lado derecho del input, se borra el texto

Pagina de informacion al usuario financiero

Crear pagina siguiendo el ejemplo https://www.mercadolibre.com.ar/ayuda/18697
Corregir el link en el footer

Quiero un componente para mostrar un input de texto, que tenga un placeholder

Implementar test para el componente TextInput

Que el parametro "holderText" aparezca como valor del placeholder
Que el tipo de elemento sea text
Que utilice las mismas clases enviadas como className

Crear un vista que sea como el detalle de producto de Mercado Libre.

Debe tener hasta la seccion de descripción inclusive.

Implementar test para el componente Icon

Debe retornar una etiqueta i
La clase debe contener el nombre correcto según la etiqueta que se le pase

Implementar test para el componente TextTag

Debe devolver un link si se le envia una url
Debe devolver un parrafo si no hay url
Debe utilizar el valor del text entre las etiquetas

Implementar test para el componente TextLine

Debe devolver entre las etiquetas el mismo valor que se envia como primer parametro
Que se agrega la clase enviada como segundo parametro a la lista de clases existentes

Componente reutilizable para carga de datos

Ej https://media.discordapp.net/attachments/902175788785356830/913114308081229834/Screenshot_20211124-140549.jpg?width=525&height=1137
Se muestra al ingresar a la ruta "/sell/itemTitle"
Se muestra un texto indicativo del dato que debe ingresar el usuario
Se muestra un input de una sola linea
Abajo del input un texto de ayuda
En el pie de pagina el boton continuar
En boton permanece deshabilitado mientras el input no sea valido
Una vez validado correctamente se puede clickear
Al clickear debe redirigir a la siguiente pagina "/"

Al clickear el item del menu se mantenga visible

Debe implementarse en el navbar para que todas las paginas que lo utilicen lo tengan

Crear una vista que sea como la pagina de ofertas de Mercado Libre.

Quitar la clase txt-center por defecto del componente TextLine

La clase txt-center es necesaria solo en casos específicos, y ya que el componente TextLine admite el uso de clases por props lo mejor seria removerla.

Feature: pagina de productos

https://listado.mercadolibre.com.ar/_Deal_black-friday-jardin-y-aire-libre

Navegacion (hereda del layout)
Texto "Filtrar" en la barra para desplegar los filtros de busqueda (el desplegable de los filtros se resuelve aparte)
Listado de productos
Mostrar en cada tarjeta: foto, title, price, costo de envio y puntaje de reviews.
Cada producto debe ser clickeable y redigir correctamente al detalle del producto
Paginado (reutilizar componente)
Footer (hereda del layout)

Fix: al clickear en la tarjeta en "Vistos recientemente" no redirige al detalle del producto

Asegurarse que tambien se replique en los demas componentes que reutilizan la tarjeta

Implementar test para login

Comprobar que renderiza un input de texto
Comprobar que renderiza un boton que dice "continuar"

Implementar test para pagina de registro

Comprobar que renderiza un input de texto
Comprobar que renderiza un boton que dice "continuar"

Pagina de "Que queres publicar"

Ej https://media.discordapp.net/attachments/902175788785356830/913114806528131092/Screenshot_20211124-141206.jpg?width=525&height=1137
Se muestra al ingresar a la ruta "/sell/chooseCategory"
Carpeta PublishingProcess / componente ChooseRootCategory
Se renderizar 4 opciones con icono y texto centrados en la pagina
De fondo se utiliza el mismo color de la barra de navegacion

Pagina "Mis Compras"

Corregir el link en el footer
Mostrar un titulo en el menú
Flecha de navegacion en la izquierda
Listado de tarjetas con la preview de la compra

Colorear el item de la pagina actual

Segun la pagina en la que estoy que se coloree el item del mismo link

Fix: cambiar url del metodo navigate por url dinamica en RedirectBtn

Asignar urls a los items del menu principal

En el menu desplegable los items actuales no dirigen a las paginas correspondiente

Fix: boton "Crear cuenta" no redirige a register

Implementar test para el componente TextLink

Comprobar que la url sea la indicada en el argumento
Comprobar que el children se renderice como contenido entre las etiquetas

Refactor Register Page

Utilizar mejores practicas con el state para el cambio de display en los componentes.
Refactorizar el codigo repetido.

Implementar test para el componente BannerImage

Verificar que sea devuelto dentro de un link
Verificar que la url de la imagen que devuelva sea la enviada por parametro

Pagina de terminos y condiciones

En el footer actualizar el link
Crear la pagina de terminos y condiciones en base al layout
Utilizar el texto de ML
Crear un archivo que solo exporte un literal string con el html de ese bloque
El texto debe venir de un archivo externo que exporta el html

Quiero un componente para mostrar iconos, como el de registro o login

Quiero un componente para la Navbar, que agrupe los elementos anteriores

El logo del navbar al clickear debe redirigir a la pagina principal

Testear que la url del link sea el mismo link de la pagina home

Crear una vista que sea como el Home de Mercado Libre.

Quiero un componente para el Footer, que agrupe links y abajo tenga la linea de Copyright

Implementar test para el footer

Que los banners acepten una url para redirigir

En el componente BannerImage se deberia poder ingresar una url para que sea redirigido
Por defecto la redireccion se hace en el click y no se puede cambiar por otro evento

<BannerImage redirect="/another-url" src="image.jpg" />

rooftopacademy / roofstore Goto Github PK

roofstore's People

Contributors

Stargazers

Watchers

Forkers

roofstore's Issues

Error de sintaxis en la linea 10 y 11 del componente TextInput

Solución

Recommend Projects

Recommend Topics

Recommend Org