@knime/hub-features 1.11.4 → 1.11.6

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @knime/hub-features
 
+## 1.11.6
+
+### Patch Changes
+
+- dc12ac4: Adjust payload for RFC error utils
+
+## 1.11.5
+
+### Patch Changes
+
+- Updated dependencies [e7d2020]
+  - @knime/components@1.33.1
+
 ## 1.11.4
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knime/hub-features",
-  "version": "1.11.4",
+  "version": "1.11.6",
   "description": "Vue components & composables for shared hub features",
   "homepage": "https://knime.github.io/webapps-common/",
   "license": "GPL 3 and Additional Permissions according to Sec. 7 (SEE the file LICENSE)",
@@ -31,7 +31,7 @@
     "lodash-es": "4.17.21",
     "ofetch": "^1.4.1",
     "typescript": "^5.4.5",
-    "@knime/components": "1.33.0",
+    "@knime/components": "1.33.1",
     "@knime/styles": "1.10.0",
     "@knime/utils": "1.5.3"
   },

package/src/rfcErrors/RFCErrorToastTemplate.vue

@@ -9,14 +9,22 @@ import CopyIcon from "@knime/styles/img/icons/copy.svg";
 interface Props {
   headline: string; // toast headline, will not be displayed here but needed when copying to clipboard
   title: string;
+  status?: number;
+  date?: Date;
   details?: string[];
-  status: number;
-  date: Date;
-  requestId: string;
+  requestId?: string;
   errorId?: string;
+  canCopyToClipboard?: boolean;
 }
 
-const props = defineProps<Props>();
+const props = withDefaults(defineProps<Props>(), {
+  status: undefined,
+  date: undefined,
+  details: () => [],
+  requestId: undefined,
+  errorId: undefined,
+  canCopyToClipboard: true,
+});
 const emits = defineEmits(["showMore"]);
 
 const { copy, copied } = useClipboard({
@@ -57,16 +65,29 @@ const errorForClipboard = computed(() => {
   errorText += `${props.title}\n\n`;
   errorText += details ? `Details: ${details}\n\n` : "";
 
-  errorText += `Status: ${props.status}\n`;
-  errorText += `Date: ${formattedDate.value}\n`;
-  errorText += `Request Id: ${props.requestId}\n`;
-  errorText += props.errorId ? `Error Id: ${props.errorId}\n` : "";
+  if (props.status !== undefined) {
+    errorText += `Status: ${props.status}\n`;
+  }
+
+  if (props.date) {
+    errorText += `Date: ${formattedDate.value}\n`;
+  }
+
+  if (props.requestId) {
+    errorText += `Request Id: ${props.requestId}\n`;
+  }
+
+  if (props.errorId) {
+    errorText += props.errorId ? `Error Id: ${props.errorId}\n` : "";
+  }
 
   return errorText;
 });
 
 const copyToClipboard = () => {
-  copy(errorForClipboard.value);
+  copy(errorForClipboard.value).catch((error) => {
+    consola.error("Failed to copy to clipboard", { error });
+  });
 };
 
 const onShowDetailsClicked = () => {
@@ -95,17 +116,20 @@ const onShowDetailsClicked = () => {
           </ul>
         </template>
       </div>
-      <div><strong>Status: </strong>{{ status }}</div>
-      <div><strong>Date: </strong>{{ formattedDate }}</div>
-      <div><strong>Request id: </strong>{{ requestId }}</div>
+
+      <div v-if="status !== undefined">
+        <strong>Status: </strong>{{ status }}
+      </div>
+      <div v-if="date"><strong>Date: </strong>{{ formattedDate }}</div>
+      <div v-if="requestId"><strong>Request id: </strong>{{ requestId }}</div>
       <div v-if="errorId"><strong>Error id: </strong>{{ errorId }}</div>
-      <div class="copy-button-wrapper">
+      <div v-if="canCopyToClipboard" class="copy-button-wrapper">
         <Button @click="copyToClipboard">
-          <template v-if="copied"
-            ><CheckIcon class="copy-icon" />Error was copied</template
-          >
-          <template v-else
-            ><CopyIcon class="copy-icon" />Copy error to clipboard
+          <template v-if="copied">
+            <CheckIcon class="copy-icon" />Error was copied
+          </template>
+          <template v-else>
+            <CopyIcon class="copy-icon" />Copy error to clipboard
           </template>
         </Button>
       </div>

package/src/rfcErrors/index.ts

@@ -12,13 +12,19 @@ import { RFCError, type RFCErrorData } from "./types";
 const toToast = ({
   headline,
   rfcError,
+  canCopyToClipboard = true,
 }: {
   headline: string;
   rfcError: RFCError;
+  canCopyToClipboard?: boolean;
 }): Toast => {
   const { data } = rfcError;
 
-  const rfcErrorToastContent = h(RFCErrorToastTemplate, { headline, ...data });
+  const rfcErrorToastContent = h(RFCErrorToastTemplate, {
+    headline,
+    ...data,
+    canCopyToClipboard,
+  });
 
   return {
     type: "error",
@@ -39,14 +45,14 @@ const tryParse = (error: FetchError): RFCError | FetchError => {
 
   const responseDate = error.response.headers.get("date")
     ? new Date(error.response.headers.get("date")!)
-    : new Date();
+    : undefined;
 
   const rfcErrorData: RFCErrorData = {
     title: error.data.title as string,
     details: error.data.details as string[] | undefined,
     status: error.statusCode as number,
     date: responseDate,
-    requestId: error.response.headers.get("x-request-id") ?? "",
+    requestId: error.response.headers.get("x-request-id") ?? undefined,
     errorId: error.response.headers.get("x-error-id") ?? undefined,
   };
 

package/src/rfcErrors/types.ts

@@ -1,12 +1,14 @@
 /**
  * Type based on an RFC-9457 error standard (https://www.rfc-editor.org/rfc/rfc9457)
+ * Also see:
+ * https://knime-com.atlassian.net/wiki/spaces/SPECS/pages/4126769212/API+Errors+Problem+Details
  */
 export type RFCErrorData = {
   title: string;
+  status?: number;
+  date?: Date;
   details?: string[];
-  status: number;
-  date: Date;
-  requestId: string;
+  requestId?: string;
   errorId?: string;
 };