@jjlmoya/utils-converters 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (172) hide show
  1. package/package.json +61 -0
  2. package/src/category/i18n/en.ts +90 -0
  3. package/src/category/i18n/es.ts +90 -0
  4. package/src/category/i18n/fr.ts +90 -0
  5. package/src/category/index.ts +39 -0
  6. package/src/category/seo.astro +15 -0
  7. package/src/components/PreviewNavSidebar.astro +116 -0
  8. package/src/components/PreviewToolbar.astro +152 -0
  9. package/src/data.ts +34 -0
  10. package/src/env.d.ts +5 -0
  11. package/src/index.ts +39 -0
  12. package/src/layouts/PreviewLayout.astro +117 -0
  13. package/src/pages/[locale]/[slug].astro +148 -0
  14. package/src/pages/[locale].astro +271 -0
  15. package/src/pages/index.astro +4 -0
  16. package/src/shared/ImageConverter.astro +237 -0
  17. package/src/shared/logic/converter.ts +167 -0
  18. package/src/shared/style.css +258 -0
  19. package/src/tests/faq_count.test.ts +10 -0
  20. package/src/tests/mocks/astro_mock.js +2 -0
  21. package/src/tests/seo_length.test.ts +22 -0
  22. package/src/tests/tool_validation.test.ts +17 -0
  23. package/src/tool/avifAJpg/bibliography.astro +14 -0
  24. package/src/tool/avifAJpg/component.astro +8 -0
  25. package/src/tool/avifAJpg/i18n/en.ts +123 -0
  26. package/src/tool/avifAJpg/i18n/es.ts +123 -0
  27. package/src/tool/avifAJpg/i18n/fr.ts +118 -0
  28. package/src/tool/avifAJpg/index.ts +29 -0
  29. package/src/tool/avifAJpg/seo.astro +14 -0
  30. package/src/tool/avifAPng/bibliography.astro +14 -0
  31. package/src/tool/avifAPng/component.astro +8 -0
  32. package/src/tool/avifAPng/i18n/en.ts +118 -0
  33. package/src/tool/avifAPng/i18n/es.ts +123 -0
  34. package/src/tool/avifAPng/i18n/fr.ts +118 -0
  35. package/src/tool/avifAPng/index.ts +29 -0
  36. package/src/tool/avifAPng/seo.astro +14 -0
  37. package/src/tool/avifAWebp/bibliography.astro +14 -0
  38. package/src/tool/avifAWebp/component.astro +8 -0
  39. package/src/tool/avifAWebp/i18n/en.ts +118 -0
  40. package/src/tool/avifAWebp/i18n/es.ts +123 -0
  41. package/src/tool/avifAWebp/i18n/fr.ts +118 -0
  42. package/src/tool/avifAWebp/index.ts +29 -0
  43. package/src/tool/avifAWebp/seo.astro +14 -0
  44. package/src/tool/bmpAJpg/bibliography.astro +14 -0
  45. package/src/tool/bmpAJpg/component.astro +8 -0
  46. package/src/tool/bmpAJpg/i18n/en.ts +123 -0
  47. package/src/tool/bmpAJpg/i18n/es.ts +123 -0
  48. package/src/tool/bmpAJpg/i18n/fr.ts +118 -0
  49. package/src/tool/bmpAJpg/index.ts +29 -0
  50. package/src/tool/bmpAJpg/seo.astro +14 -0
  51. package/src/tool/bmpAPng/bibliography.astro +14 -0
  52. package/src/tool/bmpAPng/component.astro +8 -0
  53. package/src/tool/bmpAPng/i18n/en.ts +123 -0
  54. package/src/tool/bmpAPng/i18n/es.ts +123 -0
  55. package/src/tool/bmpAPng/i18n/fr.ts +118 -0
  56. package/src/tool/bmpAPng/index.ts +29 -0
  57. package/src/tool/bmpAPng/seo.astro +14 -0
  58. package/src/tool/bmpAWebp/bibliography.astro +14 -0
  59. package/src/tool/bmpAWebp/component.astro +8 -0
  60. package/src/tool/bmpAWebp/i18n/en.ts +118 -0
  61. package/src/tool/bmpAWebp/i18n/es.ts +123 -0
  62. package/src/tool/bmpAWebp/i18n/fr.ts +118 -0
  63. package/src/tool/bmpAWebp/index.ts +29 -0
  64. package/src/tool/bmpAWebp/seo.astro +14 -0
  65. package/src/tool/gifAJpg/bibliography.astro +14 -0
  66. package/src/tool/gifAJpg/component.astro +8 -0
  67. package/src/tool/gifAJpg/i18n/en.ts +123 -0
  68. package/src/tool/gifAJpg/i18n/es.ts +123 -0
  69. package/src/tool/gifAJpg/i18n/fr.ts +118 -0
  70. package/src/tool/gifAJpg/index.ts +29 -0
  71. package/src/tool/gifAJpg/seo.astro +14 -0
  72. package/src/tool/gifAPng/bibliography.astro +14 -0
  73. package/src/tool/gifAPng/component.astro +8 -0
  74. package/src/tool/gifAPng/i18n/en.ts +123 -0
  75. package/src/tool/gifAPng/i18n/es.ts +123 -0
  76. package/src/tool/gifAPng/i18n/fr.ts +118 -0
  77. package/src/tool/gifAPng/index.ts +29 -0
  78. package/src/tool/gifAPng/seo.astro +14 -0
  79. package/src/tool/gifAWebp/bibliography.astro +14 -0
  80. package/src/tool/gifAWebp/component.astro +8 -0
  81. package/src/tool/gifAWebp/i18n/en.ts +123 -0
  82. package/src/tool/gifAWebp/i18n/es.ts +123 -0
  83. package/src/tool/gifAWebp/i18n/fr.ts +118 -0
  84. package/src/tool/gifAWebp/index.ts +29 -0
  85. package/src/tool/gifAWebp/seo.astro +14 -0
  86. package/src/tool/imagenBase64/bibliography.astro +14 -0
  87. package/src/tool/imagenBase64/component.astro +159 -0
  88. package/src/tool/imagenBase64/i18n/en.ts +137 -0
  89. package/src/tool/imagenBase64/i18n/es.ts +137 -0
  90. package/src/tool/imagenBase64/i18n/fr.ts +132 -0
  91. package/src/tool/imagenBase64/index.ts +43 -0
  92. package/src/tool/imagenBase64/seo.astro +14 -0
  93. package/src/tool/imagenBase64/style.css +299 -0
  94. package/src/tool/jpgAIco/bibliography.astro +14 -0
  95. package/src/tool/jpgAIco/component.astro +8 -0
  96. package/src/tool/jpgAIco/i18n/en.ts +123 -0
  97. package/src/tool/jpgAIco/i18n/es.ts +123 -0
  98. package/src/tool/jpgAIco/i18n/fr.ts +118 -0
  99. package/src/tool/jpgAIco/index.ts +29 -0
  100. package/src/tool/jpgAIco/seo.astro +14 -0
  101. package/src/tool/jpgAPng/bibliography.astro +14 -0
  102. package/src/tool/jpgAPng/component.astro +8 -0
  103. package/src/tool/jpgAPng/i18n/en.ts +128 -0
  104. package/src/tool/jpgAPng/i18n/es.ts +128 -0
  105. package/src/tool/jpgAPng/i18n/fr.ts +123 -0
  106. package/src/tool/jpgAPng/index.ts +29 -0
  107. package/src/tool/jpgAPng/seo.astro +14 -0
  108. package/src/tool/jpgAWebp/bibliography.astro +14 -0
  109. package/src/tool/jpgAWebp/component.astro +8 -0
  110. package/src/tool/jpgAWebp/i18n/en.ts +118 -0
  111. package/src/tool/jpgAWebp/i18n/es.ts +123 -0
  112. package/src/tool/jpgAWebp/i18n/fr.ts +118 -0
  113. package/src/tool/jpgAWebp/index.ts +29 -0
  114. package/src/tool/jpgAWebp/seo.astro +14 -0
  115. package/src/tool/pngAIco/bibliography.astro +14 -0
  116. package/src/tool/pngAIco/component.astro +8 -0
  117. package/src/tool/pngAIco/i18n/en.ts +123 -0
  118. package/src/tool/pngAIco/i18n/es.ts +123 -0
  119. package/src/tool/pngAIco/i18n/fr.ts +118 -0
  120. package/src/tool/pngAIco/index.ts +29 -0
  121. package/src/tool/pngAIco/seo.astro +14 -0
  122. package/src/tool/pngAJpg/bibliography.astro +14 -0
  123. package/src/tool/pngAJpg/component.astro +8 -0
  124. package/src/tool/pngAJpg/i18n/en.ts +133 -0
  125. package/src/tool/pngAJpg/i18n/es.ts +201 -0
  126. package/src/tool/pngAJpg/i18n/fr.ts +128 -0
  127. package/src/tool/pngAJpg/index.ts +29 -0
  128. package/src/tool/pngAJpg/seo.astro +14 -0
  129. package/src/tool/pngAWebp/bibliography.astro +14 -0
  130. package/src/tool/pngAWebp/component.astro +8 -0
  131. package/src/tool/pngAWebp/i18n/en.ts +127 -0
  132. package/src/tool/pngAWebp/i18n/es.ts +132 -0
  133. package/src/tool/pngAWebp/i18n/fr.ts +122 -0
  134. package/src/tool/pngAWebp/index.ts +29 -0
  135. package/src/tool/pngAWebp/seo.astro +14 -0
  136. package/src/tool/svgAJpg/bibliography.astro +14 -0
  137. package/src/tool/svgAJpg/component.astro +8 -0
  138. package/src/tool/svgAJpg/i18n/en.ts +118 -0
  139. package/src/tool/svgAJpg/i18n/es.ts +123 -0
  140. package/src/tool/svgAJpg/i18n/fr.ts +118 -0
  141. package/src/tool/svgAJpg/index.ts +29 -0
  142. package/src/tool/svgAJpg/seo.astro +14 -0
  143. package/src/tool/svgAPng/bibliography.astro +14 -0
  144. package/src/tool/svgAPng/component.astro +8 -0
  145. package/src/tool/svgAPng/i18n/en.ts +123 -0
  146. package/src/tool/svgAPng/i18n/es.ts +128 -0
  147. package/src/tool/svgAPng/i18n/fr.ts +118 -0
  148. package/src/tool/svgAPng/index.ts +29 -0
  149. package/src/tool/svgAPng/seo.astro +14 -0
  150. package/src/tool/webpAIco/bibliography.astro +14 -0
  151. package/src/tool/webpAIco/component.astro +8 -0
  152. package/src/tool/webpAIco/i18n/en.ts +123 -0
  153. package/src/tool/webpAIco/i18n/es.ts +123 -0
  154. package/src/tool/webpAIco/i18n/fr.ts +118 -0
  155. package/src/tool/webpAIco/index.ts +29 -0
  156. package/src/tool/webpAIco/seo.astro +14 -0
  157. package/src/tool/webpAJpg/bibliography.astro +14 -0
  158. package/src/tool/webpAJpg/component.astro +8 -0
  159. package/src/tool/webpAJpg/i18n/en.ts +122 -0
  160. package/src/tool/webpAJpg/i18n/es.ts +127 -0
  161. package/src/tool/webpAJpg/i18n/fr.ts +122 -0
  162. package/src/tool/webpAJpg/index.ts +29 -0
  163. package/src/tool/webpAJpg/seo.astro +14 -0
  164. package/src/tool/webpAPng/bibliography.astro +14 -0
  165. package/src/tool/webpAPng/component.astro +8 -0
  166. package/src/tool/webpAPng/i18n/en.ts +127 -0
  167. package/src/tool/webpAPng/i18n/es.ts +132 -0
  168. package/src/tool/webpAPng/i18n/fr.ts +122 -0
  169. package/src/tool/webpAPng/index.ts +29 -0
  170. package/src/tool/webpAPng/seo.astro +14 -0
  171. package/src/tools.ts +70 -0
  172. package/src/types.ts +69 -0
