Agrega sección Custom data; subsecciones languages, audit types y custom sections #120

jllanosg · 2024-09-30T01:52:33Z

Descripción

Agrega sección Custom data; subsecciones languages, audit types y custom sections

Motivación y Contexto

Custom data Necesario para el resto del front

¿Cómo ha sido probado?

(buildear la app)
Irse a data
Sección custom data
Crear, editar y borrar languages
Lo mismo para audit types
Lo mismo para custom fields

Capturas de pantalla (si es apropiado):

Tipos de cambios

Bugfix (cambio que no interrumpe el funcionamiento y que soluciona un problema)
New feature (cambio que no interrumpe el funcionamiento y que añade funcionalidad)
Breaking change (corrección o funcionalidad que podría causar que la funcionalidad existente cambie)

Lista de verificación:

Mi código sigue el estilo de código de este proyecto.
Mi cambio requiere una modificación en la documentación.
He actualizado la documentación en consecuencia.
Requiere nuevos tests.

Summary by CodeRabbit

Resumen por CodeRabbit

Nuevas Funciones
- Se introdujeron nuevos componentes para la gestión de campos personalizados, incluyendo CustomFields, CustomFieldDisplay, PopOverEditCustomField, CheckboxButtonCustom, MultiSelectDropdownCustom, y OptionsCustomData.
Mejoras en la Interfaz de Usuario
- Se añadieron estilos adicionales para mejorar la iconografía de la aplicación mediante la integración de Font Awesome y Material Icons.
Mejoras en la Retroalimentación del Usuario
- Se añadieron nuevos mensajes de éxito y error para mejorar la retroalimentación del usuario durante la creación y actualización de idiomas, campos personalizados y tipos de auditoría.
- Se incorporó un mensaje de carga para mejorar la experiencia del usuario durante procesos de espera.
- Se añadieron nuevas etiquetas de botones y mensajes para facilitar la navegación y las acciones del usuario.
Actualizaciones de Dependencias
- Se añadieron nuevas dependencias para mejorar las capacidades del frontend, incluyendo @hello-pangea/dnd, @radix-ui/react-accordion, y @radix-ui/react-popover.

coderabbitai

Actionable comments posted: 3

🧹 Outside diff range comments (1)

frontend/package.json (1)

Line range hint 7-7: Atención: Es necesario abordar el proceso de construcción.

En los objetivos del PR se menciona la necesidad de modificar el proceso de construcción para instalar las nuevas dependencias. Sin embargo, no se observan cambios en el script de construcción en este archivo. Es imperativo que abordes este asunto de inmediato para garantizar que la aplicación se construya correctamente en todos los entornos.

Te exijo que proporciones detalles sobre cómo planeas modificar el proceso de construcción para incluir la instalación de las nuevas dependencias. Si no tienes una solución, debes buscarla inmediatamente.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE

📥 Commits

Files that changed from the base of the PR and between 78bc456 and 165ec1a.

📒 Files selected for processing (2)

frontend/package.json (1 hunks)
frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx (1 hunks)

🧰 Additional context used

🔇 Additional comments (3)

frontend/package.json (1)

18-18: Aprobación de las nuevas dependencias.

Las nuevas dependencias añadidas son apropiadas y están alineadas con los objetivos del PR. La inclusión de @hello-pangea/dnd es particularmente acertada, ya que resuelve el problema mencionado en comentarios anteriores sobre el uso de react-beautiful-dnd.

Also applies to: 22-22, 25-25

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx (2)

61-66: Validar valores predeterminados al inicializar los estados sizeSelected y offsetSelected

Estás utilizando sizes.find() para inicializar los estados. Si currentCustomField.size o currentCustomField.offset no coinciden con ningún id en sizes, estás asignando un valor predeterminado de sizes[1] o sizes[0]. Asegúrate de que estos índices existen en el arreglo sizes para evitar posibles errores si el arreglo cambia en el futuro.

233-233: Uso adecuado de claves al renderizar listas

Excelente trabajo al cambiar la clave de key={index} a key={${option.locale}-${index}}. Esto reduce la posibilidad de conflictos y mejora el rendimiento en el renderizado de listas dinámicas.

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx

coderabbitai

Actionable comments posted: 8

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE

📥 Commits

Files that changed from the base of the PR and between 165ec1a and bee89b8.

📒 Files selected for processing (4)

frontend/src/routes/data/CustomData/CustomFields.tsx (1 hunks)
frontend/src/routes/data/CustomData/custom-fields/OptionsCustomData.tsx (1 hunks)
frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx (1 hunks)
frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx (1 hunks)

🧰 Additional context used

🔇 Additional comments (8)

frontend/src/routes/data/CustomData/custom-fields/OptionsCustomData.tsx (6)

7-12: Definición completa del tipo ListItem.

La definición del tipo ListItem es correcta y está preparada para su uso actual y futuro.

