* fix runtime typing for prop is not allowing string which is val…

…id as the first argument of `h()`

* fix wrongly paired parenthesis
* rename type `Type` to `RootEl`
- default value `''` for prop `text`
@ NewlineToBr.ts

- inline type `Props` to its usage @ NewlineToBr.ts & RenderFunction.ts
@ components

* enlarge default value of query client option `staleTime` to `Infinity` for preventing refetch them every five minutes @ main.ts
@ fe

fe/src/components/NewlineToBr.ts

@@ -1,23 +1,23 @@
 import type { FunctionalComponent, VNode } from 'vue';
 import { h } from 'vue';
 
-interface Props { is: Type, text?: string }
-type Type = Parameters<typeof h>[0];
+type RootEl = Parameters<typeof h>[0];
 
-const NewlineToBr: FunctionalComponent<Props> = (props: Props, ctx) =>
+// https://github.com/inouetakuya/vue-nl2br/blob/bdcbed79c6caf011c90258184555730683318f33/src/Nl2br.ts#L29
+// https://github.com/inouetakuya/vue-nl2br/pull/276/files#diff-378b333942aed9e5ad26a422b8a16d357cbf0c1a23fd663c174fd44dd28ab6b2R6
+const NewlineToBr: FunctionalComponent<{ is: RootEl, text?: string }> =
+    (props, ctx) =>
+        h(props.is, ctx.attrs, (props.text ?? '')
+            .split('\n')
+            // eslint-disable-next-line unicorn/no-array-reduce
+            .reduce((acc: Array<VNode | string>, string: string) => {
+                if (acc.length === 0)
+                    return [string];
 
-    // https://github.com/inouetakuya/vue-nl2br/blob/bdcbed79c6caf011c90258184555730683318f33/src/Nl2br.ts#L29
-    h(props.is, ctx.attrs, props.text
-        .split('\n'))
-        // eslint-disable-next-line unicorn/no-array-reduce
-        .reduce((acc: Array<VNode | string>, string: string) => {
-            if (acc.length === 0)
-                return [string];
-
-            return [...acc, h('br'), string];
-        }, []);
+                return [...acc, h('br'), string];
+            }, []));
 NewlineToBr.props = {
-    is: { type: Object, required: true },
-    text: { type: String, required: false, default: '' }
+    is: { type: [Object, String], required: true },
+    text: { type: String, required: false }
 };
 export default NewlineToBr;

fe/src/components/RenderFunction.ts

@@ -1,7 +1,7 @@
 import type { FunctionalComponent, VNode } from 'vue';
 
 // https://stackoverflow.com/questions/57962781/inject-render-method-into-template/77975171#77975171
-interface Props { renderer: VNode }
-const RenderFunction: FunctionalComponent<Props> = (props: Props) => props.renderer;
+const RenderFunction: FunctionalComponent<{ renderer: VNode }> =
+    props => props.renderer;
 RenderFunction.props = { renderer: { type: Object, required: true } };
 export default RenderFunction;

fe/src/main.ts

@@ -40,5 +40,15 @@ if (googleAnalyticsMeasurementId !== '') {
 }
 
 export const app = createApp(App).use(router).use(createHead()).use(createPinia())
-    .use(VueQueryPlugin, { queryClientConfig: { defaultOptions: { queries: { refetchOnWindowFocus: false, retry: false } } } });
+    .use(VueQueryPlugin, {
+        queryClientConfig: {
+            defaultOptions: {
+                queries: {
+                    refetchOnWindowFocus: false,
+                    staleTime: Infinity,
+                    retry: false
+                }
+            }
+        }
+    });
 app.mount('#app');