Merge pull request #263 from plebbit/development

Development

.github/workflows/notifications.yml

@@ -1,19 +1,19 @@
-# # send notifications to telegram group on commits, releases, issues
-# name: notifications
+# send notifications to telegram group on commits, releases, issues
+name: notifications
 
-# on:
-#   pull_request:
-#     branches:
-#       - master
-#   push:
-#     branches:
-#       - master
-#   release:
-#     types: [published]
-#   issues:
-#     types: [opened]
+on:
+  pull_request:
+    branches:
+      - master
+  # push:
+  #   branches:
+  #     - master
+  release:
+    types: [published]
+  issues:
+    types: [opened]
 
-# jobs:
+jobs:
 #   push:
 #     if: ${{ github.event_name == 'push' }}
 #     runs-on: ubuntu-latest
@@ -44,50 +44,50 @@
 #         format: html
 #         message_file: message.txt
 
-#   release:
-#     if: ${{ github.event_name == 'release' }}
-#     runs-on: ubuntu-latest
-#     steps:
-#     # - name: debug
-#     #   env:
-#     #     DEBUG: ${{ toJSON(github) }}
-#     #   run: echo "$DEBUG"
+  release:
+    if: ${{ github.event_name == 'release' }}
+    runs-on: ubuntu-latest
+    steps:
+    # - name: debug
+    #   env:
+    #     DEBUG: ${{ toJSON(github) }}
+    #   run: echo "$DEBUG"
 
-#     # write message to file
-#     - run: echo "<b>${{ github.event.repository.name }} ${{ github.event.release.name }}</b>" >> message.txt
-#     - run: echo "" >> message.txt
-#     - run: echo "${{ github.event.release.body }}" >> message.txt
-#     - run: echo "${{ github.event.release.html_url }}" >> message.txt
+    # write message to file
+    - run: echo "<b>${{ github.event.repository.name }} ${{ github.event.release.name }}</b>" >> message.txt
+    - run: echo "" >> message.txt
+    - run: echo "${{ github.event.release.body }}" >> message.txt
+    - run: echo "${{ github.event.release.html_url }}" >> message.txt
 
-#     # send message, @plebbit telegram chat id is -1001665335693
-#     - name: "telegram notification"
-#       uses: appleboy/telegram-action@master
-#       with:
-#         to: -1001665335693
-#         token: ${{ secrets.TELEGRAM_TOKEN }}
-#         format: html
-#         message_file: message.txt
+    # send message, @plebbit telegram chat id is -1001665335693
+    - name: "telegram notification"
+      uses: appleboy/telegram-action@master
+      with:
+        to: -1001665335693
+        token: ${{ secrets.TELEGRAM_TOKEN }}
+        format: html
+        message_file: message.txt
 
-#   issue:
-#     if: ${{ github.event_name == 'issues' }}
-#     runs-on: ubuntu-latest
-#     steps:
-#     # - name: debug
-#     #   env:
-#     #     DEBUG: ${{ toJSON(github) }}
-#     #   run: echo "$DEBUG"
+  issue:
+    if: ${{ github.event_name == 'issues' }}
+    runs-on: ubuntu-latest
+    steps:
+    # - name: debug
+    #   env:
+    #     DEBUG: ${{ toJSON(github) }}
+    #   run: echo "$DEBUG"
 
-#     # write message to file
-#     - run: echo "<code>${{ github.event.issue.title }}</code>" >> message.txt
-#     - run: echo "" >> message.txt
-#     - run: echo "by <i>${{ github.event.issue.user.login }}</i>" >> message.txt
-#     - run: echo "${{ github.event.issue.html_url }}" >> message.txt
+    # write message to file
+    - run: echo "<code>${{ github.event.issue.title }}</code>" >> message.txt
+    - run: echo "" >> message.txt
+    - run: echo "by <i>${{ github.event.issue.user.login }}</i>" >> message.txt
+    - run: echo "${{ github.event.issue.html_url }}" >> message.txt
 
-#     # send message, @plebbit telegram chat id is -1001665335693
-#     - name: "telegram notification"
-#       uses: appleboy/telegram-action@master
-#       with:
-#         to: -1001665335693
-#         token: ${{ secrets.TELEGRAM_TOKEN }}
-#         format: html
-#         message_file: message.txt
+    # send message, @plebbit telegram chat id is -1001665335693
+    - name: "telegram notification"
+      uses: appleboy/telegram-action@master
+      with:
+        to: -1001665335693
+        token: ${{ secrets.TELEGRAM_TOKEN }}
+        format: html
+        message_file: message.txt

