Beta

Dockerfile

@@ -1,11 +1,12 @@
-FROM node:16.1 as build
+FROM node:18.18.0 as build
 
 WORKDIR /var/app
 COPY . /var/app
+ENV NODE_OPTIONS --openssl-legacy-provider
 RUN yarn install
-RUN yarn build-version && yarn build
+RUN yarn build-version && export NODE_OPTIONS=--openssl-legacy-provider && yarn build
 
-FROM node:16.1-alpine
+FROM node:18.18.0-alpine
 
 WORKDIR /var/app
 
@@ -15,6 +16,7 @@ ENV SOURCE_COMMIT ${SOURCE_COMMIT}
 COPY --from=build /var/app /var/app
 ENV PORT 8080
 ENV NODE_ENV production
+ENV NODE_OPTIONS --openssl-legacy-provider
 
 EXPOSE 8080
 CMD [ "yarn", "run", "prod" ]

README.md

@@ -25,7 +25,7 @@ sudo docker-compose up
 #### Install for Development mode
 
 ```bash
-curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -
+curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
 
 sudo apt-get install -y nodejs
 
@@ -71,4 +71,4 @@ We adhere to BEM methodology with exception for Foundation classes, here is an e
   <!-- Element with modifier -->
   <li class="Header__menu-item--selected">Element with modifier</li>
 </ul>
-```
+```

app/ResolveRoute.js

@@ -1,9 +1,9 @@
 export const routeRegex = {
     PostsIndex: /^\/(@[\w\.\d-]+)\/feed\/?$/,
     UserProfile1: /^\/(@[\w\.\d-]+)\/?$/,
-    UserProfile2: /^\/(@[\w\.\d-]+)\/(blog|posts|comments|reputation|mentions|created|recent-replies|discussions|feed|followed|followers|settings)\/??(?:&?[^=&]*=[^=&]*)*$/,
+    UserProfile2: /^\/(@[\w\.\d-]+)\/(blog|posts|comments|reputation|mentions|created|recent-replies|discussions|feed|followed|followers|sponsors|settings)\/??(?:&?[^=&]*=[^=&]*)*$/,
     UserProfile3: /^\/(@[\w\.\d-]+)\/[\w\.\d-]+/,
-    UserEndPoints: /^(blog|posts|comments|reputation|mentions|created|recent-replies|discussions|feed|followed|followers|settings)$/,
+    UserEndPoints: /^(blog|posts|comments|reputation|mentions|created|recent-replies|discussions|feed|followed|followers|sponsors|settings)$/,
     CategoryFilters: /^\/(hot|responses|donates|forums|trending|promoted|allposts|allcomments|created|active)\/?$/ig,
     PostNoCategory: /^\/(@[\w\.\d-]+)\/([\w\d-]+)/,
     Post: /^\/([\w\d\-\/]+)\/(\@[\w\d\.-]+)\/([\w\d-]+)\/?($|\?)/,

app/components/App.jsx

@@ -12,7 +12,7 @@ import { createGlobalStyle } from 'styled-components'
 import AppPropTypes from 'app/utils/AppPropTypes';
 import Header from 'app/components/modules/Header';
 import Footer from 'app/components/modules/Footer';
-import AppReminder from 'app/components/elements/app/AppReminder'
+import NewsPopups from 'app/components/elements/NewsPopups'
 import URLLoader from 'app/components/elements/app/URLLoader';
 import TooltipManager from 'app/components/elements/common/TooltipManager';
 import user from 'app/redux/User';
@@ -33,8 +33,6 @@ import { APP_ICON, VEST_TICKER, } from 'app/client_config';
 import session from 'app/utils/session'
 import { loadGrayHideSettings } from 'app/utils/ContentAccess'
 
-const APP_REMINDER_INTERVAL = 30*24*60*60*1000
-
 const GlobalStyle = createGlobalStyle`
     body {
         fill: currentColor;
@@ -100,16 +98,6 @@ class App extends React.Component {
         }
     }
 
