Skip to content

Commit fbf177e

Browse files
vis97cvis97c
authored
Merge pull request #177 from xamu-co/feature/hydration
Feature/hydration
2 parents 31e5d4f + 1b00eb3 commit fbf177e

File tree

20 files changed

+674
-269
lines changed

20 files changed

+674
-269
lines changed

‎packages/common-helpers/src/locale/en.ts‎

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -160,24 +160,32 @@ export const localeTable: tLocaleTable = {
160160
table_hide_all: "Hide all",
161161
table_show_all: "Show all",
162162
swal: {
163-
table_delete_node_title: "Are you sure you want to delete this element?",
163+
table_delete_node_title: "Are you sure you want to delete this item?",
164164
table_delete_node_disclaimer:
165-
"Remember that you wont be able to recover this element data and you will lost all of your work",
165+
"Remember that you wont be able to recover this item data and you will lost all of your work",
166166
table_deleted: "Successfull deletion",
167+
table_deleted_text: "The item was deleted, the list will refresh automatically",
167168
table_delete_nodes_title:
168-
"Are you sure you want to delete this element? | Are you sure you want to delete these {count} elements?",
169+
"Are you sure you want to delete this item? | Are you sure you want to delete these {count} items?",
169170
table_delete_nodes_disclaimer:
170-
"Remember that you wont be able to recover these elements data and you will lost all of your work",
171-
table_possibly_not_deleted:
171+
"Remember that you wont be able to recover these items data and you will lost all of your work",
172+
table_possibly_not_deleted: "Deletion went wrong",
173+
table_possibly_not_deleted_text:
172174
"The item may not have been deleted | The items may not have been deleted",
173175
table_updated: "Successfull update",
174-
table_possibly_not_updated:
176+
table_updated_text: "The item was updated, the list will refresh automatically",
177+
table_possibly_not_updated: "Update went wrong",
178+
table_possibly_not_updated_text:
175179
"The item may not have been updated | The items may not have been updated",
176-
table_created: "Successfull create",
177-
table_possibly_not_created:
180+
table_created: "Successfull creation",
181+
table_created_text: "The item was created, you can already find it in the list",
182+
table_possibly_not_created: "Creation went wrong",
183+
table_possibly_not_created_text:
178184
"The item may not have been created | The items may not have been created",
179-
table_cloned: "Successfull cloning",
180-
table_possibly_not_cloned:
185+
table_cloned: "Successfull clonation",
186+
table_cloned_text: "The item was cloned, you can already find it in the list",
187+
table_possibly_not_cloned: "Clonation went wrong",
188+
table_possibly_not_cloned_text:
181189
"The item may not have been cloned | The items may not have been cloned",
182190
},
183191
};

‎packages/common-helpers/src/locale/es.ts‎

