custom share url

static/app-strings.json

@@ -2195,5 +2195,8 @@
   "Trending for #Music": "Trending for #Music",
   "You sent %lbc% as a tip, Mahalo!": "You sent %lbc% as a tip, Mahalo!",
   "Export All": "Export All",
+  "Default share url (%name%)": "Default share url (%name%)",
+  "Custom share url": "Custom share url",
+  "Share url": "Share url",
   "--end--": "--end--"
 }

ui/component/settingShareUrl/index.js

@@ -0,0 +1,17 @@
+import { connect } from 'react-redux';
+import * as SETTINGS from 'constants/settings';
+import { doSetClientSetting } from 'redux/actions/settings';
+import { makeSelectClientSetting } from 'redux/selectors/settings';
+import SettingShareUrl from './view';
+
+const select = (state) => ({
+  customShareUrlEnabled: makeSelectClientSetting(SETTINGS.CUSTOM_SHARE_URL_ENABLED)(state),
+  customShareUrl: makeSelectClientSetting(SETTINGS.CUSTOM_SHARE_URL)(state),
+});
+
+const perform = (dispatch) => ({
+  setCustomShareUrlEnabled: (val) => dispatch(doSetClientSetting(SETTINGS.CUSTOM_SHARE_URL_ENABLED, val, true)),
+  setCustomShareUrl: (url) => dispatch(doSetClientSetting(SETTINGS.CUSTOM_SHARE_URL, url, true)),
+});
+
+export default connect(select, perform)(SettingShareUrl);

ui/component/settingShareUrl/view.jsx

@@ -0,0 +1,70 @@
+// @flow
+import { SHARE_DOMAIN_URL, URL } from 'config';
+import React from 'react';
+import { FormField } from 'component/common/form';
+
+const DEBOUNCE_TEXT_INPUT_MS = 500;
+
+type Props = {
+  customShareUrlEnabled: boolean,
+  customShareUrl: string,
+  setCustomShareUrlEnabled: (boolean) => void,
+  setCustomShareUrl: (string) => void,
+};
+
+function SettingShareUrl(props: Props) {
+  const { customShareUrlEnabled, customShareUrl, setCustomShareUrlEnabled, setCustomShareUrl } = props;
+  const [url, setUrl] = React.useState(customShareUrl);
+
+  React.useEffect(() => {
+    const timer = setTimeout(() => {
+      if (url !== customShareUrl) {
+        setCustomShareUrl(url);
+      }
+    }, DEBOUNCE_TEXT_INPUT_MS);
+
+    return () => clearTimeout(timer);
+  }, [url, customShareUrl, customShareUrlEnabled, setCustomShareUrl]);
+
+  return (
+    <React.Fragment>
+      <fieldset-section>
+        <FormField
+          type="radio"
+          name="use_default_share_url"
+          label={__('Default share url (%name%)', { name: SHARE_DOMAIN_URL || URL })}
+          checked={!customShareUrlEnabled}
+          onChange={(e) => {
+            if (e.target.checked) {
+              setCustomShareUrlEnabled(false);
+            }
+          }}
+        />
+        <FormField
+          type="radio"
+          name="use_custom_share_url"
+          label={__('Custom share url')}
+          checked={customShareUrlEnabled}
+          onChange={(e) => {
+            if (e.target.checked) {
+              setCustomShareUrlEnabled(true);
+            }
+          }}
+        />
+
+        {customShareUrlEnabled && (
+          <div className="section__body">
+            <FormField
+              type="text"
+              placeholder="https://lbryshare.com"
+              value={url}
+              onChange={(e) => setUrl(e.target.value)}
+            />
+          </div>
+        )}
+      </fieldset-section>
+    </React.Fragment>
+  );
+}
+
+export default SettingShareUrl;

ui/component/settingSystem/view.jsx

@@ -10,6 +10,7 @@ import I18nMessage from 'component/i18nMessage';
 import SettingAutoLaunch from 'component/settingAutoLaunch';
 import SettingClosingBehavior from 'component/settingClosingBehavior';
 import SettingCommentsServer from 'component/settingCommentsServer';
+import SettingShareUrl from 'component/settingShareUrl';
 import SettingsRow from 'component/settingsRow';
 import SettingWalletServer from 'component/settingWalletServer';
 import Spinner from 'component/spinner';