package/src/data.ts ADDED
@@ -0,0 +1,34 @@
1
+ export { pngAJpg } from './tool/pngAJpg';
2
+ export { jpgAPng } from './tool/jpgAPng';
3
+ export { webpAPng } from './tool/webpAPng';
4
+ export { webpAJpg } from './tool/webpAJpg';
5
+ export { pngAWebp } from './tool/pngAWebp';
6
+ export { jpgAWebp } from './tool/jpgAWebp';
7
+ export { svgAPng } from './tool/svgAPng';
8
+ export { svgAJpg } from './tool/svgAJpg';
9
+ export { imagenBase64 } from './tool/imagenBase64';
10
+ export { bmpAJpg } from './tool/bmpAJpg';
11
+ export { bmpAPng } from './tool/bmpAPng';
12
+ export { bmpAWebp } from './tool/bmpAWebp';
13
+ export { avifAJpg } from './tool/avifAJpg';
14
+ export { avifAPng } from './tool/avifAPng';
15
+ export { avifAWebp } from './tool/avifAWebp';
16
+ export { gifAJpg } from './tool/gifAJpg';
17
+ export { gifAPng } from './tool/gifAPng';
18
+ export { gifAWebp } from './tool/gifAWebp';
19
+ export { pngAIco } from './tool/pngAIco';
20
+ export { jpgAIco } from './tool/jpgAIco';
21
+ export { webpAIco } from './tool/webpAIco';
22
+ export { convertersCategory } from './category';
23
+
24
+ export type { ImageConverterUI } from './shared/ImageConverter.astro';
25
+ export type { ImageToBase64UI } from './tool/imagenBase64';
26
+
27
+ export type {
28
+ KnownLocale,
29
+ ToolLocaleContent,
30
+ CategoryLocaleContent,
31
+ LocaleMap,
32
+ ConvertersToolEntry,
33
+ ConvertersCategoryEntry,
34
+ } from './types';
package/src/env.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ declare module '*.astro' {
2
+ const Component: (_props: Record<string, unknown>) => unknown;
3
+ export default Component;
4
+ }
5
+
package/src/index.ts ADDED
@@ -0,0 +1,39 @@
1
+ export * from './tool/pngAJpg';
2
+ export * from './tool/jpgAPng';
3
+ export * from './tool/webpAPng';
4
+ export * from './tool/webpAJpg';
5
+ export * from './tool/pngAWebp';
6
+ export * from './tool/jpgAWebp';
7
+ export * from './tool/svgAPng';
8
+ export * from './tool/svgAJpg';
9
+ export * from './tool/imagenBase64';
10
+ export * from './tool/bmpAJpg';
11
+ export * from './tool/bmpAPng';
12
+ export * from './tool/bmpAWebp';
13
+ export * from './tool/avifAJpg';
14
+ export * from './tool/avifAPng';
15
+ export * from './tool/avifAWebp';
16
+ export * from './tool/gifAJpg';
17
+ export * from './tool/gifAPng';
18
+ export * from './tool/gifAWebp';
19
+ export * from './tool/pngAIco';
20
+ export * from './tool/jpgAIco';
21
+ export * from './tool/webpAIco';
22
+
23
+ export { convertersCategory } from './category';
24
+ export { default as ConvertersCategorySEO } from './category/seo.astro';
25
+
26
+ export type {
27
+ KnownLocale,
28
+ FAQItem,
29
+ BibliographyEntry,
30
+ HowToStep,
31
+ ToolLocaleContent,
32
+ CategoryLocaleContent,
33
+ LocaleLoader,
34
+ LocaleMap,
35
+ ConvertersToolEntry,
36
+ ConvertersCategoryEntry,
37
+ } from './types';
38
+
39
+ export { ALL_TOOLS } from './tools';
package/src/layouts/PreviewLayout.astro ADDED
@@ -0,0 +1,117 @@
1
+ ---
2
+ import "@jjlmoya/utils-shared/theme.css";
3
+ import PreviewToolbar from "../components/PreviewToolbar.astro";
4
+ import type { KnownLocale } from "../types";
5
+
6
+ interface Props {
7
+ title: string;
8
+ currentLocale?: KnownLocale;
9
+ localeUrls?: Partial<Record<KnownLocale, string>>;
10
+ hasSidebar?: boolean;
11
+ }
12
+
13
+ const { title, currentLocale = "es", localeUrls = {}, hasSidebar = false } = Astro.props;
14
+ ---
15
+
16
+ <!doctype html>
17
+ <html lang={currentLocale}>
18
+ <head>
19
+ <meta charset="UTF-8" />
20
+ <meta name="viewport" content="width=device-width" />
21
+ <title>{title} · preview</title>
22
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
23
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
24
+ <link
25
+ href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap"
26
+ rel="stylesheet"
27
+ />
28
+
29
+ <script is:inline>
30
+ (function () {
31
+ const saved = localStorage.getItem("theme") || "theme-dark";
32
+ document.documentElement.classList.add(saved);
33
+ })();
34
+ </script>
35
+ <slot name="head" />
36
+ </head>
37
+ <body>
38
+ <PreviewToolbar currentLocale={currentLocale} localeUrls={localeUrls} />
39
+ <div class:list={["page-wrapper", { "with-sidebar": hasSidebar }]}>
40
+ {
41
+ hasSidebar && (
42
+ <aside class="sidebar-area">
43
+ <slot name="sidebar" />
44
+ </aside>
45
+ )
46
+ }
47
+ <main>
48
+ <slot />
49
+ </main>
50
+ </div>
51
+ </body>
52
+ </html>
53
+
54
+ <style is:global>
55
+ :root {
56
+ --accent: #f43f5e;
57
+ --primary-base: #9f1239;
58
+ --cyan: #06b6d4;
59
+ }
60
+
61
+ .theme-dark,
62
+ .theme-light {
63
+ --text-main: var(--text-base);
64
+ --border-color: var(--border-base);
65
+ }
66
+
67
+ *,
68
+ *::before,
69
+ *::after {
70
+ box-sizing: border-box;
71
+ }
72
+
73
+ body {
74
+ background-color: var(--bg-page);
75
+ color: var(--text-base);
76
+ margin: 0;
77
+ min-height: 100vh;
78
+ transition:
79
+ background-color 0.3s ease,
80
+ color 0.3s ease;
81
+ }
82
+
83
+ main {
84
+ padding: 0 2rem;
85
+ }
86
+
87
+ .page-wrapper {
88
+ display: flex;
89
+ flex-direction: column;
90
+ }
91
+
92
+ .page-wrapper.with-sidebar {
93
+ display: grid;
94
+ grid-template-columns: 240px 1fr;
95
+ min-height: 100vh;
96
+ }
97
+
98
+ .sidebar-area {
99
+ position: sticky;
100
+ top: 0;
101
+ height: 100vh;
102
+ overflow-y: auto;
103
+ border-right: 1px solid var(--border-color);
104
+ background: var(--bg-page);
105
+ }
106
+
107
+ @media (max-width: 768px) {
108
+ .page-wrapper.with-sidebar {
109
+ grid-template-columns: 1fr;
110
+ }
111
+
112
+ .sidebar-area {
113
+ display: none;
114
+ }
115
+ }
116
+ </style>
117
+
package/src/pages/[locale]/[slug].astro ADDED
@@ -0,0 +1,148 @@
1
+ ---
2
+ import PreviewLayout from "../../layouts/PreviewLayout.astro";
3
+ import PreviewNavSidebar from "../../components/PreviewNavSidebar.astro";
4
+ import { ALL_TOOLS } from "../../index";
5
+ import {
6
+ UtilityHeader,
7
+ FAQSection,
8
+ Bibliography,
9
+ SEORenderer,
10
+ } from "@jjlmoya/utils-shared";
11
+ import type { KnownLocale, ToolLocaleContent } from "../../types";
12
+ import type { UtilitySEOContent } from "@jjlmoya/utils-shared";
13
+
14
+ export async function getStaticPaths() {
15
+ const paths = [];
16
+
17
+ for (const { entry, Component } of ALL_TOOLS) {
18
+ const localeEntries = Object.entries(entry.i18n) as [
19
+ KnownLocale,
20
+ () => Promise<ToolLocaleContent>,
21
+ ][];
22
+ const localeContents = await Promise.all(
23
+ localeEntries.map(async ([locale, loader]) => ({
24
+ locale,
25
+ content: await loader(),
26
+ })),
27
+ );
28
+
29
+ const localeUrls = Object.fromEntries(
30
+ localeContents.map(({ locale, content }) => [
31
+ locale,
32
+ `/${locale}/${content.slug}`,
33
+ ]),
34
+ ) as Partial<Record<KnownLocale, string>>;
35
+
36
+ for (const { locale, content } of localeContents) {
37
+ const allToolsNav = await Promise.all(
38
+ ALL_TOOLS.map(async ({ entry: navEntry }) => ({
39
+ id: navEntry.id,
40
+ title: (await navEntry.i18n[locale]!()).title,
41
+ href: `/${locale}/${(await navEntry.i18n[locale]!()).slug}`,
42
+ isActive: navEntry.id === entry.id,
43
+ })),
44
+ );
45
+ paths.push({
46
+ params: { locale, slug: content.slug },
47
+ props: { Component, locale, content, localeUrls, allToolsNav },
48
+ });
49
+ }
50
+ }
51
+
52
+ return paths;
53
+ }
54
+
55
+ type ToolComponent = (props: { ui: Record<string, string> }) => unknown;
56
+
57
+ interface NavItem {
58
+ id: string;
59
+ title: string;
60
+ href: string;
61
+ isActive?: boolean;
62
+ }
63
+
64
+ interface Props {
65
+ Component: ToolComponent;
66
+ locale: KnownLocale;
67
+ content: ToolLocaleContent;
68
+ localeUrls: Partial<Record<KnownLocale, string>>;
69
+ allToolsNav: NavItem[];
70
+ }
71
+
72
+ const { Component, locale, content, localeUrls, allToolsNav } = Astro.props;
73
+
74
+ const seoContent: UtilitySEOContent = { locale, sections: content.seo };
75
+
76
+ const words = content.title.split(" ");
77
+ const titleHighlight = words[0] || "";
78
+ const titleBase = words.slice(1).join(" ") || "";
79
+ ---
80
+
81
+ <PreviewLayout
82
+ title={content.title}
83
+ currentLocale={locale}
84
+ localeUrls={localeUrls}
85
+ hasSidebar={true}
86
+ >
87
+ <PreviewNavSidebar
88
+ slot="sidebar"
89
+ categoryTitle="Tools"
90
+ tools={allToolsNav}
91
+ />
92
+ <Fragment slot="head">
93
+ {
94
+ content.schemas.map((schema) => (
95
+ <script
96
+ is:inline
97
+ type="application/ld+json"
98
+ set:html={JSON.stringify(schema)}
99
+ />
100
+ ))
101
+ }
102
+ </Fragment>
103
+
104
+ <div class="tool-page">
105
+ <UtilityHeader
106
+ titleHighlight={titleHighlight}
107
+ titleBase={titleBase}
108
+ description={content.description}
109
+ />
110
+
111
+ <section class="section-tool">
112
+ <Component ui={content.ui} />
113
+ </section>
114
+
115
+ <section class="section-seo">
116
+ <SEORenderer content={seoContent} />
117
+ </section>
118
+
119
+ <section class="section-faq">
120
+ <FAQSection items={content.faq} inLanguage={locale} title={content.ui.faqTitle} />
121
+ </section>
122
+
123
+ <section class="section-bibliography">
124
+ <Bibliography links={content.bibliography} title={content.ui.bibliographyTitle} />
125
+ </section>
126
+ </div>
127
+ </PreviewLayout>
128
+
129
+ <style>
130
+ .tool-page {
131
+ display: flex;
132
+ flex-direction: column;
133
+ gap: 2rem;
134
+ }
135
+
136
+ .section-tool {
137
+ max-width: 1200px;
138
+ margin: 0 auto;
139
+ width: 100%;
140
+ }
141
+
142
+ .section-seo,
143
+ .section-faq,
144
+ .section-bibliography {
145
+ padding-top: 2rem;
146
+ border-top: 1px solid var(--border-color);
147
+ }
148
+ </style>
package/src/pages/[locale].astro ADDED
@@ -0,0 +1,271 @@
1
+ ---
2
+ import PreviewLayout from '../layouts/PreviewLayout.astro';
3
+ import PreviewNavSidebar from '../components/PreviewNavSidebar.astro';
4
+ import { convertersCategory, ALL_TOOLS } from '../index';
5
+ import { Icon } from 'astro-icon/components';
6
+ import type { KnownLocale, ToolLocaleContent } from '../types';
7
+
8
+ export async function getStaticPaths() {
9
+ const locales = ['en', 'es', 'fr'] as KnownLocale[];
10
+ return locales.map(locale => ({ params: { locale } }));
11
+ }
12
+
13
+ const { locale: currentLocale } = Astro.params as { locale: KnownLocale };
14
+
15
+ const categoryContent = await convertersCategory.i18n[currentLocale]!();
16
+
17
+ const tools = ALL_TOOLS || [];
18
+
19
+ const toolsWithContent = tools.length > 0
20
+ ? await Promise.all(
21
+ tools.map(async ({ entry, Component }) => {
22
+ const languages = Object.keys(entry.i18n);
23
+ const localeEntries = await Promise.all(
24
+ languages.map(async (l) => {
25
+ const content = await entry.i18n[l as KnownLocale]!();
26
+ return [l, content];
27
+ })
28
+ );
29
+
30
+ const localeContents = Object.fromEntries(localeEntries) as Record<string, ToolLocaleContent<Record<string, string>>>;
31
+
32
+ const currentLocaleContent = localeContents[currentLocale] || localeContents['en'] || localeContents['es'];
33
+ const availableLocales: Record<string, string> = {};
34
+
35
+ for (const l of languages) {
36
+ const lCont = localeContents[l];
37
+ if (lCont) {
38
+ availableLocales[l] = `/${l}/${lCont.slug}`;
39
+ }
40
+ }
41
+
42
+ return { entry, Component, locale: currentLocaleContent, availableLocales };
43
+ })
44
+ )
45
+ : [];
46
+ ---
47
+
48
+ <PreviewLayout
49
+ title={categoryContent.title}
50
+ currentLocale={currentLocale}
51
+ hasSidebar={true}
52
+ >
53
+ <PreviewNavSidebar
54
+ slot="sidebar"
55
+ categoryTitle={categoryContent.title}
56
+ tools={toolsWithContent.map(({ entry, locale, availableLocales }) => {
57
+ const href = availableLocales[currentLocale] || (locale ? `/${currentLocale}/${locale.slug}` : '#');
58
+ return {
59
+ id: entry.id,
60
+ title: locale?.title || entry.id,
61
+ href: href,
62
+ };
63
+ })}
64
+ />
65
+ <div class="dashboard">
66
+ <header class="preview-header">
67
+ <span class="badge">preview · @jjlmoya/utils-converters</span>
68
+ <h1>{categoryContent.title}</h1>
69
+ <p>{categoryContent.description}</p>
70
+ </header>
71
+
72
+ <div class="tool-list">
73
+ {toolsWithContent?.map(({ entry, locale, availableLocales }) => (
74
+ <article class="tool-card">
75
+ <a href={availableLocales?.[currentLocale] || (locale ? `/${currentLocale}/${locale.slug}` : '#')} class="tool-card-link">
76
+ <div class="tool-icons">
77
+ <div class="icon-wrapper bg">
78
+ <Icon name={entry.icons.bg} />
79
+ </div>
80
+ <div class="icon-wrapper fg">
81
+ <Icon name={entry.icons.fg} />
82
+ </div>
83
+ </div>
84
+ <div class="tool-card-content">
85
+ <h2 class="tool-title">{locale?.title}</h2>
86
+ <p class="tool-description">{locale?.description}</p>
87
+ </div>
88
+ <div class="tool-card-meta">
89
+ <span class="tool-id">{entry.id}</span>
90
+ </div>
91
+ </a>
92
+
93
+ {availableLocales && Object.keys(availableLocales).length > 1 && (
94
+ <div class="tool-locales">
95
+ {Object.entries(availableLocales).map(([l, url]) => (
96
+ <a href={url} class="locale-badge" title={`Ver en ${l.toUpperCase()}`} class:list={{ active: l === currentLocale }}>
97
+ {l.toUpperCase()}
98
+ </a>
99
+ ))}
100
+ </div>
101
+ )}
102
+ </article>
103
+ ))}
104
+ </div>
105
+ </div>
106
+ </PreviewLayout>
107
+
108
+ <style>
109
+ .dashboard {
110
+ display: flex;
111
+ flex-direction: column;
112
+ gap: 5rem;
113
+ }
114
+
115
+ .preview-header {
116
+ text-align: center;
117
+ padding-bottom: 3rem;
118
+ border-bottom: 1px solid var(--border-color);
119
+ }
120
+
121
+ .badge {
122
+ display: inline-block;
123
+ padding: 0.25rem 0.75rem;
124
+ background: var(--accent);
125
+ border-radius: 99px;
126
+ font-size: 0.7rem;
127
+ font-weight: 800;
128
+ margin-bottom: 1.5rem;
129
+ color: var(--text-base);
130
+ letter-spacing: 0.05em;
131
+ }
132
+
133
+ h1 {
134
+ font-size: clamp(2rem, 6vw, 3.5rem);
135
+ font-weight: 900;
136
+ margin: 0 0 1rem;
137
+ background: linear-gradient(to bottom, var(--text-base), var(--text-muted));
138
+ -webkit-background-clip: text;
139
+ -webkit-text-fill-color: transparent;
140
+ background-clip: text;
141
+ }
142
+
143
+ .preview-header p {
144
+ color: var(--text-muted);
145
+ font-size: 1.1rem;
146
+ margin: 0;
147
+ }
148
+
149
+ .tool-list {
150
+ display: grid;
151
+ grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
152
+ gap: 2rem;
153
+ }
154
+
155
+ .tool-card {
156
+ display: flex;
157
+ flex-direction: column;
158
+ gap: 1rem;
159
+ }
160
+
161
+ .tool-card-link {
162
+ flex: 1;
163
+ display: flex;
164
+ flex-direction: column;
165
+ padding: 1.5rem;
166
+ background: var(--bg-surface);
167
+ border: 1px solid var(--border-color);
168
+ border-radius: 0.75rem;
169
+ text-decoration: none;
170
+ transition: all 0.2s ease;
171
+ }
172
+
173
+ .tool-card-link:hover {
174
+ border-color: var(--accent);
175
+ background: var(--accent-bg);
176
+ transform: translateY(-2px);
177
+ }
178
+
179
+ .tool-icons {
180
+ display: flex;
181
+ align-items: center;
182
+ gap: 1rem;
183
+ margin-bottom: 1.25rem;
184
+ }
185
+
186
+ .icon-wrapper {
187
+ display: flex;
188
+ align-items: center;
189
+ justify-content: center;
190
+ width: 3rem;
191
+ height: 3rem;
192
+ border-radius: 0.5rem;
193
+ font-size: 1.5rem;
194
+ }
195
+
196
+ .icon-wrapper.bg {
197
+ background: var(--accent);
198
+ color: var(--text-base);
199
+ }
200
+
201
+ .icon-wrapper.fg {
202
+ background: var(--bg-page);
203
+ border: 1px solid var(--border-color);
204
+ color: var(--accent);
205
+ }
206
+
207
+ .tool-card-content {
208
+ flex: 1;
209
+ display: flex;
210
+ flex-direction: column;
211
+ }
212
+
213
+ .tool-title {
214
+ font-size: 1.25rem;
215
+ font-weight: 700;
216
+ margin: 0 0 0.5rem;
217
+ color: var(--text-base);
218
+ }
219
+
220
+ .tool-description {
221
+ font-size: 0.9375rem;
222
+ color: var(--text-muted);
223
+ line-height: 1.5;
224
+ margin: 0;
225
+ }
226
+
227
+ .tool-card-meta {
228
+ padding-top: 1rem;
229
+ border-top: 1px solid var(--border-color);
230
+ margin-top: 1.5rem;
231
+ }
232
+
233
+ .tool-id {
234
+ display: inline-block;
235
+ font-size: 0.7rem;
236
+ background: var(--bg-page);
237
+ border: 1px solid var(--border-color);
238
+ padding: 0.35rem 0.75rem;
239
+ border-radius: 0.4rem;
240
+ color: var(--accent);
241
+ font-weight: 600;
242
+ }
243
+
244
+ .tool-locales {
245
+ display: flex;
246
+ gap: 0.5rem;
247
+ flex-wrap: wrap;
248
+ }
249
+
250
+ .locale-badge {
251
+ display: inline-block;
252
+ padding: 0.4rem 0.85rem;
253
+ background: var(--bg-page);
254
+ border: 1px solid var(--border-color);
255
+ border-radius: 0.4rem;
256
+ color: var(--text-muted);
257
+ text-decoration: none;
258
+ font-size: 0.75rem;
259
+ font-weight: 600;
260
+ text-transform: uppercase;
261
+ letter-spacing: 0.05em;
262
+ transition: all 0.15s ease;
263
+ }
264
+
265
+ .locale-badge:hover,
266
+ .locale-badge.active {
267
+ color: var(--accent);
268
+ border-color: var(--accent);
269
+ background: var(--accent-bg);
270
+ }
271
+ </style>
package/src/pages/index.astro ADDED
@@ -0,0 +1,4 @@
1
+ ---
2
+ ---
3
+ <meta http-equiv="refresh" content="0;url=/es" />
4
+