explorer.html

115 lines
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
{{template "main.html" .}}

{{define "title"}}{{if explorer.Repo}}{{explorer.Repo.Name}}{{if explorer.Path}} / {{explorer.Path}}{{end}}{{else}}Explorer{{end}} — Congo Dev{{end}}

{{define "content"}}
{{if explorer.Repo}}
<div class="fade-up">
<!-- Header -->
<div class="flex items-center gap-3 mb-4">
    <a href="/repos/{{explorer.Repo.ID}}" class="w-9 h-9 inline-flex items-center justify-center rounded-xl text-slate-400 hover:text-slate-600 hover:bg-white/60 transition-all btn-press" title="Back to project">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" /></svg>
    </a>
    <div class="flex-1 min-w-0">
        <h1 class="text-lg font-bold text-slate-800 truncate">{{explorer.Repo.Name}}</h1>
        {{if explorer.Repo.Branch}}
        <p class="text-[11px] text-slate-400 font-mono mt-0.5">
            <span class="inline-flex items-center gap-1">
                <svg xmlns="http://www.w3.org/2000/svg" class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M13 10V3L4 14h7v7l9-11h-7z" /></svg>
                {{explorer.Repo.Branch}}
            </span>
        </p>
        {{end}}
    </div>
    <a href="/coder/?folder=/home/coder/repos/{{explorer.Repo.Name}}" target="_blank"
       class="inline-flex items-center gap-1.5 px-3 h-8 rounded-xl text-[11px] font-medium text-slate-500 bg-white/80 border border-slate-200/60 hover:border-indigo-200 hover:text-indigo-600 transition-all hover:shadow-sm btn-press">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" /></svg>
        Open in IDE
    </a>
</div>

<!-- Breadcrumbs -->
<div class="flex items-center gap-1 text-[12px] mb-3 flex-wrap font-mono" hx-boost="true">
    {{range $i, $crumb := explorer.Breadcrumbs}}
        {{if $i}}<span class="text-slate-300">/</span>{{end}}
        {{if eq $i 0}}
        <a href="/repos/{{explorer.Repo.ID}}/files" class="text-indigo-500 hover:text-indigo-700 transition-colors font-semibold">{{$crumb.Name}}</a>
        {{else}}
        <a href="/repos/{{explorer.Repo.ID}}/files/{{$crumb.Path}}" class="text-slate-500 hover:text-indigo-600 transition-colors">{{$crumb.Name}}</a>
        {{end}}
    {{end}}
</div>

{{if explorer.NotFound}}
<!-- Not Found -->
<div class="panel-card p-8 text-center">
    <div class="inline-flex items-center justify-center w-10 h-10 rounded-xl bg-red-50 mb-3">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-red-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
    </div>
    <p class="text-slate-400 text-sm mb-3">File not found: <code class="text-red-400 bg-red-50 px-1.5 py-0.5 rounded text-[12px] font-mono">{{explorer.Path}}</code></p>
    <a href="/repos/{{explorer.Repo.ID}}/files" class="text-indigo-500 hover:text-indigo-600 text-sm transition-colors" hx-boost="true">Back to root</a>
</div>

{{else if explorer.IsFile}}
<!-- File View -->
<div class="panel-card overflow-hidden">
    <div class="flex items-center justify-between px-4 py-2.5 border-b border-slate-100">
        <div class="flex items-center gap-2">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5 text-slate-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                <path stroke-linecap="round" stroke-linejoin="round" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
            </svg>
            <span class="text-sm font-medium text-slate-700 font-mono">{{explorer.File.Name}}</span>
        </div>
        <div class="flex items-center gap-3">
            <span class="text-[10px] text-slate-400 font-mono">{{explorer.File.Lines}} lines</span>
            <span class="text-[9px] text-slate-300 bg-slate-50 px-1.5 py-0.5 rounded uppercase font-mono">{{explorer.File.Lang}}</span>
        </div>
    </div>
    <div class="source-lines overflow-x-auto">
        <div class="line-nums">{{range explorer.File.LineNums}}{{.}}
{{end}}</div>
        <pre><code class="language-{{explorer.File.Lang}}">{{explorer.File.Content}}</code></pre>
    </div>
</div>

{{else}}
<!-- Directory View -->
<div class="panel-card overflow-hidden" hx-boost="true">
    {{if explorer.Entries}}
    {{range $entry := explorer.Entries}}
    <a href="/repos/{{explorer.Repo.ID}}/files/{{$entry.Path}}" class="flex items-center justify-between gap-3 px-4 py-2 border-b border-slate-50 last:border-b-0 hover:bg-slate-50/80 transition-colors group">
        <div class="flex items-center gap-2.5 min-w-0">
            {{if $entry.IsDir}}
            <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 text-indigo-400 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                <path stroke-linecap="round" stroke-linejoin="round" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/>
            </svg>
            {{else}}
            <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4 text-slate-300 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                <path stroke-linecap="round" stroke-linejoin="round" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
            </svg>
            {{end}}
            <span class="text-[13px] font-mono truncate {{if $entry.IsDir}}text-slate-700 font-medium{{else}}text-slate-500 group-hover:text-slate-700{{end}} transition-colors">{{$entry.Name}}</span>
        </div>
        {{if $entry.Size}}<span class="text-[10px] text-slate-300 font-mono shrink-0">{{$entry.Size}}</span>{{end}}
    </a>
    {{end}}
    {{else}}
    <div class="px-4 py-8 text-center">
        <p class="text-slate-400 text-sm">Empty directory</p>
    </div>
    {{end}}
</div>
{{end}}
</div>

{{else}}
<!-- No Repo -->
<div class="text-center py-16 fade-up">
    <div class="inline-flex items-center justify-center w-12 h-12 rounded-2xl bg-slate-50 mb-3">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 text-slate-300" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
    </div>
    <p class="text-slate-400 mb-3 text-sm">Repository not found</p>
    <a href="/" class="text-indigo-500 hover:text-indigo-600 text-sm transition-colors">Back to Dashboard</a>
</div>
{{end}}
{{end}}