src/components/edit-form/edit-form.tsx

@@ -42,8 +42,6 @@ const useEditStore = create<EditStoreState>((set) => ({
         onChallengeVerification: alertChallengeVerificationFailed,
         onError: (error: Error) => {
           console.error(error);
-          let errorMessage = error.message;
-          alert(errorMessage);
         },
       };
       return nextState;

src/components/post/comment-tools/share-menu/share-menu.tsx

@@ -11,23 +11,23 @@ type ShareMenuProps = {
 
 const ShareButton = ({ cid, subplebbitAddress }: ShareMenuProps) => {
   const { t } = useTranslation();
-  const [hasShared, setHasShared] = useState(false);
+  const [hasCopied, setHasCopied] = useState(false);
 
   useEffect(() => {
-    if (hasShared) {
-      setTimeout(() => setHasShared(false), 2000);
+    if (hasCopied) {
+      setTimeout(() => setHasCopied(false), 2000);
     }
-  }, [hasShared]);
+  }, [hasCopied]);
 
   return (
     <div
-      className={`${!hasShared ? styles.menuItem : styles.text}`}
+      className={`${!hasCopied ? styles.menuItem : styles.text}`}
       onClick={() => {
-        setHasShared(true);
+        setHasCopied(true);
         copyShareLinkToClipboard(subplebbitAddress, cid);
       }}
     >
-      {hasShared ? t('link_copied') : t('copy_link')}
+      {hasCopied ? t('link_copied') : t('copy_link')}
     </div>
   );
 };

src/components/post/embed/embed.module.css

@@ -59,7 +59,6 @@
 }
 
 .xEmbed {
-  width: 400px !important;
   height: 580px !important;
 }
 

src/components/reply-form/reply-form.tsx

@@ -1,6 +1,5 @@
 import { useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useParams } from 'react-router-dom';
 import styles from './reply-form.module.css';
 import { isValidURL } from '../../lib/utils/url-utils';
 import useReply from '../../hooks/use-reply';
@@ -10,6 +9,7 @@ type ReplyFormProps = {
   cid: string;
   isReplyingToReply?: boolean;
   hideReplyForm?: () => void;
+  subplebbitAddress: string;
 };
 
 export const FormattingHelpTable = () => {
@@ -80,11 +80,10 @@ export const FormattingHelpTable = () => {
   );
 };
 
-const ReplyForm = ({ cid, isReplyingToReply, hideReplyForm }: ReplyFormProps) => {
+const ReplyForm = ({ cid, isReplyingToReply, hideReplyForm, subplebbitAddress }: ReplyFormProps) => {
   const { t } = useTranslation();
   const [showOptions, setShowOptions] = useState(false);
   const [showFormattingHelp, setShowFormattingHelp] = useState(false);
-  const subplebbitAddress = useParams().subplebbitAddress as string;
   const { setContent, resetContent, replyIndex, publishReply } = useReply({ cid, subplebbitAddress });
 
   const mdContainerClass = isReplyingToReply ? `${styles.mdContainer} ${styles.mdContainerReplying}` : styles.mdContainer;

src/components/reply/reply.tsx

@@ -414,7 +414,7 @@ const Reply = ({ cidOfReplyWithContext, depth = 0, isSingleComment, isSingleRepl
                 showReplyForm={showReplyForm}
                 spoiler={spoiler}
               />
-              {isReplying && <ReplyForm cid={cid} isReplyingToReply={true} hideReplyForm={hideReplyForm} />}
+              {isReplying && <ReplyForm cid={cid} isReplyingToReply={true} hideReplyForm={hideReplyForm} subplebbitAddress={subplebbitAddress} />}
               {!isSingleReply &&
                 replies.map((reply, index) => {
                   return (

src/views/post-page/post-page.tsx

@@ -61,7 +61,7 @@ const Post = ({ post }: { post: Comment }) => {
             </div>
           </div>
           <div className={styles.spacer} />
-          {!isSingleComment && <ReplyForm cid={cid} />}
+          {!isSingleComment && <ReplyForm cid={cid} subplebbitAddress={subplebbitAddress} />}
           {loadingString && loadingString}
         </div>
         {isSingleComment && (

src/views/settings/address-settings/address-settings.module.css

@@ -38,18 +38,23 @@
   width: 80vw;
 }
 
-.infoButton {
-  padding: 0px 4px 0px 4px;
-  font-size: 11px;
-  position: relative;
-  bottom: 2px;
-  margin-bottom: -2px;
-}
-
 .copyAddressSetting {
   padding-bottom: 10px;
 }
 
 .copyAddressSetting button {
   margin-left: 0;
+}
+
+.cryptoAddressInfo {
+  padding: 5px 20px 5px 0;
+  word-break: break-word;
+}
+
+.cryptoAddressInfo a {
+  color: var(--text-primary);
+}
+
+.cryptoAddressInfo a:hover {
+  text-decoration: underline;
 }

src/views/settings/address-settings/address-settings.tsx

@@ -65,12 +65,6 @@ const AddressSettings = () => {
     }));
   }, [resolvedAddress, account?.signer?.address, t]);
 
-  const cryptoAddressInfo = () => {
-    alert(
-      'Change your account address to an ENS name you own: in your ENS name page on ens.domains, click on "Records", "Edit Records", "Add record", add "plebbit-author-address" as record name, add your full address as value (you can copy it from your account data) and save.',
-    );
-  };
-
   const saveCryptoAddress = async () => {
     if (!cryptoState.cryptoAddress || !cryptoState.cryptoAddress.includes('.')) {
       alert(t('enter_crypto_address'));
@@ -129,26 +123,32 @@ const AddressSettings = () => {
     }
   }, [savedCryptoAddress]);
 
+  const [showCryptoAddressInfo, setShowCryptoAddressInfo] = useState(false);
+
   return (
     <div className={styles.addressSettings}>
-      <div className={styles.copyAddressSetting}>
-        <button onClick={() => navigator.clipboard.writeText(account?.signer?.address)}>{t('copy')}</button> plebbit-author-address
-      </div>
       <div className={styles.cryptoAddressSetting}>
-        <span className={styles.settingTitle}>{t('crypto_address')}</span>
-        <button className={styles.infoButton} onClick={cryptoAddressInfo}>
-          ?
-        </button>
         <div className={styles.usernameInput}>
           <input
             type='text'
             placeholder='address.eth'
             value={cryptoState.cryptoAddress}
             onChange={(e) => setCryptoState((prevState) => ({ ...prevState, cryptoAddress: e.target.value }))}
           />
+          <button className={styles.infoButton} onClick={() => setShowCryptoAddressInfo(!showCryptoAddressInfo)}>
+            {showCryptoAddressInfo ? 'x' : '?'}
+          </button>
           <button className={styles.button} onClick={saveCryptoAddress}>
             {t('save')}
           </button>
+          {showCryptoAddressInfo && (
+            <div className={styles.cryptoAddressInfo}>
+              <a href='https://app.ens.domains/' target='_blank' rel='noopener noreferrer'>
+                app.ens.domains
+              </a>
+              {` > address.eth > records > edit records > add record > record name: "plebbit-author-address" > record value: ${account?.signer?.address} > save`}
+            </div>
+          )}
           {savedCryptoAddress && <span className={styles.saved}>{t('saved')}</span>}
         </div>
         <div className={styles.checkCryptoAddress}>

src/views/settings/avatar-settings/avatar-settings.module.css

@@ -0,0 +1,63 @@
+.avatar {
+  width: 70px;
+  height: 70px;
+  border: 1px solid var(--border-text);
+}
+
+.avatar img {
+  width: 70px;
+  height: 70px;
+}
+
+.emptyAvatar {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+  height: 100%;
+  cursor: pointer;
+}
+
+.avatarSettingsForm {
+  padding-top: 10px;
+}
+
+.avatarSettingsForm input {
+  margin-bottom: 10px;
+  width: 200px;
+  padding: 2px;
+  box-shadow: var(--box-shadow-input);
+}
+
+.avatarSettingInput input {
+  display: block;
+}
+
+.settingTitle {
+  font-style: italic;
+  text-transform: lowercase;
+}
+
+.copyMessage {
+  padding-bottom: 10px;
+}
+
+.pasteSignature span {
+  display: block;
+}
+
+.pasteSignature button {
+  margin-left: 5px;
+}
+
+.state {
+  padding-top: 10px;
+}
+
+.copyMessage a {
+  color: var(--text-primary);
+}
+
+.copyMessage a:hover {
+  text-decoration: underline;
+}