fix(react/dialogs): some type errors

apps/client/src/widgets/react/FormGroup.tsx

@@ -2,7 +2,7 @@ import { ComponentChildren, RefObject } from "preact";
 
 interface FormGroupProps {
     labelRef?: RefObject<HTMLLabelElement>;
-    label: string;
+    label?: string;
     title?: string;
     className?: string;
     children: ComponentChildren;
@@ -14,7 +14,7 @@ export default function FormGroup({ label, title, className, children, descripti
         <div className={`form-group ${className}`} title={title}
             style={{ "margin-bottom": "15px" }}>
             <label style={{ width: "100%" }} ref={labelRef}>
-                <div style={{ "margin-bottom": "10px" }}>{label}</div>
+                {label && <div style={{ "margin-bottom": "10px" }}>{label}</div> }
                 {children}
             </label>
 

apps/client/src/widgets/react/RawHtml.tsx

@@ -1,7 +1,28 @@
 interface RawHtmlProps {
-    html: string;
+    className?: string;
+    html: string | HTMLElement;
 }
 
-export default function RawHtml({ html }: RawHtmlProps) {
-    return <span dangerouslySetInnerHTML={{ __html: html }} />;
+export default function RawHtml({ className, html }: RawHtmlProps) {
+    return <span
+        className={className}
+        dangerouslySetInnerHTML={getHtml(html)}
+    />;
+}
+
+export function RawHtmlBlock({ className, html }: RawHtmlProps) {
+    return <div
+        className={className}
+        dangerouslySetInnerHTML={getHtml(html)}
+    />
+}
+
+function getHtml(html: string | HTMLElement) {
+    if (typeof html !== "string") {
+        html = html.outerHTML;
+    }
+
+    return {
+        __html: html
+    };
 }

apps/client/src/widgets/react/react_utils.ts

@@ -0,0 +1,15 @@
+import type { RefObject } from "preact";
+
+/**
+ * Takes in a React ref and returns a corresponding JQuery selector.
+ *
+ * @param ref the React ref from which to obtain the jQuery selector.
+ * @returns the corresponding jQuery selector.
+ */
+export function refToJQuerySelector<T extends HTMLElement>(ref: RefObject<T> | null): JQuery<T> {
+    if (ref?.current) {
+        return $(ref.current);
+    } else {
+        return $();
+    }
+}