Lines changed: 38 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export const localeBase: tLocaleBase = {
2929
see_name: 'Ver "{name}"',
3030
add: "Añadir",
3131
clear: "Limpiar",
32-
required_verification: "* Requerido. La informacion proporcionada sera verificada.",
32+
required_verification: "* Requerido. La información proporcionada sera verificada.",
3333
previous: "Anterior",
3434
next: "Siguiente",
3535
send: "Enviar",
@@ -42,10 +42,10 @@ export const localeBase: tLocaleBase = {
4242
cancel: "Cancelar",
4343
continue: "Continuar",
4444
error: "¡Error!",
45-
error_message: "¡Sucedio algo malo!",
46-
connection_error: "¡Error de conexion!",
45+
error_message: "¡Algo salió mal!",
46+
connection_error: "¡Error de conexión!",
4747
connection_error_message:
48-
"El servidor no responde. Por favor verifica tu conexion o intentalo de nuevo mas tarde",
48+
"El servidor no responde. Por favor verifica tu conexión o inténtalo de nuevo más tarde",
4949
connection_error_confirm: "Reintentar",
5050
incomplete_data: "Datos incompletos",
5151
incomplete_data_message: "Llena los datos adecuadamente",
@@ -82,7 +82,7 @@ export const localeInput: tLocaleInput = {
8282
file_too_big_text: "El archivo supera el tamaño permitido",
8383
file_unknown_error: "Algo salió mal",
8484
file_unknown_error_text:
85-
"Ocurrió un error al subir los archivos, intenta nuevamente más tarde",
85+
"Ocurrió un error al subir el archivo, inténtalo nuevamente más tarde | Ocurrió un error al subir los archivos, inténtalo nuevamente más tarde",
8686
},
8787
};
8888

@@ -108,27 +108,27 @@ export const localeForm: tLocaleForm = {
108108
form_required_options: "Las opciones son requeridas",
109109
form_requires_n_values:
110110
"No se requieren valores | Se requiere un valor | {count} valores son requeridos",
111-
form_loading_countries: "Cargando paises...",
111+
form_loading_countries: "Cargando países...",
112112
form_country: "Buscar país",
113113
form_state: "Buscar provincia",
114114
form_city: "Buscar ciudad",
115115
form_desired_password: "Contraseña deseada",
116116
form_confirm_password: "Confirma la contraseña",
117117
form_check_password: "Verificar Contraseña",
118118
form_password: "Contraseña",
119-
form_email: "Direccion de correo",
120-
form_phone_line: "Linea de telefono fijo",
121-
form_cellphone: "Telefono celular",
122-
form_id_number: "Numero de identificacion",
119+
form_email: "Dirección de correo",
120+
form_phone_line: "Linea de teléfono fijo",
121+
form_cellphone: "Teléfono celular",
122+
form_id_number: "Numero de identificación",
123123
form_complete_the_field: "Completa el campo",
124-
form_location: "Ubicacion",
125-
form_invalid_field: "Este campo es invalido, completalo adecuadamente",
126-
form_required_field: "Este campo es requerido y no puede estar vacio",
127-
form_use_valid_email: "Debes usar una direccion de correo electronico valida",
128-
form_use_valid_phone: "Muy corto. Usa un numero de telefono valido",
124+
form_location: "Ubicación",
125+
form_invalid_field: "Este campo es invalido, complétalo adecuadamente",
126+
form_required_field: "Este campo es requerido y no puede estar vació",
127+
form_use_valid_email: "Debes usar una dirección de correo electrónico valida",
128+
form_use_valid_phone: "Muy corto. Usa un numero de teléfono valido",
129129
form_use_valid_cellphone: "Debes usar un numero de celular valido",
130130
form_unmatching_passwords: "Las contraseñas no coinciden",
131-
form_invalid_data: "Informacion invalida",
131+
form_invalid_data: "Información invalida",
132132
form_no_values: "Sin valores",
133133
form_new_value: "Nuevo valor",
134134
// swal: {},
@@ -163,23 +163,31 @@ export const localeTable: tLocaleTable = {
163163
swal: {
164164
table_delete_node_title: "¿Estas seguro de que quieres eliminar este elemento?",
165165
table_delete_node_disclaimer:
166-
"Recuerda que no podras recuperar los datos de este elemento y perderas todo tu trabajo.",
167-
table_deleted: "Eliminacion exitosa",
166+
"Recuerda que no podrás recuperar los datos de este elemento y perderás todo tu trabajo.",
167+
table_deleted: "Eliminación exitosa",
168+
table_deleted_text: "Se eliminó el elemento, la lista se refrescara automáticamente",
168169
table_delete_nodes_title:
169170
"¿Estas seguro de que quieres eliminar este elemento? | ¿Estas seguro de que quieres eliminar estos {count} elementos?",
170171
table_delete_nodes_disclaimer:
171-
"Recuerda que no podras recuperar los datos de estos elementos y perderas todo tu trabajo.",
172-
table_possibly_not_deleted:
173-
"El elemento pudo no haber sido eliminado | Los elementos pudieron no haber sido eliminados",
174-
table_updated: "Actualizacion exitosa",
175-
table_possibly_not_updated:
176-
"El elemento pudo no haber sido actualizado | Los elementos pudieron no haber sido actualizados",
177-
table_created: "Creacion exitosa",
178-
table_possibly_not_created:
179-
"El elemento pudo no haber sido creado | Los elementos pudieron no haber sido creados",
180-
table_cloned: "Clonacion exitosa",
181-
table_possibly_not_cloned:
182-
"El elemento pudo no haber sido clonado | Los elementos pudieron no haber sido clonados",
172+
"Recuerda que no podrás recuperar los datos de estos elementos y perderás todo tu trabajo.",
173+
table_possibly_not_deleted: "Eliminación fallida",
174+
table_possibly_not_deleted_text:
175+
"Puede que el elemento no haya sido eliminado | Puede que los elementos no hayan sido eliminados",
176+
table_updated: "Actualización exitosa",
177+
table_updated_text: "Se actualizó el elemento, la lista se refrescara automáticamente",
178+
table_possibly_not_updated: "Actualización fallida",
179+
table_possibly_not_updated_text:
180+
"Puede que el elemento no haya sido actualizado | Puede que los elementos no hayan sido actualizados",
181+
table_created: "Creación exitosa",
182+
table_created_text: "Se creó el elemento, ya puedes encontrarlo en la lista",
183+
table_possibly_not_created: "Creación fallida",
184+
table_possibly_not_created_text:
185+
"Puede que el elemento no haya sido creado | Puede que los elementos no hayan sido creados",
186+
table_cloned: "Clonación exitosa",
187+
table_cloned_text: "Se clonó el elemento, ya puedes encontrarlo en la lista",
188+
table_possibly_not_cloned: "Clonación fallida",
189+
table_possibly_not_cloned_text:
190+
"Puede que el elemento no haya sido clonado | Puede que los elementos no hayan sido clonados",
183191
},
184192
};
185193

‎packages/common-helpers/src/swal.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,13 @@ export default function useSwal(options: iPluginOptions = {}, overrides: SweetAl
8484
allowOutsideClick: () => !Swal.isLoading(),
8585
allowEscapeKey: () => !Swal.isLoading(),
8686
},
87+
options.internals?.debug
88+
? {
89+
showDenyButton: true,
90+
denyButtonText: t("swal.cancel"),
91+
customClass: { denyButton: "link" },
92+
}
93+
: {},
8794
swal?.loaderOverrides
8895
);
8996
const swalToastDefaults: SweetAlertOptions = Object.assign(

‎packages/common-types/src/locale.ts‎

Lines changed: 26 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -246,30 +246,46 @@ export type tLocaleTable = {
246246
/** @example "Show all" */
247247
table_show_all: string;
248248
swal: {
249-
/** @example "Are you sure you want to delete this element?" */
249+
/** @example "Are you sure you want to delete this item?" */
250250
table_delete_node_title: string;
251-
/** @example "Remember that you wont be able to recover this element data and you will lost all of your work" */
251+
/** @example "Remember that you wont be able to recover this item data and you will lost all of your work" */
252252
table_delete_node_disclaimer: string;
253253
/** @example "Successfull deletion" */
254254
table_deleted: string;
255-
/** @example "Are you sure you want to delete this element? | Are you sure you want to delete these {count} elements?" */
255+
/** @example "The item was deleted, the list will refresh automatically" */
256+
table_deleted_text: string;
257+
/** @example "Are you sure you want to delete this item? | Are you sure you want to delete these {count} items?" */
256258
table_delete_nodes_title: string;
257-
/** @example "Remember that you wont be able to recover these elements data and you will lost all of your work" */
259+
/** @example "Remember that you wont be able to recover these items data and you will lost all of your work" */
258260
table_delete_nodes_disclaimer: string;
259-
/** @example "The item may not have been deleted | The items may not have been deleted" */
261+
/** @example "Deletion went wrong" */
260262
table_possibly_not_deleted: string;
263+
/** @example "The item may not have been deleted | The items may not have been deleted" */
264+
table_possibly_not_deleted_text: string;
261265
/** @example "Successfull update" */
262266
table_updated: string;
263-
/** @example "The item may not have been updated | The items may not have been updated" */
267+
/** @example "The item was updated, the list will refresh automatically" */
268+
table_updated_text: string;
269+
/** @example "Update went wrong" */
264270
table_possibly_not_updated: string;
265-
/** @example "Successfull update" */
271+
/** @example "The item may not have been updated | The items may not have been updated" */
272+
table_possibly_not_updated_text: string;
273+
/** @example "Successfull creation" */
266274
table_created: string;
267-
/** @example "The item may not have been created | The items may not have been created" */
275+
/** @example "The item was created, you can already find it in the list" */
276+
table_created_text: string;
277+
/** @example "Creation went wrong" */
268278
table_possibly_not_created: string;
269-
/** @example "Successfull cloning" */
279+
/** @example "The item may not have been created | The items may not have been created" */
280+
table_possibly_not_created_text: string;
281+
/** @example "Successfull clonation" */
270282
table_cloned: string;
271-
/** @example "The item may not have been cloned | The items may not have been cloned" */
283+
/** @example "The item was cloned, you can already find it in the list" */
284+
table_cloned_text: string;
285+
/** @example "Clonation went wrong" */
272286
table_possibly_not_cloned: string;
287+
/** @example "The item may not have been cloned | The items may not have been cloned" */
288+
table_possibly_not_cloned_text: string;
273289
};
274290
};
275291

‎packages/common-types/src/plugin.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -146,4 +146,11 @@ export interface iPluginOptions<ComponentType = unknown> {
146146
* @default console.log
147147
*/
148148
logger?: tLogger;
149+
/**
150+
* Function used to encode the pagination cursor
151+
*
152+
* @default node.id
153+
*/
154+
cursorEncoder?: (<T>(node: T) => string) | (<T>(node: T) => number);
155+
internals?: Record<string, any>;
149156
}

‎packages/common-types/src/values.ts‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,29 @@ export interface iSelectOption {
66
hidden?: boolean;
77
}
88

9-
export type iNodeFnResponse = [boolean?, Event?, (() => void)?];
9+
/**
10+
* Response from node functions
11+
*
12+
* Action result, event and callback
13+
*/
14+
export type iNodeFnResponse<T extends Record<string, any> = never> = [
15+
(boolean | T)?,
16+
Event?,
17+
(() => void)?,
18+
];
1019

1120
/**
1221
* Funtions that uses a node and perform some action
1322
*
1423
* Useful for table actions like creating, updating and deleting nodes
24+
*
25+
* Undefined would mean no action was performed
26+
* True or an T type object would mean action was performed successfully
27+
* False would mean action failed
1528
*/
1629
export type iNodeFn<T extends Record<string, any>, Ta extends [T?, ...any[]] = [T]> = (
1730
...args: Ta
18-
) => boolean | undefined | iNodeFnResponse | Promise<boolean | undefined | iNodeFnResponse>;
31+
) => boolean | undefined | iNodeFnResponse<T> | Promise<boolean | undefined | iNodeFnResponse<T>>;
1932

2033
/**
2134
* Used on Table and related components

‎packages/components-vue/src/components/base/Wrapper.vue‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
</template>
77

88
<script setup lang="ts">
9+
import type { Teleport } from "vue";
10+
911
import type { vComponent } from "../../types/plugin";
1012
1113
/**
@@ -24,7 +26,7 @@
2426
/** Wheter or not render the wrapper */
2527
wrap: boolean;
2628
/** Component or tag to render as wrapper */
27-
wrapper?: vComponent | string;
29+
wrapper?: vComponent | typeof Teleport | string;
2830
}>(),
2931
{ wrapper: "div" }
3032
);

