src/components/navigation/right/ChannelDebugInfo.tsx

+/* eslint-disable react-hooks/rules-of-hooks */
 import { useRenderState } from "../../../lib/renderer/Singleton";
 
 interface Props {
@@ -6,7 +7,7 @@ interface Props {
 
 export function ChannelDebugInfo({ id }: Props) {
     if (process.env.NODE_ENV !== "development") return null;
-    let view = useRenderState(id);
+    const view = useRenderState(id);
     if (!view) return null;
 
     return (

src/components/ui/Button.tsx

@@ -6,6 +6,8 @@ interface Props {
     readonly contrast?: boolean;
     readonly plain?: boolean;
     readonly error?: boolean;
+    readonly gold?: boolean;
+    readonly iconbutton?: boolean;
 }
 
 export type ButtonProps = Props &
@@ -29,7 +31,7 @@ export default styled.button<Props>`
     background: var(--primary-background);
     color: var(--foreground);
 
-    border-radius: 4px;
+    border-radius: var(--border-radius);
     cursor: pointer;
     border: none;
 
@@ -54,6 +56,14 @@ export default styled.button<Props>`
             font-size: 13px;
         `}
 
+    ${(props) =>
+        props.iconbutton &&
+        css`
+            height: 38px !important;
+            width: 38px !important;
+            min-width: unset !important;
+        `}
+
     ${(props) =>
         props.accent &&
         css`
@@ -116,4 +126,22 @@ export default styled.button<Props>`
                 background: var(--error);
             }
         `}
+    
+    ${(props) =>
+        props.gold &&
+        css`
+            color: black;
+            font-weight: 600;
+            background: goldenrod;
+
+            &:hover {
+                filter: brightness(1.2);
+                background: goldenrod;
+            }
+
+            &:disabled {
+                cursor: not-allowed;
+                background: goldenrod;
+            }
+        `}
 `;

src/components/ui/Category.tsx

@@ -44,7 +44,7 @@ type Props = Omit<
 };
 
 export default function Category(props: Props) {
-    let { text, action, ...otherProps } = props;
+    const { text, action, ...otherProps } = props;
 
     return (
         <CategoryBase {...otherProps}>