From be919f5353e7a9c03c8d2d3849df3499f9c25089 Mon Sep 17 00:00:00 2001
From: Jaco <jacogr@gmail.com>
Date: Fri, 11 Nov 2022 10:41:36 +0200
Subject: [PATCH] Adjust preimage hash styling (#8308)

* Adjust preimage hash styling

* Fix preimage retrieval

* Adjust

* Remove debug log
---
 packages/page-democracy/src/Overview/PreImage.tsx |  2 +-
 packages/page-preimages/src/Preimages/Add.tsx     | 12 +++++++++++-
 packages/page-preimages/src/usePreimage.ts        | 14 +++++++-------
 3 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/packages/page-democracy/src/Overview/PreImage.tsx b/packages/page-democracy/src/Overview/PreImage.tsx
index d8cda092a8..3cbeba0ba2 100644
--- a/packages/page-democracy/src/Overview/PreImage.tsx
+++ b/packages/page-democracy/src/Overview/PreImage.tsx
@@ -138,7 +138,7 @@ export default React.memo(styled(PreImage)`
     text-align: right;
   }
 
-  .disabledLook input {
+  .disabledLook .ui.input > input {
     background: transparent;
     border-style: dashed;
     &:focus{
diff --git a/packages/page-preimages/src/Preimages/Add.tsx b/packages/page-preimages/src/Preimages/Add.tsx
index 8010c52634..fcb68fa170 100644
--- a/packages/page-preimages/src/Preimages/Add.tsx
+++ b/packages/page-preimages/src/Preimages/Add.tsx
@@ -4,6 +4,7 @@
 import type { SubmittableExtrinsic } from '@polkadot/api/types';
 
 import React, { useEffect, useState } from 'react';
+import styled from 'styled-components';
 
 import { Button, Extrinsic, Input, InputAddress, InputBalance, Modal, TxButton } from '@polkadot/react-components';
 import { useApi, useToggle } from '@polkadot/react-hooks';
@@ -128,4 +129,13 @@ function Add ({ className, imageHash }: Props): React.ReactElement<Props> {
   );
 }
 
-export default React.memo(Add);
+export default React.memo(styled(Add)`
+  .disabledLook .ui.input > input {
+    background: transparent;
+    border-style: dashed;
+    &:focus{
+      background: transparent;
+      border-color: #d9d8d7;
+    }
+  }
+`);
diff --git a/packages/page-preimages/src/usePreimage.ts b/packages/page-preimages/src/usePreimage.ts
index 87ccf5d6a5..987e1b6532 100644
--- a/packages/page-preimages/src/usePreimage.ts
+++ b/packages/page-preimages/src/usePreimage.ts
@@ -64,13 +64,13 @@ export function getPreimageHash (hashOrBounded: Hash | HexString | FrameSupportP
 
   const bounded = hashOrBounded as FrameSupportPreimagesBounded;
 
-  return bounded.isBasic
-    ? bounded.isInline
-      ? bounded.asInline.hash.toHex()
-      : bounded.isLegacy
-        ? bounded.asLegacy.hash_.toHex()
-        : bounded.asLookup.hash_.toHex()
-    : (hashOrBounded as Hash).toHex();
+  return bounded.isInline
+    ? bounded.asInline.hash.toHex()
+    : bounded.isLegacy
+      ? bounded.asLegacy.hash_.toHex()
+      : bounded.isLookup
+        ? bounded.asLookup.hash_.toHex()
+        : hashOrBounded.toHex();
 }
 
 function usePreimageImpl (hashOrBounded: Hash | HexString | FrameSupportPreimagesBounded): Preimage | undefined {