From b245d44220a335ced00303affa9bb22743efff88 Mon Sep 17 00:00:00 2001
From: Felix Roos <flix91@gmail.com>
Date: Sun, 29 Oct 2023 13:14:25 +0100
Subject: [PATCH] hide patterns tab for now + add examples to welcome tab

---
 website/src/repl/panel/Panel.jsx      |  6 +++---
 website/src/repl/panel/WelcomeTab.jsx | 16 +++++++++++++++-
 2 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/website/src/repl/panel/Panel.jsx b/website/src/repl/panel/Panel.jsx
index 0642bdea7..a38bdd24f 100644
--- a/website/src/repl/panel/Panel.jsx
+++ b/website/src/repl/panel/Panel.jsx
@@ -86,7 +86,7 @@ export function Panel({ context }) {
           <PanelTab name="intro" label="welcome" />
           <PanelTab name="sounds" />
           <PanelTab name="console" />
-          <PanelTab name="patterns" />
+          {/* <PanelTab name="patterns" /> */}
           <PanelTab name="reference" />
           <PanelTab name="settings" />
           {TAURI && <PanelTab name="files" />}
@@ -100,8 +100,8 @@ export function Panel({ context }) {
       {activeFooter !== '' && (
         <div className="relative overflow-hidden">
           <div className="text-white overflow-auto h-full max-w-full" ref={footerContent}>
-            {activeFooter === 'intro' && <WelcomeTab />}
-            {activeFooter === 'patterns' && <PatternsTab context={context} />}
+            {activeFooter === 'intro' && <WelcomeTab context={context} />}
+            {/* {activeFooter === 'patterns' && <PatternsTab context={context} />} */}
             {activeFooter === 'console' && <ConsoleTab log={log} />}
             {activeFooter === 'sounds' && <SoundsTab />}
             {activeFooter === 'reference' && <Reference />}
diff --git a/website/src/repl/panel/WelcomeTab.jsx b/website/src/repl/panel/WelcomeTab.jsx
index aca5a8133..5ab8abafe 100644
--- a/website/src/repl/panel/WelcomeTab.jsx
+++ b/website/src/repl/panel/WelcomeTab.jsx
@@ -1,7 +1,8 @@
 import { cx } from '@strudel.cycles/react';
 import React from 'react';
+import * as tunes from '../tunes.mjs';
 
-export function WelcomeTab() {
+export function WelcomeTab({ context }) {
   return (
     <div className="prose dark:prose-invert max-w-[600px] pt-2 font-sans pb-8 px-4">
       <h3>
@@ -44,6 +45,19 @@ export function WelcomeTab() {
         </a>{' '}
         to ensure ongoing development 💖
       </p>
+      <h2 className="text-xl mb-2">examples</h2>
+      {Object.entries(tunes).map(([key, tune]) => (
+        <a
+          key={key}
+          className="mr-4 hover:opacity-50 cursor-pointer inline-block"
+          onClick={() => {
+            console.log('clikkk', tune);
+            context.handleUpdate(tune);
+          }}
+        >
+          {key}
+        </a>
+      ))}
     </div>
   );
 }