14-17: Definición adecuada del tipo OptionData.

El tipo OptionData está bien definido y satisface las necesidades del componente.

19-27: Tipado correcto de OptionsCustomDataProps.

Las propiedades del componente están correctamente tipadas, lo que facilita su mantenimiento y escalabilidad.

38-50: Implementación correcta de handlerAddOption.

La función handlerAddOption maneja adecuadamente la validación de entradas y la actualización del estado, asegurando que no se agreguen opciones vacías y limpiando el campo después de agregar.

52-56: Uso apropiado de filter en handlerDeleteOption.

La utilización de filter para eliminar opciones es eficiente y evita la mutación directa del estado, siguiendo buenas prácticas de manejo de estado en React.

58-103: Componente OptionsCustomData bien estructurado.

El componente está correctamente estructurado, manejando eficazmente las entradas del usuario y renderizando dinámicamente las opciones basadas en el idioma seleccionado.

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx (2)

58-70: Inicialización correcta de estados locales

La inicialización de los estados locales addOptionField, required, sizeSelected, offsetSelected y optionsData es adecuada y sigue las mejores prácticas de React.

99-102: Validación apropiada al agregar opciones

Has implementado correctamente una validación para evitar que se agreguen opciones vacías o compuestas solo por espacios en blanco. Esto mejora la robustez y experiencia del usuario.

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx

frontend/src/routes/data/CustomData/CustomFields.tsx

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

coderabbitai

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE

📥 Commits

Files that changed from the base of the PR and between bee89b8 and bf4754a.

📒 Files selected for processing (1)

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx (1 hunks)

🧰 Additional context used

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx

Sealra · 2024-10-12T23:47:59Z

Es necesario agregar un .trim tanto en Audit Types como Custom Fields, ya que se permite crear objetos sin nombre.

Audit Types

Custom Fields (esto también genera problemas luego al usar el botón save en Manage Custom Fields)

En lenguage los input no tienen gestión de required.

En Audit Types puedes editar un Audit Type y dejar su nombre vacío.

Tampoco existe gestión de required en los inputs de Custom Sections.

jllanosg · 2024-10-12T23:52:57Z

Es necesario agregar un .trim tanto en Audit Types como Custom Fields, ya que se permite crear objetos sin nombre.

Audit Types

Custom Fields (esto también genera problemas luego al usar el botón save en Manage Custom Fields)

En lenguage los input no tienen gestión de required.

En Audit Types puedes editar un Audit Type y dejar su nombre vacío.

Tampoco existe gestión de required en los inputs de Custom Sections.

Los required los omití por ahora, no hay tiempo

Sealra · 2024-10-12T23:54:13Z

Puedes agregarle label, description y required a un space en Custom Fields, cuando en su definición inicial no contiene esa opción

coderabbitai

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE

📥 Commits

Files that changed from the base of the PR and between bf4754a and 82f1da7.

📒 Files selected for processing (1)

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx (1 hunks)

🧰 Additional context used

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx

iTzGooDLife · 2024-10-13T00:13:19Z

Puedes agregarle label, description y required a un space en Custom Fields, cuando en su definición inicial no contiene esa opción

Buena acotación, se encuentra solucionado.

coderabbitai

Actionable comments posted: 3

📜 Review details

Configuration used: CodeRabbit UI
Review profile: ASSERTIVE

📥 Commits

Files that changed from the base of the PR and between 82f1da7 and 46ab912.

📒 Files selected for processing (1)

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx (1 hunks)

🧰 Additional context used

🔇 Additional comments (1)

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx (1)

61-66: Verificar valores predeterminados al inicializar estados

Al inicializar sizeSelected y offsetSelected, se utiliza sizes[1] y sizes[0] respectivamente como valores predeterminados en caso de que find no encuentre coincidencias. Asegúrate de que estos índices existen en el arreglo sizes para evitar posibles errores en tiempo de ejecución si sizes cambia en el futuro.

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx

Sealra

Con los issues #140 y #141 añadidos, LGTM

jllanosg added 30 commits August 16, 2024 20:05

agrega layout custom data

15c84fb

agrega traducciones de creacion de lenguajes

2557fab

agrega index a button

a19bad0

añade create y retrieve de languages

731dd0e

añade create y get de langs

fc666d3

agrega lógica de edición

4a87a98

agrega package de Dnd

f46bc13

agrega update de languages

2f15ae4

agrega componente reutilizable para DnD

e08af6d

agrega componente para encapsular DnD

0180919

agrega lógica de update

fc08558

agrega traducciones de lang. update

5750c99

Merge branch 'data-pareja1' into data-pareja1-custom-data

f617869

Agrega disabled a inputs

dc120f9

fix typo

5086bdb

modifica padding de children

13e5d85

Agrega disabled a inputs y estilos

75ee159

agrega comentario

40fb545

Merge branch 'data-pareja1' into data-pareja1-custom-data