-    showAppReminder = () => {
-        if (process.env.IS_APP || typeof(localStorage) === 'undefined') {
-            return false
-        }
-        const now = Date.now()
-        let reminded = localStorage.getItem('app_reminder') || 0
-        reminded = parseInt(reminded)
-        return !reminded || (now - reminded > APP_REMINDER_INTERVAL)
-    }
-
     constructor(props) {
         super(props)
         if (process.env.BROWSER) {
@@ -380,8 +368,6 @@ class App extends React.Component {
         const noHeader = isApp
         const noFooter = isApp || location.pathname.startsWith('/submit')
 
-        const reminder = this.showAppReminder() ? <AppReminder /> : null
-
         return (
             <div
                 className={
@@ -404,7 +390,7 @@ class App extends React.Component {
                     <ChainFailure />
                     {children}
                     {noFooter ? null : <Footer />}
-                    {reminder}
+                    <NewsPopups />
                     <ScrollButton />
                 </div>
                 <Dialogs />

app/components/all.scss

@@ -39,7 +39,7 @@
 @import "./elements/VerticalMenu";
 @import "./elements/VotesAndComments";
 @import "./elements/Voting";
-@import "./elements/app/AppReminder";
+@import "./elements/NewsPopups";
 @import "./elements/common/YoutubePlayer/YoutubePlayer";
 @import "./elements/common/TelegramPlayer/TelegramPlayer";
 @import "./elements/common/Button/index";
@@ -50,6 +50,7 @@
 @import "./elements/common/DialogManager/index";
 @import "./elements/common/TooltipManager/index";
 @import "./elements/market/CMCWidget";
+@import "./elements/nft/NFTSmallIcon";
 @import "./elements/donate/Donate";
 @import "./elements/postEditor/MarkdownEditor/MarkdownEditor";
 @import "./elements/postEditor/MarkdownEditorToolbar/index";
@@ -68,11 +69,14 @@
 @import "./modules/BottomPanel";
 @import "./modules/ChangeAccount";
 @import "./modules/Footer";
+@import "./modules/GiftNFT";
 @import "./modules/Header";
 @import "./modules/LoginForm";
 @import "./modules/Settings";
 @import "./modules/SidePanel";
 @import "./modules/SignUp";
+@import "./modules/SponsorList";
+@import "./modules/SponsorSubscription";
 @import "./modules/BottomPanel";
 @import "./modules/TopRightMenu";
 @import "./modules/Modals";

app/components/cards/PostFull.jsx

@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
 import { Link } from 'react-router';
 import { connect } from 'react-redux';
 import tt from 'counterpart';
+import { Asset } from 'golos-lib-js/lib/utils'
+
 import user from 'app/redux/User';
 import transaction from 'app/redux/Transaction';
 import { repLog10, parsePayoutAmount } from 'app/utils/ParsersAndFormatters';
@@ -25,6 +27,7 @@ import CommentFormLoader from 'app/components/modules/CommentForm/loader';
 import { isBlocked } from 'app/utils/blacklist'
 import { getEditDraftPermLink } from 'app/utils/postForm';
 import { proxifyImageUrl } from 'app/utils/ProxifyUrl';
+import { makeOid } from 'app/utils/sponsors'
 import PostSummaryThumb from 'app/components/elements/PostSummaryThumb';
 import { SEO_TITLE, CHANGE_IMAGE_PROXY_TO_STEEMIT_TIME } from 'app/client_config';
 
@@ -127,13 +130,14 @@ class PostFull extends React.Component {
     }
 
     shouldComponentUpdate(props, state) {
-        const { cont, post, prevPosts, username } = this.props;
+        const { cont, post, prevPosts, username, pso } = this.props;
 
         return (
             cont !== props.cont ||
             post !== props.post ||
             prevPosts.length !== props.prevPosts.length ||
             username !== props.username ||
+            pso !== props.pso ||
             this.state !== state
         );
     }
@@ -173,6 +177,18 @@ class PostFull extends React.Component {
         this.props.deletePost(content.get('author'), content.get('permlink'));
     };
 
+    becomeSponsor = async (e) => {
+        e.preventDefault()
+
+        const { username, pso } = this.props
+        this.props.becomeSponsor(username, pso.author, pso.cost, pso.tip_cost, () => {
+            this.setState({
+                hideSponsorBtn: true
+            })
+        }, (err) => {
+        })
+    }
+
     showPromotePost = () => {
         const postContent = this.props.cont.get(this.props.post);
 
@@ -198,7 +214,7 @@ class PostFull extends React.Component {
 
         const p = extractContent(immutableAccessor, postContent);
         const content = postContent.toJS();
-        const { author, permlink, parent_author, parent_permlink, root_author } = content;
+        const { author, permlink, parent_author, parent_permlink, root_author, encrypted } = content;
         const jsonMetadata = showReply ? null : p.json_metadata;
         let link = `/@${content.author}/${content.permlink}`;
 
@@ -221,6 +237,7 @@ class PostFull extends React.Component {
             category,
             title,
             body,
+            encrypted,
         };
 
         const APP_DOMAIN = $STM_Config.site_domain;
@@ -345,7 +362,7 @@ class PostFull extends React.Component {
     }
 
     _renderContent(postContent, content, jsonMetadata, authorRepLog10) {
-        const { username, post } = this.props;
+        const { username, post, pso } = this.props;
         const { author, permlink, category } = content;
 
         const url = `/${category}/@${author}/${permlink}`;
@@ -432,6 +449,18 @@ class PostFull extends React.Component {
             </span>,
         ];
 
+        if (pso && !this.state.hideSponsorBtn && username !== author) {
+            main.push(
+                <button
+                    key="b1"
+                    className="Promote__button float-right button hollow tiny"
+                    onClick={this.becomeSponsor}
+                >
+                    {tt('poststub.become_sponsor')}
+                </button>
+            )
+        }
+
         const showPromote =
             username &&
             postContent.get('last_payout') === '1970-01-01T00:00:00' &&
@@ -440,7 +469,7 @@ class PostFull extends React.Component {
         if (showPromote) {
             main.push(
                 <button
-                    key="b1"
+                    key="b2"
                     className="Promote__button float-right button hollow tiny"
                     onClick={this.showPromotePost}
                 >
@@ -561,10 +590,13 @@ export default connect(
         let prevPosts = state.global.get('prev_posts')
         prevPosts = prevPosts ? prevPosts.toJS() : []
 
+        const pso = state.global.get('pso')
+
         return {
             ...props,
             username,
-            prevPosts
+            prevPosts,
+            pso: pso ? pso.toJS() : null
         }
     },
 
@@ -587,6 +619,35 @@ export default connect(
                 })
             );
         },
+        becomeSponsor(username, author, amount, from_tip, onSuccess, onError) {
+            let confirm = tt('poststub.for_sponsors2')
+            confirm += Asset(amount).floatString
+            if (from_tip) {
+                confirm += tt('poststub.for_sponsors3')
+            }
+            confirm += tt('poststub.for_sponsors4')
+            confirm += ' ' + tt('poststub.for_sponsors5')
+            confirm += ' ' + tt('g.are_you_sure')
+            dispatch(transaction.actions.broadcastOperation({
+                type: 'paid_subscription_transfer',
+                operation: {
+                    from: username,
+                    to: author,
+                    oid: makeOid(),
+                    amount,
+                    memo: '',
+                    from_tip,
+                },
+                confirm,
+                username,
+                successCallback: () => {
+                    onSuccess()
+                },
+                errorCallback: (err) => {
+                    onError(err)
+                }
+            }))
+        },
         showPromotePost(author, permlink) {
             dispatch({
                 type: 'global/SHOW_DIALOG',

app/components/cards/PostSummary.jsx

@@ -31,6 +31,7 @@ import {authorNameAndRep} from 'app/utils/ComponentFormatters'
 import { addHighlight, unsubscribePost } from 'app/utils/NotifyApiClient'
 import { detransliterate } from 'app/utils/ParsersAndFormatters'
 import { proxifyImageUrl } from 'app/utils/ProxifyUrl'
+import { EncryptedStates } from 'app/utils/sponsors'
 import { walletUrl } from 'app/utils/walletUtils'
 
 function isLeftClickEvent(event) {
@@ -83,7 +84,8 @@ class PostSummary extends React.Component {
                props.nsfwPref !== this.props.nsfwPref ||
                state.revealNsfw !== this.state.revealNsfw ||
                props.visited !== this.props.visited ||
-               props.gray !== this.props.gray
+               props.gray !== this.props.gray ||
+               props.encrypted !== this.props.encrypted
     }
 
     componentDidUpdate(prevProps) {
@@ -181,6 +183,9 @@ class PostSummary extends React.Component {
 
         const {gray, pictures, authorRepLog10, flagWeight, isNsfw, isOnlyblog, isOnlyapp, foreignApp} = content.get('stats', Map()).toJS()
 
+        const encrypted = content.get('encrypted')
+        const isOnlySponsors = !!encrypted
+
         if (hideSummary({
             author: content.get('author'), url: content.get('url'),
             app: content.get('app'),
@@ -263,9 +268,20 @@ class PostSummary extends React.Component {
 
         const nsfwStub = 'Not safe for work 18+'
 
+        let encStub
+        if (encrypted === EncryptedStates.wrong_format) {
+            encStub = tt('postsummary_jsx.wrong_format')
+        } else if (encrypted === EncryptedStates.unknown || encrypted === EncryptedStates.no_key) {
+            encStub = tt('postsummary_jsx.no_decrypt_key')
+        } else if (encrypted === EncryptedStates.no_sub) {
+            encStub = tt('postsummary_jsx.no_sub')
+        } else if (encrypted && encrypted !== EncryptedStates.decrypted) {
+            encStub = tt('postsummary_jsx.for_sponsors')
+        }
+
         let content_body = <div className={'PostSummary__body entry-content ' + filterClasses.join(' ')}>
             <a href={title_link_url} target={link_target} onClick={e => navigate(e, onClick, post, title_link_url, is_forum, from_search, warn)}>
-                {stubText ? nsfwStub : desc}
+                {encStub || (stubText ? nsfwStub : desc)}
             </a>
         </div>;
 
@@ -285,7 +301,8 @@ class PostSummary extends React.Component {
                 {stubText ? nsfwStub : title_text}
             </a>
             {isOnlyblog && <span className="nsfw_post" title={tt('post_editor.onlyblog_hint')}>{tt('g.for_followers')}</span>}
-            {isOnlyapp && <span className="nsfw_post" title={tt('post_editor.visible_option_onlyapp_hint')}>{tt('g.only_app')}</span>}
+            {isOnlyapp && <span className="nsfw_post">{tt('g.only_app')}</span>}
+            {isOnlySponsors && <span className="nsfw_post" title={tt('post_editor.visible_option_onlysponsors')}>{tt('g.for_sponsors')}</span>}
             {foreignApp && <ForeignApp foreignApp={foreignApp} />}
             {warn && <span className="nsfw_post" title={tt('post_editor.nsfw_hint')}>{detransliterate(nsfwTitle)}</span>}
             {worker_post && <a target="_blank" href={worker_post}><span className="worker_post">{tt('workers.worker_post')}</span></a>}
@@ -407,16 +424,18 @@ export default connect(
         let pending_payout = 0;
         let total_payout = 0;
         let event_count = 0
+        let encrypted = 0
         let gray
         if (content) {
             pending_payout = content.get('pending_payout_value');
             total_payout = content.get('total_payout_value');
             event_count = content.get('event_count')
+            encrypted = content.get('encrypted')
             const stats = content.get('stats', Map()).toJS()
             gray = stats.gray
         }
         return {
-            post, content, gray, pending_payout, total_payout, event_count,
+            post, content, gray, pending_payout, total_payout, event_count, encrypted,
             username: state.user.getIn(['current', 'username']) || state.offchain.get('account')
         };
     },