Miko fixes 0.52.2 a2 (#7451)

* style, repost, and costinfo fixes

* fix anon collection publishing

* fix markdown images

extras/lbryinc/redux/actions/cost_info.js

@@ -1,12 +1,12 @@
 import * as ACTIONS from 'constants/action_types';
 import { Lbryio } from 'lbryinc';
-import { selectClaimsByUri } from 'redux/selectors/claims';
+import { selectClaimForUri } from 'redux/selectors/claims';
 
 // eslint-disable-next-line import/prefer-default-export
 export function doFetchCostInfoForUri(uri) {
   return (dispatch, getState) => {
     const state = getState();
-    const claim = selectClaimsByUri(state)[uri];
+    const claim = selectClaimForUri(state, uri);
 
     if (!claim) return;
 

ui/component/collectionEdit/view.jsx

@@ -273,13 +273,19 @@ function CollectionForm(props: Props) {
 
   // on mount, if we get a collectionChannel, set it.
   React.useEffect(() => {
-    if (hasClaim && !initialized) {
+    if (!initialized) {
+      if (hasClaim) {
         if (collectionChannel) {
           setActiveChannel(collectionChannel);
           setIncognito(false);
         } else if (!collectionChannel && hasClaim) {
           setIncognito(true);
         }
+      } else {
+        if (incognito) {
+          setIncognito(true);
+        }
+      }
       setInitialized(true);
     }
   }, [setInitialized, setActiveChannel, collectionChannel, setIncognito, hasClaim, incognito, initialized]);
@@ -287,9 +293,10 @@ function CollectionForm(props: Props) {
   // every time activechannel or incognito changes, set it.
   React.useEffect(() => {
     if (initialized) {
-      if (activeChannelId) {
+      if (activeChannelId && !incognito) {
         setParam({ channel_id: activeChannelId });
-      } else if (incognito) {
+      }
+      if (incognito) {
         setParam({ channel_id: undefined });
       }
     }

ui/component/common/markdown-preview.jsx

@@ -201,7 +201,7 @@ const MarkdownPreview = (props: MarkdownProps) => {
       div: React.Fragment,
       img: (imgProps) =>
         isStakeEnoughForPreview(stakedLevel) && !isEmote(imgProps.title, imgProps.src) ? (
-          ZoomableImage
+          <ZoomableImage {...imgProps} />
         ) : (
           <SimpleImageLink src={imgProps.src} alt={imgProps.alt} title={imgProps.title} />
         ),

ui/component/settingContent/view.jsx

@@ -99,6 +99,7 @@ export default function SettingContent(props: Props) {
                   }
                   setClientSetting(SETTINGS.HIDE_REPOSTS, !hideReposts);
                 }}
+                checked={hideReposts}
               />
             </SettingsRow>
             <SettingsRow title={__('Show mature content')} subtitle={__(HELP.SHOW_MATURE)}>

ui/scss/component/_header.scss

@@ -39,7 +39,7 @@
   border-bottom: none;
 
   .header__navigation {
-    padding: var(--spacing-xs);
+    padding: var(--spacing-xs) 0;
   }
 
   .header__navigationItem--logo {
@@ -65,7 +65,7 @@
   justify-content: space-between;
   flex: 1;
   height: var(--header-height);
-  padding: var(--spacing-s) var(--spacing-m);
+  padding: var(--spacing-s) 0;
   flex-wrap: nowrap;
 }
 
@@ -156,8 +156,6 @@
 }
 
 .header__navigationItem--profilePic {
-  margin-right: var(--spacing-s);
-
   .channel-thumbnail {
     height: var(--height-button);
     width: var(--height-button);

ui/scss/component/_main.scss

@@ -83,6 +83,7 @@
   margin-right: auto;
   margin-left: auto;
   min-height: calc(100vh - var(--header-height));
+  padding: 0 var(--spacing-m);
 
   @media (max-width: $breakpoint-small) {
     width: 100%;