chore(release): 1.1.0

closes issue #5

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [1.1.0](https://git.lufrai.com/rappli/rappli/compare/v1.0.1...v1.1.0) (2022-07-07)
+
+
+### Features
+
+* implement error handling for QrCode generation ([9578454](https://git.lufrai.com/rappli/rappli/commit/95784540c9d447e0d35e82dbfea0d5034fd5a543)), closes [#4](https://git.lufrai.com/rappli/rappli/issues/4)
+* set maxlength 50 for iban input ([d20a449](https://git.lufrai.com/rappli/rappli/commit/d20a44990bcdf5ca23bc88959504efa24ded1f7b)), closes [#5](https://git.lufrai.com/rappli/rappli/issues/5)
+
 ### [1.0.1](https://git.lufrai.com/rappli/rappli/compare/v1.0.0...v1.0.1) (2022-07-04)
 
 

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "rappli",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "rappli",
-      "version": "1.0.1",
+      "version": "1.1.0",
       "license": "MIT",
       "dependencies": {
         "solid-start": "v0.1.0-alpha.89",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "rappli",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "bin": "./bin/rappli.js",
   "scripts": {
     "dev": "solid-start dev",

src/components/QrCode.tsx

@@ -2,10 +2,13 @@ import {
   Component,
   createEffect,
   createResource,
+  createSignal,
   JSX,
+  Show,
   splitProps,
 } from "solid-js";
 import qrcode from "qrcode";
+import WarningIcon from "~icons/carbon/warning-alt-filled";
 
 const QrCode: Component<
   {
@@ -21,15 +24,26 @@ const QrCode: Component<
   ]);
 
   let ref: HTMLDivElement = undefined!;
+  const [qrError, setQrError] = createSignal<string | undefined>();
 
   const [svg] = createResource(
     () => props.value,
-    (value) => {
-      return qrcode.toString(value, {
-        type: "svg",
-        margin: props.margin,
-        errorCorrectionLevel: props.errorCorrectionLevel as any,
-      });
+    async (value) => {
+      let svg;
+
+      try {
+        svg = await qrcode.toString(value, {
+          type: "svg",
+          margin: props.margin,
+          errorCorrectionLevel: props.errorCorrectionLevel as any,
+        });
+        setQrError();
+      } catch (err) {
+        console.error(err);
+        setQrError((err as Error).message);
+      }
+
+      return svg;
     }
   );
 
@@ -40,7 +54,17 @@ const QrCode: Component<
     });
   });
 
-  return <div ref={ref} {...rest}></div>;
+  return (
+    <>
+      <Show when={qrError()}>
+        <div class="absolute h-full p-3 gap-2 rounded-sm flex items-start bg-error/80 backdrop-blur-sm ring-2 ring-error ring-offset-2 border border-error text-error-content overflow-y-auto">
+          <WarningIcon width="2em" height="2em" class="flex-shrink-0" /> Fehler:{" "}
+          {qrError()}
+        </div>
+      </Show>
+      <div ref={ref} {...rest}></div>
+    </>
+  );
 };
 
 export default QrCode;

src/components/Settings/Overlay.tsx

@@ -492,6 +492,7 @@ const SettingsOverlay: Component = () => {
                   <TextInput
                     required
                     label="Iban"
+                    maxLength={50}
                     value={localState.iban}
                     onInput={(evt) =>
                       setLocalState("iban", evt.currentTarget.value)