‎packages/components-vue/src/components/loader/Content.vue‎

Lines changed: 44 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,53 @@
11
<template>
2-
<BaseWrapper :wrapper="Transition" :wrap="!unwrap" name="fade" appear>
3-
<div
4-
v-if="!content || (errors && !ignoreErrors)"
5-
class="flx --flxColumn --flx-center --width-100"
6-
:class="loaderClasses"
7-
>
8-
<!-- first load -->
9-
<template v-if="!loading">
10-
<BoxMessage v-if="errors" :theme="eColors.DANGER" class="--width-100">
11-
<div class="flx --flxRow --flx-center">
12-
<span>{{ t("could_not_get_data") }}</span>
13-
<ActionButtonToggle
14-
v-if="refresh"
15-
:theme="eColors.DANGER"
16-
:tooltip="t('refresh')"
17-
round
18-
@click="refresh()"
19-
>
20-
<IconFa name="rotate-right" />
21-
<IconFa name="rotate-right" regular />
22-
</ActionButtonToggle>
23-
</div>
24-
</BoxMessage>
25-
<BoxMessage v-else :theme="theme" class="--width-100">
26-
<div class="flx --flxRow --flx-center">
27-
<span>{{ noContentMessage || t("nothing_to_show") }}</span>
28-
<ActionButtonToggle
29-
v-if="refresh"
30-
:theme="theme"
31-
:tooltip="t('refresh')"
32-
round
33-
@click="refresh()"
34-
>
35-
<IconFa name="rotate-right" />
36-
<IconFa name="rotate-right" regular />
37-
</ActionButtonToggle>
38-
</div>
39-
</BoxMessage>
40-
</template>
41-
<LoaderSimple v-else-if="!noLoader" :label="label" :theme="theme" />
2+
<div
3+
v-if="!content || (errors && !ignoreErrors)"
4+
class="flx --flxColumn --flx-center --width-100"
5+
:class="loaderClasses"
6+
>
7+
<!-- first load -->
8+
<template v-if="!loading">
9+
<BoxMessage v-if="errors" :theme="eColors.DANGER" class="--width-100">
10+
<div class="flx --flxRow --flx-center">
11+
<span>{{ t("could_not_get_data") }}</span>
12+
<ActionButtonToggle
13+
v-if="refresh"
14+
:theme="eColors.DANGER"
15+
:tooltip="t('refresh')"
16+
round
17+
@click="refresh()"
18+
>
19+
<IconFa name="rotate-right" />
20+
<IconFa name="rotate-right" regular />
21+
</ActionButtonToggle>
22+
</div>
23+
</BoxMessage>
24+
<BoxMessage v-else :theme="theme" class="--width-100">
25+
<div class="flx --flxRow --flx-center">
26+
<span>{{ noContentMessage || t("nothing_to_show") }}</span>
27+
<ActionButtonToggle
28+
v-if="refresh"
29+
:theme="theme"
30+
:tooltip="t('refresh')"
31+
round
32+
@click="refresh()"
33+
>
34+
<IconFa name="rotate-right" />
35+
<IconFa name="rotate-right" regular />
36+
</ActionButtonToggle>
37+
</div>
38+
</BoxMessage>
39+
</template>
40+
<LoaderSimple v-else-if="!noLoader" key="loader-no-content" :label="label" :theme="theme" />
41+
</div>
42+
<BaseWrapper v-else :wrap="!unwrap" :el="el" v-bind="$attrs">
43+
<div class="back --overlay" :class="{ 'is--active': loading && !noLoader }">
44+
<LoaderSimple key="loader-content" :label="label" :theme="theme" />
4245
</div>
43-
<BaseWrapper v-else :wrap="!unwrap" :el="el" v-bind="$attrs">
44-
<div class="back --overlay" :class="{ 'is--active': loading && !noLoader }">
45-
<LoaderSimple :label="label" :theme="theme" />
46-
</div>
47-
<slot></slot>
48-
</BaseWrapper>
46+
<slot></slot>
4947
</BaseWrapper>
5048
</template>
5149

5250
<script setup lang="ts">
53-
import { Transition } from "vue";
54-
5551
import type { tProps } from "@open-xamu-co/ui-common-types";
5652
import { useI18n } from "@open-xamu-co/ui-common-helpers";
5753
import { eColors } from "@open-xamu-co/ui-common-enums";

0 commit comments

Comments
 (0)