CosmickVisions commited on
Commit
a490b01
·
verified ·
1 Parent(s): da951f5

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +179 -88
app.py CHANGED
@@ -176,6 +176,56 @@ body {
176
  padding: 1.5rem;
177
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
178
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
179
  """
180
 
181
  # Helper functions for code analysis
@@ -652,108 +702,149 @@ with gr.Blocks(css=custom_css, theme=gr.themes.Soft()) as demo:
652
  current_session_id = gr.State(None)
653
  code_state = gr.State({})
654
 
 
655
  gr.HTML("""
656
  <div class="header">
657
- <div class="header-title">Tech-Vision AI</div>
658
- <div class="header-subtitle">Advanced Code Analysis & Technical Assistant</div>
 
 
 
 
 
 
 
 
659
  </div>
660
  """)
661
 
662
- with gr.Row(elem_classes="container"):
663
- with gr.Column(scale=1, min_width=300):
664
- file_input = gr.File(
665
- label="Upload Code File",
666
- file_types=[".py", ".js", ".java", ".cpp", ".c", ".cs", ".php", ".rb", ".go", ".ts"],
667
- type="binary"
668
- )
669
- upload_button = gr.Button("Analyze Code", variant="primary")
670
- file_status = gr.Markdown("No file uploaded yet")
671
- model_dropdown = gr.Dropdown(
672
- choices=["llama3-70b-8192", "mixtral-8x7b-32768", "gemma-7b-it"],
673
- value="llama3-70b-8192",
674
- label="Select Model"
675
- )
 
 
 
 
 
 
 
676
 
677
- # Developer Tools Section
678
- gr.Markdown("### Developer Tools", elem_classes="tool-title")
679
- with gr.Group(elem_classes="tool-container"): # Replace Box with Group
680
- with gr.Tabs():
681
- with gr.TabItem("GitHub Search"):
682
- repo_query = gr.Textbox(label="Search Query", placeholder="Enter keywords to search for repositories")
683
- with gr.Row():
684
- language = gr.Dropdown(
685
- choices=["any", "JavaScript", "Python", "Java", "C++", "TypeScript", "Go", "Rust", "PHP", "C#"],
686
- value="any",
687
- label="Language"
688
- )
689
- min_stars = gr.Dropdown(
690
- choices=["0", "10", "50", "100", "1000", "10000"],
691
- value="0",
692
- label="Min Stars"
 
 
 
 
 
 
 
693
  )
694
- sort_by = gr.Dropdown(
695
- choices=["stars", "forks", "updated"],
696
- value="stars",
697
- label="Sort By"
698
- )
699
- repo_search_btn = gr.Button("Search Repositories")
700
 
701
- with gr.TabItem("Stack Overflow"):
702
- stack_query = gr.Textbox(label="Search Query", placeholder="Enter your technical question")
703
- with gr.Row():
704
- tag = gr.Dropdown(
705
- choices=["any", "python", "javascript", "java", "c++", "react", "node.js", "android", "ios", "sql"],
706
- value="any",
707
- label="Tag"
708
- )
709
- so_sort_by = gr.Dropdown(
710
- choices=["votes", "newest", "activity"],
711
- value="votes",
712
- label="Sort By"
 
 
 
 
 
 
 
 
 
 
 
 
 
713
  )
714
- so_search_btn = gr.Button("Search Stack Overflow")
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
715
 
716
- with gr.TabItem("Code Explainer"):
717
- code_input = gr.Textbox(
718
- label="Code to Explain",
719
- placeholder="Paste your code here...",
720
- lines=10
721
- )
722
- explain_btn = gr.Button("Explain Code")
723
 
724
- with gr.Column(scale=2, min_width=600):
725
- with gr.Tabs():
726
- with gr.TabItem("Code Analysis"):
727
- with gr.Column(elem_classes="code-viewer-container"):
728
- code_metrics = gr.Markdown("No code analyzed yet", elem_classes="stats-box")
729
- code_recommendations = gr.Markdown("", elem_classes="recommendations-box")
730
 
731
- with gr.TabItem("GitHub Results"):
732
- repo_results = gr.Markdown("Search for repositories to see results here")
 
 
 
 
 
 
733
 
734
- with gr.TabItem("Stack Overflow Results"):
735
- stack_results = gr.Markdown("Search for questions to see results here")
736
-
737
- with gr.TabItem("Code Explanation"):
738
- code_explanation = gr.Markdown("Paste your code and click 'Explain Code' to see an explanation here")
739
-
740
- with gr.Row(elem_classes="container"):
741
- with gr.Column(scale=2, min_width=600):
742
- chatbot = gr.Chatbot(
743
- height=500,
744
- show_copy_button=True,
745
- elem_classes="chat-container",
746
- type="messages"
747
- )
748
- with gr.Row():
749
- msg = gr.Textbox(
750
- show_label=False,
751
- placeholder="Ask about your code, type /github to search repos, or /stack to search Stack Overflow...",
752
- scale=5
753
  )
754
- send_btn = gr.Button("Send", scale=1)
755
- clear_btn = gr.Button("Clear Conversation")
756
-
 
 
 
 
 
 
757
  # Update event handlers
758
  upload_button.click(
759
  lambda x: process_code_file(x),
 
176
  padding: 1.5rem;
177
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
178
  }
179
+
180
+ .sidebar {
181
+ background: var(--surface);
182
+ border-radius: 12px;
183
+ box-shadow: var(--shadow-md);
184
+ padding: 16px;
185
+ margin-right: 24px;
186
+ }
187
+
188
+ .main-area {
189
+ background: var(--surface);
190
+ border-radius: 12px;
191
+ padding: 24px;
192
+ box-shadow: var(--shadow-md);
193
+ }
194
+
195
+ .tabs {
196
+ border-bottom: 2px solid var(--border);
197
+ margin-bottom: 16px;
198
+ }
199
+
200
+ .tab {
201
+ padding: 12px 24px;
202
+ cursor: pointer;
203
+ transition: all 0.2s;
204
+ border-bottom: 3px solid transparent;
205
+ }
206
+
207
+ .tab.active {
208
+ border-color: var(--primary);
209
+ color: var(--primary);
210
+ }
211
+
212
+ .chat-section {
213
+ margin-top: 24px;
214
+ border: 1px solid var(--border);
215
+ border-radius: 12px;
216
+ overflow: hidden;
217
+ }
218
+
219
+ .accordion-item {
220
+ border: 1px solid var(--border);
221
+ border-radius: 8px;
222
+ margin-bottom: 12px;
223
+ }
224
+
225
+ .accordion-content {
226
+ padding: 12px;
227
+ background: var(--background);
228
+ }
229
  """
230
 
231
  # Helper functions for code analysis
 
702
  current_session_id = gr.State(None)
703
  code_state = gr.State({})
704
 
705
+ # Header Section
706
  gr.HTML("""
707
  <div class="header">
708
+ <div class="logo">
709
+ <i class="fas fa-code logo-icon"></i>
710
+ <span class="logo-text">Tech-Vision AI</span>
711
+ </div>
712
+ <div class="nav-links">
713
+ <a href="#" class="nav-link active">Code Analysis</a>
714
+ <a href="#" class="nav-link">GitHub Search</a>
715
+ <a href="#" class="nav-link">Stack Overflow</a>
716
+ <a href="#" class="nav-link">Code Explainer</a>
717
+ </div>
718
  </div>
719
  """)
720
 
721
+ # Main Content Grid
722
+ with gr.Row(elem_classes="container main-content"):
723
+ # Sidebar Column
724
+ with gr.Column(scale=1, min_width=280, elem_classes="sidebar"):
725
+ # File Upload Section
726
+ with gr.Group(elem_classes="sidebar-section"):
727
+ gr.Markdown("### Upload Code", elem_classes="sidebar-title")
728
+ file_input = gr.File(
729
+ label="Drag & drop or click to browse",
730
+ file_types=[".py", ".js", ".java", ".cpp", ".c", ".cs", ".php", ".rb", ".go", ".ts"],
731
+ type="binary",
732
+ elem_classes="file-upload"
733
+ )
734
+ upload_button = gr.Button("Analyze Code", variant="primary", elem_classes="upload-btn")
735
+ file_status = gr.Markdown("No file uploaded yet", elem_classes="file-status")
736
+ model_dropdown = gr.Dropdown(
737
+ choices=["llama3-70b-8192", "mixtral-8x7b-32768", "gemma-7b-it"],
738
+ value="llama3-70b-8192",
739
+ label="Select Model",
740
+ elem_classes="model-selection"
741
+ )
742
 
743
+ # Developer Tools Accordion
744
+ with gr.Group(elem_classes="sidebar-section"):
745
+ gr.Markdown("### Developer Tools", elem_classes="sidebar-title")
746
+ with gr.Tabs(elem_classes="accordion"):
747
+ # GitHub Search
748
+ with gr.TabItem("GitHub Search", elem_classes="accordion-item"):
749
+ with gr.Column(elem_classes="accordion-content"):
750
+ repo_query = gr.Textbox(label="Search Repositories", placeholder="Enter keywords...")
751
+ with gr.Row():
752
+ language = gr.Dropdown(
753
+ choices=["any", "JavaScript", "Python", "Java", "C++", "TypeScript", "Go", "Rust", "PHP", "C#"],
754
+ value="any",
755
+ label="Language"
756
+ )
757
+ min_stars = gr.Dropdown(
758
+ choices=["0", "10", "50", "100", "1000", "10000"],
759
+ value="0",
760
+ label="Min Stars"
761
+ )
762
+ sort_by = gr.Dropdown(
763
+ choices=["stars", "forks", "updated"],
764
+ value="stars",
765
+ label="Sort By"
766
  )
767
+ repo_search_btn = gr.Button("Search", variant="secondary")
 
 
 
 
 
768
 
769
+ # Stack Overflow
770
+ with gr.TabItem("Stack Overflow", elem_classes="accordion-item"):
771
+ with gr.Column(elem_classes="accordion-content"):
772
+ stack_query = gr.Textbox(label="Search Questions", placeholder="Enter technical question...")
773
+ with gr.Row():
774
+ tag = gr.Dropdown(
775
+ choices=["any", "python", "javascript", "java", "c++", "react", "node.js", "android", "ios", "sql"],
776
+ value="any",
777
+ label="Tag"
778
+ )
779
+ so_sort_by = gr.Dropdown(
780
+ choices=["votes", "newest", "activity"],
781
+ value="votes",
782
+ label="Sort By"
783
+ )
784
+ so_search_btn = gr.Button("Search", variant="secondary")
785
+
786
+ # Code Explainer
787
+ with gr.TabItem("Code Explainer", elem_classes="accordion-item"):
788
+ with gr.Column(elem_classes="accordion-content"):
789
+ code_input = gr.Textbox(
790
+ label="Paste Code",
791
+ placeholder="// Your code here...",
792
+ lines=8,
793
+ elem_classes="code-input"
794
  )
795
+ explain_btn = gr.Button("Explain", variant="secondary")
796
+
797
+ # Main Content Column
798
+ with gr.Column(scale=3, elem_classes="main-area"):
799
+ # Analysis Tabs
800
+ with gr.Tabs(elem_classes="tabs"):
801
+ with gr.TabItem("Code Analysis", elem_classes="tab active"):
802
+ with gr.Row(elem_classes="code-analysis"):
803
+ with gr.Column(scale=1, elem_classes="analysis-card"):
804
+ gr.Markdown("### Code Metrics", elem_classes="card-title")
805
+ with gr.Row(elem_classes="metric-grid"):
806
+ gr.Markdown("**Language:**", elem_classes="metric-label")
807
+ gr.Markdown("-", elem_classes="metric-value", elem_id="language-metric")
808
+ gr.Markdown("**Total Lines:**", elem_classes="metric-label")
809
+ gr.Markdown("0", elem_classes="metric-value", elem_id="total-lines-metric")
810
+ gr.Markdown("**Code Lines:**", elem_classes="metric-label")
811
+ gr.Markdown("0", elem_classes="metric-value", elem_id="code-lines-metric")
812
+ gr.Markdown("**Complexity:**", elem_classes="metric-label")
813
+ gr.Markdown("0", elem_classes="metric-value", elem_id="complexity-metric")
814
+ with gr.Column(scale=1, elem_classes="analysis-card"):
815
+ gr.Markdown("### Recommendations", elem_classes="card-title")
816
+ code_recommendations = gr.Markdown("Upload code to see recommendations")
817
 
818
+ with gr.TabItem("GitHub Results", elem_classes="tab"):
819
+ repo_results = gr.Markdown(elem_classes="search-results")
 
 
 
 
 
820
 
821
+ with gr.TabItem("Stack Results", elem_classes="tab"):
822
+ stack_results = gr.Markdown(elem_classes="search-results")
 
 
 
 
823
 
824
+ with gr.TabItem("Explanation", elem_classes="tab"):
825
+ code_explanation = gr.Markdown(elem_classes="code-explanation")
826
+
827
+ # Chat Section
828
+ with gr.Column(elem_classes="chat-section"):
829
+ with gr.Row(elem_classes="chat-header"):
830
+ gr.Markdown("### Tech Assistant", elem_classes="chat-title")
831
+ clear_btn = gr.Button("Clear Chat", variant="secondary", elem_classes="chat-control-btn")
832
 
833
+ chatbot = gr.Chatbot(
834
+ height=400,
835
+ elem_classes="chat-messages",
836
+ bubble_full_width=False,
837
+ show_copy_button=True
 
 
 
 
 
 
 
 
 
 
 
 
 
 
838
  )
839
+
840
+ with gr.Row(elem_classes="chat-input-area"):
841
+ msg = gr.Textbox(
842
+ placeholder="Ask about your code or type /commands...",
843
+ show_label=False,
844
+ elem_classes="chat-input"
845
+ )
846
+ send_btn = gr.Button("Send", variant="primary", elem_classes="chat-send-btn")
847
+
848
  # Update event handlers
849
  upload_button.click(
850
  lambda x: process_code_file(x),