@@ -385,6 +386,9 @@ export default function SettingSystem(props: Props) {
             <SettingsRow title={__('Comments server')} multirow>
               <SettingCommentsServer />
             </SettingsRow>
+            <SettingsRow title={__('Share url')} multirow>
+              <SettingShareUrl />
+            </SettingsRow>
             {/* @endif */}
 
             <SettingsRow

ui/component/socialShare/index.js

@@ -3,6 +3,8 @@ import { makeSelectClaimForUri, makeSelectTitleForUri } from 'redux/selectors/cl
 import SocialShare from './view';
 import { selectUserInviteReferralCode, selectUser } from 'redux/selectors/user';
 import { makeSelectContentPositionForUri } from 'redux/selectors/content';
+import { makeSelectClientSetting } from 'redux/selectors/settings';
+import * as SETTINGS from 'constants/settings';
 
 const select = (state, props) => ({
   claim: makeSelectClaimForUri(props.uri)(state),
@@ -10,6 +12,8 @@ const select = (state, props) => ({
   user: selectUser(state),
   title: makeSelectTitleForUri(props.uri)(state),
   position: makeSelectContentPositionForUri(props.uri)(state),
+  customShareUrlEnabled: makeSelectClientSetting(SETTINGS.CUSTOM_SHARE_URL_ENABLED)(state),
+  customShareUrl: makeSelectClientSetting(SETTINGS.CUSTOM_SHARE_URL)(state),
 });
 
 export default connect(select)(SocialShare);

ui/component/socialShare/view.jsx

@@ -26,10 +26,22 @@ type Props = {
   user: any,
   position: number,
   collectionId?: number,
+  customShareUrlEnabled: boolean,
+  customShareUrl: string,
 };
 
 function SocialShare(props: Props) {
-  const { claim, title, referralCode, user, webShareable, position, collectionId } = props;
+  const {
+    claim,
+    title,
+    referralCode,
+    user,
+    webShareable,
+    position,
+    collectionId,
+    customShareUrlEnabled,
+    customShareUrl,
+  } = props;
   const [showEmbed, setShowEmbed] = React.useState(false);
   const [includeCollectionId, setIncludeCollectionId] = React.useState(Boolean(collectionId)); // unless it *is* a collection?
   const [showClaimLinks, setShowClaimLinks] = React.useState(false);
@@ -37,6 +49,7 @@ function SocialShare(props: Props) {
   const [startTime, setStartTime]: [string, any] = React.useState(secondsToHms(position));
   const startTimeSeconds: number = hmsToSeconds(startTime);
   const isMobile = useIsMobile();
+  const shareDomain = customShareUrlEnabled && customShareUrl ? customShareUrl : SHARE_DOMAIN;
 
   if (!claim) {
     return null;
@@ -54,14 +67,14 @@ function SocialShare(props: Props) {
   const lbryWebUrl: string = generateLbryWebUrl(lbryUrl);
   const includedCollectionId = collectionId && includeCollectionId ? collectionId : null;
   const encodedLbryURL: string = generateEncodedLbryURL(
-    SHARE_DOMAIN,
+    shareDomain,
     lbryWebUrl,
     includeStartTime,
     startTimeSeconds,
     includedCollectionId
   );
   const shareUrl: string = generateShareUrl(
-    SHARE_DOMAIN,
+    shareDomain,
     lbryUrl,
     referralCode,
     rewardsApproved,

ui/constants/settings.js

@@ -41,6 +41,8 @@ export const VIDEO_THEATER_MODE = 'video_theater_mode';
 export const VIDEO_PLAYBACK_RATE = 'video_playback_rate';
 export const CUSTOM_COMMENTS_SERVER_ENABLED = 'custom_comments_server_enabled';
 export const CUSTOM_COMMENTS_SERVER_URL = 'custom_comments_server_url';
+export const CUSTOM_SHARE_URL_ENABLED = 'custom_share_url_enabled';
+export const CUSTOM_SHARE_URL = 'custom_share_url';
 
 export const SETTINGS_GRP = {
   APPEARANCE: 'appearance',

ui/redux/reducers/settings.js

@@ -55,6 +55,8 @@ const defaultState = {
     [SETTINGS.DESKTOP_WINDOW_ZOOM]: 1,
     [SETTINGS.CUSTOM_COMMENTS_SERVER_ENABLED]: false,
     [SETTINGS.CUSTOM_COMMENTS_SERVER_URL]: '',
+    [SETTINGS.CUSTOM_SHARE_URL_ENABLED]: false,
+    [SETTINGS.CUSTOM_SHARE_URL]: '',
 
     [SETTINGS.DARK_MODE_TIMES]: {
       from: { hour: '21', min: '00', formattedTime: '21:00' },