f62e794

agrega componente para la visualizacion de newAuditType

e48b9f2

agrega get y post de audit type

feef7bf

agrega NewAuditTypeForm

2a90943

quita import no utilizado

dc7724a

Merge branch 'data-pareja1' into data-pareja1-custom-data

096afa1

quita toast antiguo

63cf23d

quita toast antiguo

8c55dd6

Merge branch 'data-pareja1' into data-pareja1-custom-data

00d66e5

Agrega modal nuevo y mueve fetch a funcion aparte

5eac180

Merge branch 'data-pareja1' into data-pareja1-custom-data

cd9863f

Merge branch 'data-pareja1' into data-pareja1-custom-data

f806c8d

fix: improve key in popover - coderabbit

165ec1a

coderabbitai bot reviewed Oct 12, 2024

View reviewed changes

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx Show resolved Hide resolved

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx Show resolved Hide resolved

iTzGooDLife added 4 commits October 12, 2024 18:53

fix: change state in checkbox button - coderabbit

0bc0f2b

fix: change handler delete option - coderabbit

70bd7dd

fix: add condition in custom fields to fix bug

43720f2

fix: remove comment

bee89b8

iTzGooDLife reviewed Oct 12, 2024

View reviewed changes

frontend/src/routes/data/CustomData/custom-fields/customComponents/PopOverEditCustomField.tsx Show resolved Hide resolved

coderabbitai bot reviewed Oct 12, 2024

View reviewed changes

update key checkboxCustom

bf4754a

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

coderabbitai bot reviewed Oct 12, 2024

View reviewed changes

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx Show resolved Hide resolved

fix: remove unused imports

82f1da7

coderabbitai bot reviewed Oct 13, 2024

View reviewed changes

frontend/src/routes/data/CustomData/custom-fields/customComponents/CheckboxButtonCustom.tsx Show resolved Hide resolved

fix: fix items displayed popover

46ab912

coderabbitai bot reviewed Oct 13, 2024

View reviewed changes

This was referenced Oct 13, 2024

[BUG] Verificar gestión de nombres en AuditTypes y CustomFields #140

Open

[BUG] Gestión de requireds en Custom Data #141

Open

Sealra approved these changes Oct 13, 2024

View reviewed changes

Merge branch 'development' into data-pareja1-custom-data

494f0c5

caverav approved these changes Oct 13, 2024

View reviewed changes

caverav merged commit c4562d7 into development Oct 13, 2024
3 of 4 checks passed

caverav deleted the data-pareja1-custom-data branch October 13, 2024 02:40

This was referenced Oct 14, 2024

added customSections on audits #145

Closed

feat: added customSections on audits #146

Merged

coderabbitai bot mentioned this pull request Nov 3, 2024

Add New Chart Components and Client Dashboard #160

Merged

7 tasks

This was referenced Nov 13, 2024

Vulnerability Types #175

Merged

Adds Vulnerability Types and Categories to Custom Data #177

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Agrega sección Custom data; subsecciones languages, audit types y custom sections #120

Agrega sección Custom data; subsecciones languages, audit types y custom sections #120

jllanosg commented Sep 30, 2024 •

edited by coderabbitai bot

Loading

coderabbitai bot left a comment

coderabbitai bot left a comment

coderabbitai bot left a comment

Sealra commented Oct 12, 2024 •

edited

Loading

jllanosg commented Oct 12, 2024

Sealra commented Oct 12, 2024 •

edited

Loading

coderabbitai bot left a comment

iTzGooDLife commented Oct 13, 2024

coderabbitai bot left a comment

Sealra left a comment

Agrega sección Custom data; subsecciones languages, audit types y custom sections #120

Agrega sección Custom data; subsecciones languages, audit types y custom sections #120

Conversation

jllanosg commented Sep 30, 2024 • edited by coderabbitai bot Loading

Descripción

Motivación y Contexto

¿Cómo ha sido probado?

Capturas de pantalla (si es apropiado):

Tipos de cambios

Lista de verificación:

Summary by CodeRabbit

Resumen por CodeRabbit

coderabbitai bot left a comment

Choose a reason for hiding this comment

coderabbitai bot left a comment

Choose a reason for hiding this comment

coderabbitai bot left a comment

Choose a reason for hiding this comment

Sealra commented Oct 12, 2024 • edited Loading

jllanosg commented Oct 12, 2024

Sealra commented Oct 12, 2024 • edited Loading

coderabbitai bot left a comment

Choose a reason for hiding this comment

iTzGooDLife commented Oct 13, 2024

coderabbitai bot left a comment

Choose a reason for hiding this comment

Sealra left a comment

Choose a reason for hiding this comment

jllanosg commented Sep 30, 2024 •

edited by coderabbitai bot

Loading

Sealra commented Oct 12, 2024 •

edited

Loading

Sealra commented Oct 12, 2024 •

edited

Loading