1 files changed, 32 insertions, 0 deletions
diff --git a/src/tools/json-to-csv/json-to-csv.vue b/src/tools/json-to-csv/json-to-csv.vue
new file mode 100644
index 0000000..cf15400
--- /dev/null
+++ b/src/tools/json-to-csv/json-to-csv.vue
@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import JSON5 from 'json5';
+import { convertArrayToCsv } from './json-to-csv.service';
+import type { UseValidationRule } from '@/composable/validation';
+import { withDefaultOnError } from '@/utils/defaults';
+
+function transformer(value: string) {
+  return withDefaultOnError(() => {
+    if (value === '') {
+      return '';
+    }
+    return convertArrayToCsv({ array: JSON5.parse(value) });
+  }, '');
+}
+
+const rules: UseValidationRule<string>[] = [
+  {
+    validator: (v: string) => v === '' || JSON5.parse(v),
+    message: 'Provided JSON is not valid.',
+  },
+];
+</script>
+
+<template>
+  <format-transformer
+    input-label="Your raw json"
+    input-placeholder="Paste your raw json here..."
+    output-label="CSV version of your JSON"
+    :input-validation-rules="rules"
+    :transformer="transformer"
+  />
+</template>