client/scss/all.scss

@@ -1,44 +1,44 @@
-@import '_variables';
-@import '_reset';
-@import 'font/_font.scss';
-@import '_html';
-@import '_body';
-@import '_react-app';
-@import '_text';
+@import '~scss/_variables';
+@import '~scss/_reset';
+@import '~scss/font/_font.scss';
+@import '~scss/_html';
+@import '~scss/_body';
+@import '~scss/_react-app';
+@import '~scss/_text';
 
-@import '_link';
-@import '_input';
-@import '_select';
-@import '_textarea';
-@import '_video';
-@import '_form';
+@import '~scss/_link';
+@import '~scss/_input';
+@import '~scss/_select';
+@import '~scss/_textarea';
+@import '~scss/_video';
+@import '~scss/_form';
 
-@import '_asset-display';
-@import '_asset-preview';
-@import '_button';
-@import '_button-primary';
-@import '_button-secondary';
-@import '_click-to-copy';
-@import '_form-feedback';
-@import '_horizontal-split';
-@import '_label';
-@import '_nav-bar';
-@import '_page-layout';
-@import '_page-layout-show-lite';
-@import '_page-content';
-@import '_progress-bar';
-@import '_publish-preview';
-@import '_share-buttons';
-@import '_space-between';
-@import '_space-around';
-@import '_row';
-@import '_tooltip';
-@import '_social-share-link';
+@import '~scss/_asset-display';
+@import '~scss/_asset-preview';
+@import '~scss/_button';
+@import '~scss/_button-primary';
+@import '~scss/_button-secondary';
+@import '~scss/_click-to-copy';
+@import '~scss/_form-feedback';
+@import '~scss/_horizontal-split';
+@import '~scss/_label';
+@import '~scss/_nav-bar';
+@import '~scss/_page-layout';
+@import '~scss/_page-layout-show-lite';
+@import '~scss/_page-content';
+@import '~scss/_progress-bar';
+@import '~scss/_publish-preview';
+@import '~scss/_share-buttons';
+@import '~scss/_space-between';
+@import '~scss/_space-around';
+@import '~scss/_row';
+@import '~scss/_tooltip';
+@import '~scss/_social-share-link';
 
-@import '_channel-claims-display';
-@import '_dropzone';
-@import '_publish-url-input';
-@import '_publish-status';
-@import '_publish-disabled-message';
+@import '~scss/_channel-claims-display';
+@import '~scss/_dropzone';
+@import '~scss/_publish-url-input';
+@import '~scss/_publish-status';
+@import '~scss/_publish-disabled-message';
 
-@import '_media-queries';
+@import '~scss/_media-queries';

client/src/containers/AssetInfo/view.jsx

@@ -2,22 +2,20 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import Label from '@components/Label';
 import RowLabeled from '@components/RowLabeled';
-import Row from '@components/Row';
 import SpaceBetween from '@components/SpaceBetween';
 import AssetShareButtons from '@components/AssetShareButtons';
 import ClickToCopy from '@components/ClickToCopy';
 import HorizontalSplit from '@components/HorizontalSplit';
-
 import siteConfig from '@config/siteConfig.json';
-const { details: { host } } = siteConfig;
 import createCanonicalLink from '../../../../utils/createCanonicalLink';
 import AssetInfoFooter from '../../components/AssetInfoFooter/index';
+const { details: { host } } = siteConfig;
 
 class AssetInfo extends React.Component {
   render () {
     const { editable, asset } = this.props;
     const { claimViews, claimData } = asset;
-    const { channelName, claimId, channelShortId, description, name, fileExt, contentType, host } = claimData;
+    const { channelName, claimId, channelShortId, description, name, fileExt, contentType, host, certificateId } = claimData;
 
     const canonicalUrl = createCanonicalLink({ asset: { ...claimData, shortId: asset.shortId }});
     const assetCanonicalUrl = `${host}${canonicalUrl}`;
@@ -25,7 +23,7 @@ class AssetInfo extends React.Component {
     let channelCanonicalUrl;
     if (channelName) {
       const channel = {
-        name: channelName,
+        name   : channelName,
         shortId: channelShortId,
       };
       channelCanonicalUrl = `${createCanonicalLink({channel})}`;
@@ -116,6 +114,18 @@ class AssetInfo extends React.Component {
                 }
               />
 
+              <RowLabeled
+                label={
+                  <Label value={'ID for Robots'} />
+                }
+                content={
+                  <ClickToCopy
+                    id={'short-link'}
+                    value={`${channelName}#${certificateId}/${name}`}
+                  />
+                }
+              />
+
               <SpaceBetween>
                 <a
                   className='link--primary'
@@ -130,6 +140,13 @@ class AssetInfo extends React.Component {
                 >
                   Download
                 </a>
+                <a
+                  className={'link--primary'}
+                  href={`https://open.lbry.io/${channelName}#${certificateId}/${name}`}
+                  download={name}
+                >
+                  LBRY URL
+                </a>
                 <a
                   className={'link--primary'}
                   target='_blank'
@@ -140,7 +157,7 @@ class AssetInfo extends React.Component {
               </SpaceBetween>
             </div>
           } />
-        <AssetInfoFooter/>
+        <AssetInfoFooter />
       </div>
     );
   }

utils/createModuleAliases.js

@@ -2,6 +2,7 @@ const { statSync, existsSync, readdirSync } = require('fs');
 const { join, resolve } = require('path');
 const DEFAULT_ROOT = 'client/build';
 const CUSTOM_ROOT = 'site/custom/build';
+const DEFAULT_SCSS_ROOT = 'client/scss';
 const CUSTOM_SCSS_ROOT = 'site/custom/scss';
 
 const getFolders = path => {
@@ -23,17 +24,6 @@ const addAliasesForCustomComponentFolder = (name, aliasObject) => {
   return aliasObject;
 };
 
-const addAlliasesForSCSS = (aliasObject) => { // scss
-  // creates an alias for every folder found in the custom scss folder
-  const customScssRoot = resolve(`${CUSTOM_SCSS_ROOT}`);
-  const customFolders = getFolders(customScssRoot);
-  for (let i = 0; i < customFolders.length; i++) {
-    let folderName = customFolders[i];
-    aliasObject[folderName] = resolve(`${CUSTOM_SCSS_ROOT}/${folderName}`);
-  }
-  return aliasObject;
-};
-
 module.exports = () => {
   let moduleAliases = {};
 
@@ -58,9 +48,6 @@ module.exports = () => {
   moduleAliases['@sagas'] = resolve(`${DEFAULT_ROOT}/sagas`);
   moduleAliases['@app'] = resolve(`${DEFAULT_ROOT}/app.js`);
 
-  // scss aliases
-  moduleAliases = addAlliasesForSCSS(moduleAliases);
-
   // return finished aliases
   return moduleAliases;
 };

webpack.config.js

@@ -2,6 +2,8 @@ const Path = require('path');
 const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const createModuleAliases = require('./utils/createModuleAliases.js');
 const SCSS_ROOT = Path.join(__dirname, 'client/scss/');
+const CLIENT_ROOT = Path.join(__dirname, 'client/');
+const CUSTOM_CLIENT_ROOT = Path.join(__dirname, 'site/custom/');
 
 const customAliases = createModuleAliases();
 
@@ -38,6 +40,8 @@ module.exports = {
   },
   resolve: {
     modules: [
+      CUSTOM_CLIENT_ROOT,
+      CLIENT_ROOT,
       SCSS_ROOT,
       'node_modules',
       __dirname,