Hugging Face's logo

Spaces:
muhammad7456
/
project_codebase
Sleeping

App Files Community
project_codebase
File size: 5,716 Bytes
944f820
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5f07df7
 
 
 
 
 
 
 
 
 
 
 
944f820
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Codebase Oracle</title>
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;700&family=Syne:wght@400;600;700;800&display=swap" rel="stylesheet" />
  <link rel="stylesheet" href="static/style.css" />
</head>
<body>

  <!-- ── Top Bar ─────────────────────────────────────────────────────────── -->
  <header class="topbar">
    <div class="topbar__brand">
      <span class="topbar__icon">⬡</span>
      <span class="topbar__title">Codebase Oracle</span>
    </div>

    <div class="topbar__index">
      <input
        id="pathInput"
        class="path-input"
        type="text"
        placeholder="/absolute/path/to/your/codebase"
        autocomplete="off"
        spellcheck="false"
      />
      <button id="indexBtn" class="btn btn--primary">
        <span id="indexBtnText">Index</span>
        <span id="indexSpinner" class="spinner hidden"></span>
      </button>
    </div>

    <div class="topbar__zip">
      <label class="btn btn--zip" for="zipInput" id="zipLabel">
        <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
        <span id="zipLabelText">Upload ZIP</span>
      </label>
      <input id="zipInput" type="file" accept=".zip" style="display:none" />
      <button id="zipIndexBtn" class="btn btn--primary">
        <span id="zipIndexBtnText">Index ZIP</span>
        <span id="zipIndexSpinner" class="spinner hidden"></span>
      </button>
    </div>

    <div id="statusBadge" class="status-badge status-badge--idle">
      <span class="status-badge__dot"></span>
      <span id="statusText">Not indexed</span>
    </div>
  </header>

  <!-- ── Main Layout ─────────────────────────────────────────────────────── -->
  <div class="workspace">

    <!-- Sidebar -->
    <aside class="sidebar">
      <div class="sidebar__header">
        <span class="sidebar__label">Explorer</span>
        <span id="chunkCount" class="sidebar__count"></span>
      </div>
      <div id="treeContainer" class="tree-container">
        <div class="tree-placeholder">
          <span class="tree-placeholder__icon">⬡</span>
          <p>Index a codebase to explore its structure</p>
        </div>
      </div>
    </aside>

    <!-- Chat Area -->
    <main class="chat">

      <!-- Query Type Selector -->
      <div class="query-controls">
        <div class="query-type-group" id="queryTypeGroup">
          <button class="query-type-btn active" data-type="micro">Micro</button>
          <button class="query-type-btn" data-type="macro">Macro</button>
          <button class="query-type-btn" data-type="cross_module">Cross-Module</button>
        </div>

        <!-- Macro subtype (shown only when macro selected) -->
        <div id="macroSubtypes" class="macro-subtypes hidden">
          <button class="subtype-btn active" data-subtype="overall_architecture">Architecture</button>
          <button class="subtype-btn" data-subtype="module_responsibility">Module</button>
          <button class="subtype-btn" data-subtype="data_flow">Data Flow</button>
        </div>

        <!-- Contextual inputs -->
        <div id="contextInputs" class="context-inputs">
          <input id="functionInput" class="context-field" type="text" placeholder="Function name" autocomplete="off" spellcheck="false" />
          <input id="classInput"    class="context-field" type="text" placeholder="Class name (optional)" autocomplete="off" spellcheck="false" />
          <input id="moduleInput"   class="context-field hidden" type="text" placeholder="Module name" autocomplete="off" spellcheck="false" />
        </div>
      </div>

      <!-- Messages -->
      <div id="messages" class="messages">
        <div class="message message--system">
          <div class="message__content">
            <p>Welcome to <strong>Codebase Oracle</strong>. Index a codebase using the path bar above, then ask anything about it.</p>
          </div>
        </div>
      </div>

      <!-- Input Bar -->
      <div class="input-bar">
        <textarea
          id="queryInput"
          class="query-textarea"
          placeholder="Ask anything about the codebase…"
          rows="1"
          spellcheck="false"
        ></textarea>
        <button id="sendBtn" class="btn btn--send" disabled>
          <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
            <line x1="22" y1="2" x2="11" y2="13"></line>
            <polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
          </svg>
        </button>
      </div>

    </main>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/9.1.6/marked.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
  <script src="static/app.js"></script>
</body>
</html>