feat(gnoweb): make test files & non-gno files on $source be in a collapsible sections

gno.land/pkg/gnoweb/components/layout_test.go

@@ -0,0 +1,68 @@
+package components
+
+import (
+	"io"
+	"strings"
+	"testing"
+
+	"github.com/gnolang/gno/gno.land/pkg/gnoweb/weburl"
+	"github.com/stretchr/testify/assert"
+)
+
+func TestIndexLayout(t *testing.T) {
+	data := IndexData{
+		HeadData: HeadData{
+			Title: "Test Title",
+		},
+		BodyView: &View{
+			Type:      "test-view",
+			Component: NewReaderComponent(strings.NewReader("testdata")),
+		},
+	}
+
+	component := IndexLayout(data)
+
+	assert.NotNil(t, component, "expected component to be non-nil")
+
+	templateComponent, ok := component.(*TemplateComponent)
+	assert.True(t, ok, "expected TemplateComponent type in component")
+
+	layoutParams, ok := templateComponent.data.(indexLayoutParams)
+	assert.True(t, ok, "expected indexLayoutParams type in component data")
+
+	assert.Equal(t, FullLayout, layoutParams.Layout, "expected layout %s, got %s", FullLayout, layoutParams.Layout)
+
+	assert.NoError(t, component.Render(io.Discard))
+}
+
+func TestEnrichFooterData(t *testing.T) {
+	data := FooterData{
+		Analytics:  true,
+		AssetsPath: "/assets",
+	}
+
+	enrichedData := EnrichFooterData(data)
+
+	assert.NotEmpty(t, enrichedData.Sections, "expected sections to be populated")
+
+	expectedSections := []string{"Footer navigation", "Social media", "Legal"}
+	for i, section := range enrichedData.Sections {
+		assert.Equal(t, expectedSections[i], section.Title, "expected section title %s, got %s", expectedSections[i], section.Title)
+	}
+}
+
+func TestEnrichHeaderData(t *testing.T) {
+	data := HeaderData{
+		RealmURL: weburl.GnoURL{
+			WebQuery: map[string][]string{},
+		},
+		Breadcrumb: BreadcrumbData{
+			Parts: []BreadcrumbPart{{Name: "p/demo/grc/grc20"}},
+		},
+	}
+
+	enrichedData := EnrichHeaderData(data, true)
+
+	assert.NotEmpty(t, enrichedData.Links.General, "expected general links to be populated")
+	assert.NotEmpty(t, enrichedData.Links.Dev, "expected dev links to be populated")
+}

gno.land/pkg/gnoweb/components/ui/icons.html

@@ -246,5 +246,16 @@
         d="M12 3C10.9 3 10 3.9 10 5C10 6.1 10.9 7 12 7C13.1 7 14 6.1 14 5C14 3.9 13.1 3 12 3ZM12 17C10.9 17 10 17.9 10 19C10 20.1 10.9 21 12 21C13.1 21 14 20.1 14 19C14 17.9 13.1 17 12 17ZM12 10C10.9 10 10 10.9 10 12C10 13.1 10.9 14 12 14C13.1 14 14 13.1 14 12C14 10.9 13.1 10 12 10Z"
       />
     </symbol>
+
+    <symbol id="ico-arrow" viewBox="0 0 24 24">
+      <path
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        d="M19 9l-7 7-7-7"
+        stroke-width="2"
+        stroke="currentColor"
+        fill="transparent"
+      />
+    </symbol>
   </svg>
 {{ end }}

gno.land/pkg/gnoweb/components/ui/toc_source.html

@@ -0,0 +1,55 @@
+{{- define "ui/toc_source" }}
+<div class="space-y-4">
+  <!-- README File Section -->
+  {{ if .ReadmeFile.Link }}
+  <div>
+    <a class="flex items-center pl-5 gap-2 line-clamp-2 hover:text-green-600 hover:underline" href="{{ .ReadmeFile.Link }}">
+      <svg class="w-4 h-4 shrink-0">
+        <use href="#ico-{{ $.Icon }}"></use>
+      </svg>
+      {{ .ReadmeFile.Text }}
+    </a>
+  </div>
+  {{ end }}
+
+  <!-- Regular Files Section -->
+  <div>
+    <ul class="list-none space-y-2 pl-5 mt-2">
+      {{ range .GnoFiles }}
+      <li>
+        <a class="flex items-center gap-2 line-clamp-2 hover:text-green-600 hover:underline" href="{{ .Link }}">
+          <svg class="w-4 h-4 shrink-0">
+            <use href="#ico-{{ $.Icon }}"></use>
+          </svg>
+          {{ .Text }}
+        </a>
+      </li>
+      {{ end }}
+    </ul>
+  </div>
+
+  <!-- Test Files Section -->
+  {{ if .GnoTestFiles }}
+  <details class="group">
+    <summary class="flex items-center cursor-pointer">
+      <svg class="w-4 h-4 mr-1 group-open:rotate-180 my-auto">
+        <use href="#ico-arrow"></use>
+      </svg>
+      <h3 class="font-medium font-interVar text-100">Test Files</h3>
+    </summary>
+    <ul class="list-none space-y-2 pl-5 mt-2">
+      {{ range .GnoTestFiles }}
+      <li>
+        <a class="flex items-center gap-2 line-clamp-2 hover:text-green-600 hover:underline" href="{{ .Link }}">
+          <svg class="w-4 h-4 shrink-0">
+            <use href="#ico-{{ $.Icon }}"></use>
+          </svg>
+          {{ .Text }}
+        </a>
+      </li>
+      {{ end }}
+    </ul>
+  </details>
+  {{ end }}
+</div>
+{{ end }} 

gno.land/pkg/gnoweb/components/view_source.go

@@ -1,5 +1,9 @@
 package components
 
+import (
+	"strings"
+)
+
 const SourceViewType ViewType = "source-view"
 
 type SourceData struct {
@@ -14,8 +18,10 @@ type SourceData struct {
 }
 
 type SourceTocData struct {
-	Icon  string
-	Items []SourceTocItem
+	Icon         string
+	ReadmeFile   SourceTocItem
+	GnoFiles     []SourceTocItem
+	GnoTestFiles []SourceTocItem
 }
 
 type SourceTocItem struct {
@@ -37,18 +43,28 @@ type sourceViewParams struct {
 
 func SourceView(data SourceData) *View {
 	tocData := SourceTocData{
-		Icon:  "file",
-		Items: make([]SourceTocItem, len(data.Files)),
+		Icon: "file",
 	}
 
-	for i, file := range data.Files {
-		tocData.Items[i] = SourceTocItem{
+	for _, file := range data.Files {
+		item := SourceTocItem{
 			Link: data.PkgPath + "$source&file=" + file,
 			Text: file,
 		}
+
+		switch {
+		case file == "README.md":
+			tocData.ReadmeFile = item
+
+		case strings.HasSuffix(file, "_test.gno") || strings.HasSuffix(file, "_filetest.gno"):
+			tocData.GnoTestFiles = append(tocData.GnoTestFiles, item)
+
+		case strings.HasSuffix(file, ".gno"):
+			tocData.GnoFiles = append(tocData.GnoFiles, item)
+		}
 	}
 
-	toc := NewTemplateComponent("ui/toc_generic", tocData)
+	toc := NewTemplateComponent("ui/toc_source", tocData)
 	content := NewTemplateComponent("ui/code_wrapper", data.FileSource)
 	viewData := sourceViewParams{
 		Article: ArticleData{