Code refactor (#35)

* Code restructuring for frontend module

* Code restructuring for frontend module

frontend/components/__init__.py

@@ -0,0 +1,4 @@
+from .authors import authors
+from .logout import logout
+from .login import login
+from .user_greetings import user_greetings

frontend/components/authors.py

@@ -0,0 +1,16 @@
+import json
+import streamlit as st
+
+def authors():
+    # {"Github → " "["username"]" "("url")" for username,url in author_details["socials"].items() }
+    # with open("frontend/contend/authors.json","r") as f:
+    #     author_details = json.load(f)
+    st.sidebar.divider()
+    st.sidebar.info(
+    """
+    Follow us on:
+    
+    Github → [@mayureshagashe2105](https://github.com/MayureshAgashe2105)\n
+    Github → [@HemanthSai7](https://github.com/HemanthSai7)
+    """
+    )

frontend/{Login.py → components/login.py}

@@ -4,7 +4,7 @@ import requests
 import streamlit as st
         
 
-def auth_page():
+def login():
 
     base_url = 'https://caffeinecrew-techdocs.hf.space'
 
@@ -53,18 +53,9 @@ def auth_page():
                 
                     st.success("Signed up successfully")
                 except:
-                    st.error("Signup Failed")   
+                    st.error("Signup Failed")
 
-
-st.sidebar.divider()
-st.sidebar.info(
-    """
-    Follow us on:
-
-    Github → [@mayureshagashe2105](https://github.com/MayureshAgashe2105)\n
-    Github → [@HemanthSai7](https://github.com/HemanthSai7)
-    """
-)
+                    
             
 
 

frontend/components/logout.py

@@ -0,0 +1,6 @@
+import streamlit as st
+
+def logout():
+    del st.session_state["access_token"]
+    del st.session_state["refresh_token"]
+    del st.session_state["username"]

frontend/components/user_greetings.py

@@ -0,0 +1,12 @@
+import streamlit as st
+from .logout import logout
+
+def user_greetings():
+    with st.sidebar.expander("🧑Account Details",expanded=True):
+        if 'username' not in st.session_state:
+            st.warning("Please Login or Signup to continue")
+        else:
+            st.info(f"Welcome, {st.session_state.username}! 😄")
+            if st.button("Logout 👋"):
+                logout()
+                st.rerun()

frontend/content/installation.md

@@ -0,0 +1,8 @@
+1. Python version requirement:
+```bash
+$ python >= 3.10
+```
+2. Install Techdocs via pip:
+```bash
+$ pip install techdocs
+```

frontend/content/working.md

@@ -0,0 +1,33 @@
+1. Navigate into your project directory.
+
+```bash
+$ cd <YOUR-PROJECT-DIRECTORY>
+```
+
+2. Once the installation is complete, type `techdocs` in the terminal. You should be able to see info about our CLI.
+
+```bash
+$ techdocs
+```
+
+3. If you are a `new user`, `signup` for a new account using the command below **OR** Head on to [Techdocs](https://techdocs.streamlit.app) and signup for a new account.
+
+```bash
+$ techdocs signup -u <username> -p <password> -e <email>
+```
+
+4. If you already have your `API KEY`, you can skip step 5.
+
+5. Generate your `API key` using the command below **OR** Head on to [Techdocs](https://techdocs.streamlit.app/demo) and generate your `API KEY`.
+
+```bash
+$ techdocs apikey -u <username> -p <password>
+```
+
+6. Once you have your `API key`, you can generate the documentation using the command below.
+
+```bash
+$ techdocs generate -k <API_KEY> -u <USERNAME> -p <PASSWORD> -d <ROOT-DIRECTORY-OF-THE-PROJECT>
+```
+
+6. Wait for the `documentation` to be generated. Your `.py` files will be parsed and the documentation will be generated in the files itself. The tool will log the progress in the terminal and the file will be updated once all the functions are parsed.

frontend/layouts/mainlayout.py

@@ -0,0 +1,27 @@
+import json
+import streamlit as st
+
+from typing import Callable
+
+from components import authors, user_greetings, login
+
+def mainlayout(func: Callable):
+    with open("layouts/st_page_layouts.json", "r",encoding='utf-8') as f:
+        st_page_layouts = json.load(f)
+    st.set_page_config(**st_page_layouts[f"{func.__name__}" if func.__name__ in st_page_layouts.keys() else "home"])
+    st.markdown("## :rainbow[Welcome to Techdocs: Where Code Meets Clarity!]🚀")
+
+    user_greetings()
+
+    if 'access_token' not in st.session_state:
+        st.session_state.runpage = login
+    else:
+        st.session_state.runpage = func
+    
+    def load_page():
+        return st.session_state.runpage()
+    load_page()
+    authors()
+
+      
+

frontend/layouts/st_page_layouts.json

@@ -0,0 +1,20 @@
+{
+  "home": {
+    "page_title": "Techdocs",
+    "layout": "wide",
+    "page_icon": "🏡",
+    "initial_sidebar_state": "expanded"
+  },
+  "demo": {
+    "page_title": "demo",
+    "layout": "wide",
+    "page_icon": "💻",
+    "initial_sidebar_state": "expanded"
+  },
+  "instructions": {
+    "page_title": "Instructions",
+    "layout": "wide",
+    "page_icon": "📝",
+    "initial_sidebar_state": "expanded"
+  }
+}

frontend/pages/{Code.py → 2_💻_Demo.py}

@@ -2,55 +2,38 @@ import json
 import requests
 
 import streamlit as st
-from Login import auth_page
+from layouts.mainlayout import mainlayout
 
-st.set_page_config(
-    page_title="Code",
-    page_icon="👨‍💻",
-    layout="wide",
-    initial_sidebar_state="expanded",
-)
 
-st.markdown("## :rainbow[Welcome to Techdocs: Where Code Meets Clarity!] 🚀")
+@mainlayout
+def demo():
 
+    def instructions():
+        with st.expander("📝Instructions",expanded=True):
+            st.info("Please note that the Streamlit app is just a demo to give the user an idea of the project. To witness the full power of Techdocs, please use the CLI. The instructions to use the CLI are listed in Usage page")     
+            st.markdown(
+                """
+                ##### 1. Generate an `API Key` from the sidebar to get started.
 
+                ##### 2. Paste the  `API Key` in the field provided.
 
-def logout():
-    del st.session_state["access_token"]
-    del st.session_state["refresh_token"]
-    del st.session_state["username"]
+                ##### 3. Paste your `code function` in the input code box.
 
-def instructions():
-    with st.expander("📝Instructions",expanded=True):
-        st.info("Please note that the Streamlit app is just a preview to give the user an idea of the project. To witness the full power of Techdocs, please use the CLI. The instructions to use the CLI are listed in Usage page")     
-        st.markdown(
-            """
-            ##### 1. Generate an `API Key` from the sidebar to get started.
+                ##### 4. Click on the `Generate Documentation` 🤖 button to generate the documentation.
+                
+                ##### 5. The `generated documentation` will be displayed in the section below.
 
-            ##### 2. Paste the  `API Key` in the field provided.
+                """
+            )
 
-            ##### 3. Paste your `code function` in the input code box.
+    base_url = 'https://caffeinecrew-techdocs.hf.space' 
 
-            ##### 4. Click on the `Generate Documentation` 🤖 button to generate the documentation.
-            
-            ##### 5. The `generated documentation` will be displayed in the section below.
-
-            """
-        )
-
-
-with st.sidebar:
-    if 'username' not in st.session_state:
-        with st.expander("🧑Account Details",expanded=True):
-            st.warning("Please Login or Signup to continue")
-    else:
-        
+    with st.sidebar:
         with st.expander("🔑 TECHDOCS-API-KEY",expanded=True):
             st.warning("Generating a new API Key will invalidate the previous one from all your projects. Do you wish to continue?")
             if st.button("Generate API KEY"):
                 with st.spinner("Generating API Key..."):
                     try:
-                        base_url = "https://caffeinecrew-techdocs.hf.space"
                         headers={"accept":"application/json", "Authorization": f"Bearer {st.session_state.access_token}"}
                         response = requests.put(url=base_url + "/auth/regenerate_api_key", headers=headers, data=json.dumps({"username":st.session_state.username}))
                         if (response.status_code!=200):
@@ -59,20 +42,9 @@ with st.sidebar:
                         st.code(response.json()["api_key"],"bash")
                         st.success("API Key Generated Successfully")
                     except Exception as e:
-                        st.error(e)
-        
-
-
-        with st.expander("🧑Account Details",expanded=True):
-            st.info(f"Welcome, {st.session_state.username}! 😄")
-            if st.button("Logout 👋"):
-                logout()
-                st.rerun()
+                        st.error(e) 
 
 
-def code_page():
-    base_url = 'https://caffeinecrew-techdocs.hf.space'
-
     def query_post(url, headers, data=None, params=None):
         response = requests.post(url, data=data, headers=headers, params=params)
         return response
@@ -101,20 +73,3 @@ def code_page():
                 comment_placeholder.markdown(f"<pre><code>{docstr}</code></pre>", unsafe_allow_html=True)
             else:
                 st.warning("Please enter some code.")
-
-st.sidebar.divider()
-st.sidebar.info(
-    """
-    Follow us on:
-
-    Github → [@mayureshagashe2105](https://github.com/MayureshAgashe2105)\n
-    Github → [@HemanthSai7](https://github.com/HemanthSai7)
-    """
-)
-
-
-if 'access_token' not in st.session_state:
-    st.session_state.runpage = auth_page  
-else:
-    st.session_state.runpage = code_page
-st.session_state.runpage()

frontend/pages/3_📝_Instructions.py

@@ -0,0 +1,23 @@
+import streamlit as st
+from PIL import Image
+
+from layouts.mainlayout import mainlayout
+
+@mainlayout
+def instructions():
+    with open("content/installation.md", "r",encoding='utf-8') as f:
+        instructions = f.read()
+
+    with open("content/working.md", "r",encoding='utf-8') as f:
+        working = f.read()
+    
+
+    st.markdown("### 📝 :rainbow[Using Techdocs via the CLI]")  
+    st.info("Please use the CLI to generate the documentation for your project. The Streamlit app is just a demo to give the user an idea of the project.")  
+    st.warning("To start using the CLI, please generate an API Key from the Streamlit app. You can also generate the API Key from the CLI.")
+
+    with st.expander("⚙️ Installation and setup"):
+        st.markdown(instructions)
+
+    with st.expander("🚀 CLI and Working", expanded=True):
+        st.markdown(working)              

frontend/pages/Usage.py

@@ -1,84 +0,0 @@
-import streamlit as st
-from Login import auth_page
-from PIL import Image
-
-st.set_page_config(
-    page_title="Usage",
-    layout="wide",
-    page_icon="📝",
-    initial_sidebar_state="expanded",
-)
-
-st.markdown("## :rainbow[Welcome to Techdocs: Where Code Meets Clarity!]🚀")
-
-def logout():
-    del st.session_state["access_token"]
-    del st.session_state["refresh_token"]
-    del st.session_state["username"]
-
-with st.sidebar.expander("🧑Account Details",expanded=True):
-    if 'username' not in st.session_state:
-        st.warning("Please Login or Signup to continue")
-    else:
-        st.info(f"Welcome, {st.session_state.username}! 😄")
-        if st.button("Logout 👋"):
-            logout()
-            st.rerun()
-
-def usage():
-    st.markdown("### :rainbow[How to use Techdocs?]")
-
-    col1,col2 = st.columns(2,gap="small")
-
-    with col1:
-
-        img = Image.open("frontend/images/image.png")
-        st.image(img)
-
-        st.caption("Boat sailing in the sea")
-
-    with col2:
-        intro_text="""
-        Now that you've arrived at this digital crossroads, you're most likely eager to dive into the world of Techdocs. Great choice! In today's fast-paced tech landscape, having well-structured and easily accessible documentation is like having a treasure map to navigate the vast ocean of code. You are probably wondering how to use Techdocs.  
-        """
-
-        text="""
-        But you might be wondering: "How do I embark on this documentation journey with Techdocs?" Fear not, because we're about to chart a course through the fascinating world of Techdocs, where clarity, efficiency, and ease-of-use are the guiding stars.
-        """
-        st.write(f'<p style="font-size:22px; color:#9c9d9f ">{intro_text}</p>', unsafe_allow_html=True)
-        st.write(f'<p style="color:#9c9d9f; font-size:22px">{text}</p>', unsafe_allow_html=True)
-
-    st.markdown("### 📝 :rainbow[Using Techdocs via the CLI]")  
-    st.info("Please use the CLI to generate the documentation for your project. The Streamlit app is just a preview to give the user an idea of the project.")  
-    st.warning("To start using the CLI, please generate an API Key from the Streamlit app. You can also generate the API Key from the CLI.")
-
-    with st.expander("⚙️ Installation and setup",expanded=True):
-        st.write("1. Create a virtual environment. We recommend using conda but you can python's venv as well:"); st.code("conda create -n techdocs python=3.11","python")
-        st.write("2. Install Techdocs via pip:"); st.code("pip install techdocs","python")
-        st.write("3. CD into your project directory.")
-        st.code("CD <YOUR-PROJECT-DIRECTORY>","bash")
-
-    with st.expander("🚀 CLI and Working", expanded=True):
-        st.write("1. Once the installation is complete, type **techdocs** in the terminal. You should be able to see info about our CLI.")
-        st.write("2. You can login into our Techdocs app using the CLI or create an account if you don't have one. To signup, type the following command in the terminal:")
-        st.code("techdocs signup -u <username> -p <password> -e <email>", "bash")
-        st.write("3. Generate an API Key from the Code page and paste it in the command below.")
-        st.code("techdocs generate -k <API_KEY> -u <USERNAME> -p <PASSWORD> -d <ROOT-DIRECTORY-OF-THE-PROJECT>","bash")
-        st.write("4. Wait for the documentation to be generated. You can view the status of the documentation generation in the CLI.")   
-
-st.sidebar.divider()
-st.sidebar.info(
-    """
-    Follow us on:
-
-    Github → [@mayureshagashe2105](https://github.com/MayureshAgashe2105)\n
-    Github → [@HemanthSai7](https://github.com/HemanthSai7)
-    """
-)
-
-
-if 'access_token' not in st.session_state:
-    st.session_state.runpage = auth_page
-else:
-    st.session_state.runpage = usage
-st.session_state.runpage()                

frontend/🏡_Home.py

@@ -1,106 +1,24 @@
 import streamlit as st
-from Login import auth_page
-
-import base64
-
-st.set_page_config(
-    page_title="Techdocs",
-    layout="wide",
-    page_icon="🏡",
-    initial_sidebar_state="expanded"
-)
-
-@st.cache_data
-def get_base64_bin_file(bin_file):
-    with open(bin_file, 'rb') as f:
-        data = f.read()
-    return base64.b64encode(data).decode()
-
-st.markdown("## :rainbow[Welcome to Techdocs: Where Code Meets Clarity!]🚀")
-
-def logout():
-    del st.session_state["access_token"]
-    del st.session_state["refresh_token"]
-    del st.session_state["username"]
-
-with st.sidebar.expander("🧑Account Details",expanded=True):
-    if 'username' not in st.session_state:
-        st.warning("Please Login or Signup to continue")
-    else:
-        st.info(f"Welcome, {st.session_state.username}! 😄")
-        if st.button("Logout 👋"):
-            logout()
-            st.rerun()
-
+from layouts.mainlayout import mainlayout
 
+@mainlayout
 def home_page():
 
-
-    def set_page_background(png_file):
-        bin_str = get_base64_bin_file(png_file)
-        page_bg_img = f'''
-            <style>
-            .stApp {{
-                background-image: url("data:image/jpg;base64,{bin_str}");
-                background-size: cover;
-                background-repeat: no-repeat;
-                background-attachment: scroll;
-            }}
-            </style>
-        '''
-        st.markdown(page_bg_img, unsafe_allow_html=True)
-
-    # set_page_background("../assets/bg.jpg") 
-
     st.markdown(
-        """
-
-    ##### Unleash the documentation dynamo that is **Techdocs**! Say goodbye to the documentation drudgery that haunts coders' dreams and embrace the effortless power of AI-driven documentation. With **Techdocs**, harness the genius of LLama2, the magic of WizardCoderLM, the versatility of Huggingface Transformers, and the precision of Langchain and Clarifai.
-
-    ## :rainbow[How Does Techdocs Work Its Magic?] 🔮
-
-    ##### Just feed your code into **Techdocs**, and like a seasoned wizard, it'll conjure up beautifully detailed documentation in an instant. Your code will transform into a masterpiece of clarity, complete with insightful comments, vivid descriptions, crystal-clear parameters, return values, and real-world examples.
+    """
+    ##### Unleash the documentation dynamo that is **Techdocs**! Say goodbye to the documentation drudgery that haunts coders' dreams and embrace the effortless power of AI-driven documentation. With **Techdocs**, harness the genius of LLama2 🦙, the magic of WizardCoderLM 🧙‍♂️, the versatility of Huggingface Transformers 🤗, and the precision of Langchain 🦜 and Clarifai 🤖.
 
     """
     )
 
     with st.expander("What Can Techdocs Do for You? 🌟",expanded=True):
         st.markdown(
-            """
-        - ##### Boost your code quality effortlessly 🚀.
-        - ##### Share your brilliance with the world in a snap 🌏.
-        - ##### Effortlessly generate documentation for your code 🤖.
-        - ##### Include comments, descriptions, parameters, return values, and real-life examples 📃.
-        - ##### Elevate your code's readability, maintainability, and quality 📃.
         """
-        )
-
-    st.markdown(
-        """
-        ##### **Techdocs** is your code's trusty companion, helping you document with ease so you can focus on what you do best: coding!. **Techdocs** is your secret weapon for leveling up your code game. Whether you're a seasoned developer or just starting your coding journey, Techdocs has got your back. Get ready to unlock the future of code documentation today! 🌟
+        - Boost your code quality effortlessly 🚀.
+        - Effortlessly generate documentation for your code 🤖.
+        - Include comments, descriptions, parameters, return values, and real-life examples 📃.
+        - Elevate your code's readability, maintainability, and quality 📃.
+        #
         """
-    )
-
-    st.markdown("""
-                ## :rainbow[Ready to use Techdocs?]
-                ##### Head over to the `Usage page` to get started!😄
-                """)
-
-
-st.sidebar.divider()
-st.sidebar.info(
-    """
-    Follow us on:
-
-    Github → [@mayureshagashe2105](https://github.com/MayureshAgashe2105)\n
-    Github → [@HemanthSai7](https://github.com/HemanthSai7)
-    """
-)
-
-
-if 'access_token' not in st.session_state:
-    st.session_state.runpage = auth_page
-else:
-    st.session_state.runpage = home_page
-st.session_state.runpage()
-
+        )
+