diff --git a/ui/component/fileRender/view.jsx b/ui/component/fileRender/view.jsx
index 0548df1af..c9d392da4 100644
--- a/ui/component/fileRender/view.jsx
+++ b/ui/component/fileRender/view.jsx
@@ -31,7 +31,7 @@ type Props = {
   mediaType: string,
   isText: true,
   streamingUrl: string,
-  embedUrl?: string,
+  embedded?: boolean,
   contentType: string,
   claim: StreamClaim,
   currentTheme: string,
@@ -103,23 +103,12 @@ class FileRender extends React.PureComponent<Props, State> {
   }
 
   renderViewer() {
-    const {
-      mediaType,
-      currentTheme,
-      claim,
-      contentType,
-      downloadPath,
-      fileName,
-      streamingUrl,
-      embedUrl,
-      uri,
-    } = this.props;
+    const { mediaType, currentTheme, claim, contentType, downloadPath, fileName, streamingUrl, uri } = this.props;
     const fileType = fileName && path.extname(fileName).substring(1);
-    const streamUrl = embedUrl || streamingUrl;
 
     // Ideally the lbrytv api server would just replace the streaming_url returned by the sdk so we don't need this check
     // https://github.com/lbryio/lbrytv/issues/51
-    const source = IS_WEB ? generateStreamUrl(claim.name, claim.claim_id) : streamUrl;
+    const source = IS_WEB ? generateStreamUrl(claim.name, claim.claim_id) : streamingUrl;
 
     // Human-readable files (scripts and plain-text files)
     const readableFiles = ['text', 'document', 'script'];
@@ -221,11 +210,17 @@ class FileRender extends React.PureComponent<Props, State> {
     return viewer || unsupported;
   }
   render() {
-    const { isText, uri, currentlyFloating } = this.props;
+    const { isText, uri, currentlyFloating, embedded } = this.props;
     const { showAutoplayCountdown } = this.state;
 
     return (
-      <div className={classnames('file-render', { 'file-render--document': isText })}>
+      <div
+        className={classnames({
+          'file-render': !embedded,
+          'file-render--document': isText && !embedded,
+          'file-render__embed': embedded,
+        })}
+      >
         {!currentlyFloating && showAutoplayCountdown && <AutoplayCountdown uri={uri} />}
         <Suspense fallback={<div />}>{this.renderViewer()}</Suspense>
       </div>
diff --git a/ui/page/embedWrapper/index.js b/ui/page/embedWrapper/index.js
index 0894cf847..fd7ac0ec8 100644
--- a/ui/page/embedWrapper/index.js
+++ b/ui/page/embedWrapper/index.js
@@ -1,18 +1,15 @@
 import { connect } from 'react-redux';
 import EmbedWrapperPage from './view';
-import { doResolveUri, makeSelectClaimForUri } from 'lbry-redux';
-import { generateStreamUrl } from 'util/lbrytv';
+import { doResolveUri, makeSelectClaimForUri, buildURI } from 'lbry-redux';
 
 const select = (state, props) => {
-  const PROTOCOL = 'lbry://';
   const { match } = props;
   const { params } = match;
   const { claimName, claimId } = params;
-  const uri = PROTOCOL + claimName + (claimId ? `#${claimId}` : '');
+  const uri = claimName && claimId ? buildURI({ claimName, claimId }) : '';
   return {
     uri,
     claim: makeSelectClaimForUri(uri)(state),
-    streamUrl: generateStreamUrl(claimName, claimId),
   };
 };
 
diff --git a/ui/page/embedWrapper/view.jsx b/ui/page/embedWrapper/view.jsx
index 0e9d78e70..74daaa11e 100644
--- a/ui/page/embedWrapper/view.jsx
+++ b/ui/page/embedWrapper/view.jsx
@@ -7,10 +7,9 @@ type Props = {
   uri: string,
   resolveUri: string => void,
   claim: Claim,
-  streamUrl: string,
 };
 const EmbedWrapperPage = (props: Props) => {
-  const { resolveUri, claim, uri, streamUrl } = props;
+  const { resolveUri, claim, uri } = props;
   useEffect(() => {
     if (resolveUri && uri) {
       resolveUri(uri);
@@ -20,7 +19,7 @@ const EmbedWrapperPage = (props: Props) => {
   if (uri && claim) {
     return (
       <div className={'embed__wrapper'}>
-        <FileRender uri={uri} embedUrl={streamUrl} />
+        <FileRender uri={uri} embedded />
       </div>
     );
   } else {
diff --git a/ui/redux/reducers/app.js b/ui/redux/reducers/app.js
index c68cc00e7..a6a5cec2c 100644
--- a/ui/redux/reducers/app.js
+++ b/ui/redux/reducers/app.js
@@ -49,9 +49,9 @@ const defaultState: AppState = {
   daemonReady: false,
   hasSignature: false,
   badgeNumber: 0,
+  volume: 1,
   // @if TARGET='app'
   upgradeSkipped: sessionStorage.getItem('upgradeSkipped') === 'true',
-  volume: Number(sessionStorage.getItem('volume')) || 1,
   // @endif
   muted: false,
   autoUpdateDownloaded: false,
@@ -73,6 +73,10 @@ const defaultState: AppState = {
 
 // @@router comes from react-router
 // This action is dispatched any time a user navigates forward or back
+try {
+  defaultState.volume = Number(sessionStorage.getItem('volume'));
+} catch (e) {}
+
 reducers['@@router/LOCATION_CHANGE'] = (state, action) => {
   const { currentScroll } = state;
   const scrollHistory = (state.scrollHistory && state.scrollHistory.slice()) || [];