From a363d13f273073593c70ab6cb9fdcdf1c275c064 Mon Sep 17 00:00:00 2001
From: teodorus-nathaniel <nathankurnia26@gmail.com>
Date: Thu, 28 Dec 2023 13:30:13 +0700
Subject: [PATCH] chore: add comment for ..., and add necessary things to make
 it run properly

---
 .../zero-to-hero/twitter-dapp/CreatingTweet.md       |  2 +-
 .../zero-to-hero/twitter-dapp/FetchingTweets.md      |  4 ++--
 docs/develop/zero-to-hero/twitter-dapp/LikeaTweet.md |  2 +-
 .../develop/zero-to-hero/twitter-dapp/LoginScreen.md | 12 ++++++++++--
 docs/develop/zero-to-hero/twitter-dapp/Styling.md    |  4 ++--
 5 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/docs/develop/zero-to-hero/twitter-dapp/CreatingTweet.md b/docs/develop/zero-to-hero/twitter-dapp/CreatingTweet.md
index 48cd40e6..f1ef1a4d 100644
--- a/docs/develop/zero-to-hero/twitter-dapp/CreatingTweet.md
+++ b/docs/develop/zero-to-hero/twitter-dapp/CreatingTweet.md
@@ -15,7 +15,7 @@ Now, Let's rewrite the **onTweetBtnClick** method of **src/components/tweet-box.
     IpfsContent
   } from '@subsocial/api/substrate/wrappers'
 
-  ...
+  // ...
 
   const SPACE_ID = '1059'
   const ACCOUNT_STORAGE_KEY = 'connected_account'
diff --git a/docs/develop/zero-to-hero/twitter-dapp/FetchingTweets.md b/docs/develop/zero-to-hero/twitter-dapp/FetchingTweets.md
index ab0a3030..00eb6424 100644
--- a/docs/develop/zero-to-hero/twitter-dapp/FetchingTweets.md
+++ b/docs/develop/zero-to-hero/twitter-dapp/FetchingTweets.md
@@ -24,7 +24,7 @@ Now, lets put this logic inside a useEffect hook on the **home.tsx** file.
 
 ```tsx
   const HomeScreen = () => {
-    ...
+    // ...
 
     const [tweets, setTweets] = useState<ITweet[]>([])
 
@@ -53,6 +53,6 @@ Now, lets put this logic inside a useEffect hook on the **home.tsx** file.
       fetchTweets()
     }, [isReady])
 
-    ...
+    // ...
   }
 ```
diff --git a/docs/develop/zero-to-hero/twitter-dapp/LikeaTweet.md b/docs/develop/zero-to-hero/twitter-dapp/LikeaTweet.md
index b571f4bc..e104e0f4 100644
--- a/docs/develop/zero-to-hero/twitter-dapp/LikeaTweet.md
+++ b/docs/develop/zero-to-hero/twitter-dapp/LikeaTweet.md
@@ -18,7 +18,7 @@ Let's add this functionality on the Dapp. Here's an example:
 It's time to add this in the codebase inside of **tweet.tsx** like this:
 
 ```tsx
-  ...
+  // ...
 
   const ACCOUNT_STORAGE_KEY = 'connected_account'
 
diff --git a/docs/develop/zero-to-hero/twitter-dapp/LoginScreen.md b/docs/develop/zero-to-hero/twitter-dapp/LoginScreen.md
index 8bf463e4..12bf0a03 100644
--- a/docs/develop/zero-to-hero/twitter-dapp/LoginScreen.md
+++ b/docs/develop/zero-to-hero/twitter-dapp/LoginScreen.md
@@ -69,6 +69,10 @@ For connecting the web app to the wallet, we need to do 2 things:
 Update the **App.tsx** file above the return statement like this, and clear everything else:
 
 ```tsx
+import { useState } from 'react'
+import polkadotjs from './subsocial/wallets/polkadotjs'
+import LoginScreen from './login'
+
 const ACCOUNT_STORAGE_KEY = 'connected_account'
 
 const App = () => {
@@ -88,8 +92,10 @@ const App = () => {
     }
   }
 
-  return ...
+  // ... continue with the rest of the code below
 }
+
+export default App
 ```
 
 #### Rendering the UI conditionally
@@ -98,7 +104,7 @@ Now, we have to make sure that the login screen UI is rendered conditionally.
 
 ```tsx
 const App = () => {
-  ...
+  // ...
 
   if(account) {
     // User is already logged-in.
@@ -109,6 +115,8 @@ const App = () => {
     onLoginClick={connectWallet}
   />
 }
+
+export default App
 ```
 
 :::info Note
diff --git a/docs/develop/zero-to-hero/twitter-dapp/Styling.md b/docs/develop/zero-to-hero/twitter-dapp/Styling.md
index 208c9b70..63fb2c3c 100644
--- a/docs/develop/zero-to-hero/twitter-dapp/Styling.md
+++ b/docs/develop/zero-to-hero/twitter-dapp/Styling.md
@@ -11,7 +11,7 @@ Follow these steps:
 1. Run the following commands:
 
    ```ts
-    yarn add -D tailwindcss postcss autoprefixer
+    yarn add -D tailwindcss postcss postcss-cli autoprefixer
    ```  
 
    ```ts
@@ -67,7 +67,7 @@ Follow these steps:
           xl: "1rem",
         },
       },
-      ...
+      // ... keep the other fields as it is
     };
   ```