Merge pull request #100 from MarcSkovMadsen/fix/windows-fixes

Windows fixes

Author: MarcSkovMadsen

.github/agents/holoviz-analysis-planner.agent.md

@@ -0,0 +1,57 @@
+---
+name: HoloViz Analysis Planner
+description: Create a detailed implementation plan for an analysis or data visualization using the HoloViz ecosystem without modifying code
+tools: ['holoviz-dev/*', 'read/readFile', 'read/problems', 'agent/runSubagent', 'web/fetch', 'web/githubRepo', 'search/codebase', 'search/usages', 'search/searchResults', 'vscode/vscodeAPI']
+handoffs:
+  - label: Implement Plan
+    agent: agent
+    prompt: Implement the plan outlined above.
+    send: false
+---
+# HoloViz Analysis Planning Specialist
+
+You are now an **Expert data analyst and communicator using Python and the HoloViz ecosystem** to explore data, produce insights, forecasts, prescriptions, and data visualizations and reports.
+
+You are in planning mode.
+
+Don't make any code edits, just generate a plan.
+
+## Core Responsibilities
+
+Your task is to generate an implementation plan for a data analysis or data visualization using the HoloViz ecosystem.
+
+The plan consists of a Markdown document that describes the implementation plan, including the following sections:
+
+* Overview: A brief description of the analysis or data visualization.
+* Requirements: A list of requirements for the analysis.
+* Library Selection: Justify which HoloViz libraries will be used based on the Library Selection Framework below.
+* Implementation Steps: A detailed list of steps to implement the analysis.
+* Testing: A list of tests that need to be implemented to verify the analysis.
+
+Please always
+
+- Keep the plan simple, concise, and professional. Don't write extensive code examples.
+- Ensure that the plan includes considerations for design and user experience.
+- prefer panel components over panel-material-ui components.
+
+## HoloViz Library Selection Framework
+
+You use this decision tree for the HoloViz ecosystem library selection:
+
+```text
+Reactive classes with validation   → param (reactive programming)
+Exploratory data analysis?         → hvplot (quick plots)
+Complex or high quality plots?     → holoviews (advanced, publication quality)
+Geographic data?                   → geoviews (spatial)
+Big data visualization?            → datashader (big data viz)
+Basic, declarative (YAML) Dashboards -> lumen (simple dashboards)
+Complex Dashboards, tool or applications?  → panel (advanced dashboards)
+```
+
+## MCP Tool Usage
+
+If the Holoviz MCP Server is available, use its tools to search for relevant information and to lookup relevant best practices:
+
+- Always use `holoviz_get_skill` tool to lookup the skills for the libraries (hvplot, holoviews, panel, panel-material-ui, ....) you will be using. Please adhere to these skills in your plan.
+- Use the `holoviz_search` tool to find relevant code examples and documentation for the libraries you will be using.
+- Use the read/readFile and web/fetch tools to gather any additional information you may need.

docs/assets/images/copilot-dashboard-plan.png

@@ -29,40 +29,19 @@ Repeat 1.+2. and verify that the `holoviz` mcp server is now running.
 
 ![HoloViz MCP Running](../assets/images/holoviz-mcp-vscode-running.png)
 
-## Using HoloViz Resources
-
-MCP resources contain curated knowledge that enhances Copilot's understanding of specific frameworks. Let's load the hvPlot best practice skills and use them to create a basic data visualization.
-
-1. In the Copilot Chat Interface, click "Add Context" (`CTRL + '`)
-2. Select "MCP Resources".
-3. You'll see a list of available resources. Select **`holoviz_hvplot`**.
-   ![HoloViz MCP Resources](../assets/images/holoviz-mcp-resources.png)
-4. Notice in the chat interface that the resource is now added to the context.
-   ![HvPlot Resource Added](../assets/images/holoviz-mcp-vscode-resource-added.png)
-5. Ask the agent:
-   ```bash
-   Please create a basic hvplot visualization in a script.py file.
-   ```
-
-!!! tip
-    You can add multiple resources to the context. Try browsing and adding `holoviz_panel` as well to get Panel-specific guidance.
-
----
-
-
 ## Using HoloViz Agents
 
-
 ### Installing the Agents
 
-
 [Custom agents](https://code.visualstudio.com/docs/copilot/customization/custom-agents) enable you to configure the AI to adopt different personas tailored to specific development roles and tasks. To install the `holoviz-mcp` agents:
 
 1. Open a terminal in VS Code (`` Ctrl+` `` or `Terminal > New Terminal`).
 2. Run the following command:
-   ```bash
-   uvx holoviz-mcp update copilot
-   ```
+
+    ```bash
+    uvx holoviz-mcp update copilot
+    ```
+
    You should see output confirming that agents were installed to `.github/agents/`.
 3. Wait for the command to complete successfully.
 
@@ -74,46 +53,37 @@ MCP resources contain curated knowledge that enhances Copilot's understanding of
 
 ---
 
-
 ### Creating a Plan with the HoloViz Planner Agent
 
-
 Instead of diving straight into code, let's use the specialized agent to plan our application architecture.
 
-
 1. In the Copilot Chat interface, click the **Set Agent** dropdown.
 2. Select **`HoloViz Planner`** from the list.
 3. Type the following prompt:
-   ```
-   Create a plan for a stock dashboard that displays historical prices and trading volume
-   ```
-![HoloViz MCP Planner](../assets/images/holoviz-mcp-planner.png)
-4. Press Enter and wait for the agent to respond.
 
-!!! note "What you'll see"
-    The agent will provide a structured plan including:
+    ```text
+    Create a plan for a stock dashboard that displays historical prices and trading volume
+    ```
+
+4. Press Enter and wait for the agent to respond.
 
-    - Component breakdown (widgets, plots, layouts)
-    - Data requirements
-    - Recommended HoloViz libraries to use
-    - Step-by-step implementation approach
+![Copilot Dashboard Plan](../assets/images/copilot-dashboard-plan.png)
 
 !!! note "What's happening"
     The HoloViz Planner agent analyzes your requirements and creates an architecture plan following HoloViz best practices. This ensures your application is well-structured before you write any code.
 
 ---
 
-
 ### Implementing the Dashboard
 
-
 Now that you have a plan, let's ask Copilot to help implement it.
 
-
 1. In the Copilot Chat, respond to the plan with:
-   ```
-   Implement the plan outlined above.
-   ```
+
+    ```text
+    Implement the plan outlined above.
+    ```
+
 2. Copilot will generate the code for your dashboard. Review the suggestions.
 
 !!! note "What you'll see"
@@ -127,14 +97,33 @@ Now that you have a plan, let's ask Copilot to help implement it.
 
 ---
 
+## Using HoloViz Resources
+
+MCP resources contain curated knowledge that enhances Copilot's understanding of specific frameworks. Let's load the hvPlot best practice skills and use them to create a basic data visualization.
 
-## What You've Learned
+1. In the Copilot Chat Interface, click "Add Context" (`CTRL + '`)
+2. Select "MCP Resources".
+3. You'll see a list of available resources. Select **`holoviz_hvplot`**.
+   ![HoloViz MCP Resources](../assets/images/holoviz-mcp-resources.png)
+4. Notice in the chat interface that the resource is now added to the context.
+   ![HvPlot Resource Added](../assets/images/holoviz-mcp-vscode-resource-added.png)
+5. Ask the agent:
 
+    ```bash
+    Please create a basic hvplot visualization in a script.py file.
+    ```
 
-In this tutorial, you've learned how to:
+!!! tip
+    You can add multiple resources to the context. Try browsing and adding `holoviz_panel` as well to get Panel-specific guidance.
 
-✅ **Use specialized resources** – You loaded HoloViz best practice skills into Copilot's context using MCP resources.
+---
+
+## What You've Learned
+
+In this tutorial, you've learned how to:
 
 ✅ **Use specialized agents** – You used the HoloViz Planner agent to design your application architecture.
 
+✅ **Use specialized resources** – You loaded HoloViz best practice skills into Copilot's context using MCP resources.
+
 ---

docs/assets/images/getting-started-build-dashboard-copilot-chat.png

@@ -44,14 +44,14 @@ uvx --from holoviz-mcp display-server
 
 You should see output like this:
 
-```
+```bash
 Starting Display Server...
 Display Server running at:
 
-  - Add: [http://localhost:5005/add](http://localhost:5005/add)
-  - Feed: [http://localhost:5005/feed](http://localhost:5005/feed)
-  - Admin: [http://localhost:5005/admin](http://localhost:5005/admin)
-  - API: [http://localhost:5005/api](http://localhost:5005/api)
+  - Add: http://localhost:5005/add
+  - Feed: http://localhost:5005/feed
+  - Admin: http://localhost:5005/admin
+  - API: http://localhost:5005/api
 ```
 
 Great! Your server is now running. Keep this terminal window open while you work through the tutorial.

docs/assets/images/getting-started-build-dashboard.png

@@ -3,10 +3,9 @@
 In this tutorial, we will create visualizations using the `holoviz_display` tool through an AI assistant. By the end, you will have created several interactive visualizations and learned how to view them.
 
 !!! info "What you'll accomplish"
-    - Set up the `holoviz_display` tool
-    - Create your first bar chart through your AI assistant
-    - Build an interactive scatter plot
-    - View your visualizations
+    - Use the `holoviz_display` tool
+    - Create and display a bar chart through your AI assistant
+    - Build and display an interactive scatter plot
     - Learn to troubleshoot common issues
 
 !!! warning
@@ -39,11 +38,11 @@ Right-click [penguins.csv](../assets/data/penguins.csv) and save it to your work
 
 Now let's explore the penguins dataset. Open your AI assistant and ask:
 
-> "My dataset is penguins.csv. What is the distribution of the 'species' column? Use the #holoviz_display tool"
+> My dataset is penguins.csv. What is the distribution of the 'species' column? Use the #holoviz_display tool
 
 Your AI assistant will use the `holoviz_display` tool and respond with something like:
 
-```
+```bash
 ✓ Visualization created successfully!
 View at: http://localhost:5005/view?id={snippet_id}
 ```
@@ -64,7 +63,7 @@ Click the URL. You should see:
 
 Let's explore the relationship between penguin measurements. Ask your AI assistant:
 
-> "Show me a scatter plot of 'flipper_length_mm' vs 'body_mass_g'."
+> Show me a scatter plot of 'flipper_length_mm' vs 'body_mass_g'
 
 The AI will create a new visualization. Click the new URL to see:
 
@@ -81,7 +80,7 @@ The AI will create a new visualization. Click the new URL to see:
 
 You can ask the AI to perform several steps in one message. This helps you build complex analyses without multiple back-and-forths. Try:
 
-> "Filter the dataset for species 'Chinstrap' and calculate the median 'body_mass_g'. Then display and discuss the result."
+> Filter the dataset for species 'Chinstrap' and calculate the median 'body_mass_g'. Then display and discuss the result.
 
 The AI will:
 
@@ -98,7 +97,7 @@ This demonstrates how `holoviz_display` can handle multi-step analytical workflo
 
 Now let's see all your visualizations together. In your browser, navigate to:
 
-```
+```bash
 http://localhost:5005/feed
 ```
 
@@ -126,15 +125,15 @@ The AI will iterate on your existing work based on your feedback, creating new v
 
 You can create visualizations that combine multiple plots for comprehensive analysis. Ask your AI:
 
-> "Create a histogram of 'bill_length_mm' and a box plot of 'flipper_length_mm' side by side."
+> Create a histogram of 'bill_length_mm' and a box plot of 'flipper_length_mm' side by side.
 
 The AI will create a layout with both plots displayed together, making it easy to compare different aspects of the data at a glance. When you view it in the Feed page, you'll see a descriptive title and the combined visualization.
 
 ## Step 6: Build Interactive Dashboards
 
 For more advanced use cases, you can create interactive dashboards with widgets. Ask your AI:
 
-> "Create an interactive dashboard for the penguins dataset with dropdown filters for species and island."
+> Create an interactive dashboard for the penguins dataset with dropdown filters for species and island.
 
 The visualization will include:
 

docs/tutorials/copilot.md

@@ -141,37 +141,39 @@ In VS Code, you can monitor the MCP server:
 2. Type "MCP: List Servers" and press Enter
 3. Choose the "holoviz" server
 4. Select "Show Output"
-3. You should see log messages indicating the server is running
+5. You should see log messages indicating the server is running
 
 ### Test with Your AI Assistant
 
 Open a chat with your AI assistant and try these questions:
 
-1. **Component Discovery**:
-   ```
-   What Panel components are available for user input?
-   ```
+**Component Discovery**:
 
-  Note: In VS Code, you can prefix your prompt with `#holoviz` to explicitly request that the AI use the `holoviz-mcp` server tools for your query.
+    What Panel components are available for user input?
 
-2. **Component Details**:
-   ```
-   What parameters does the Panel Button component accept?
-   ```
+!!! tip "Force MCP Usage"
+
+    In VS Code, you can include `#holoviz` in your prompt to explicitly request that the AI use the `holoviz-mcp` server tools for your query.
+
+**Component Details**:
+
+    What parameters does the Panel Button component accept?
 
 If your AI assistant provides detailed, accurate answers with specific Panel component information, congratulations! HoloViz MCP is working correctly! 🎉
 
 ## Step 6: Build Your First Dashboard
 
-Now that everything is set up, let's build a simple dashboard:
+Now that everything is set up, let's build a simple dashboard.
+
+**Ask your AI "Agent":**
+
+    Create a Panel dashboard in the file app.py that displays a slider and shows the square of the slider's  value. Use panel skills.
+
+Your AI "Agent" will provide code using HoloViz MCP's knowledge of Panel components!
 
-1. Create a new file called `app.py`
-2. Ask your AI "Agent":
-   ```
-   Create a Panel dashboard in the file app.py that displays a slider and shows the square of the slider's value. Use 'panel' skills.
-   ```
+![Copilot Chat](../assets/images/getting-started-build-dashboard-copilot-chat.png)
 
-3. Your AI "Agent" will provide code using HoloViz MCP's knowledge of Panel components!
+![Dashboard](../assets/images/getting-started-build-dashboard.png)
 
 ## What's Next?
 

docs/tutorials/display-server.md

@@ -1,6 +1,6 @@
 # Tutorial: Building an Interactive Stock Analysis Report
 
-In this tutorial, you will create a complete stock analysis report that visualizes price movements and trading patterns for multiple stocks. By the end, you'll have built an interactive web application that displays financial data with professional charts and statistics.
+In this tutorial, you will create a complete stock analysis report that visualizes price movements and trading patterns for multiple stocks. By the end, you'll have built an interactive report that displays financial data with professional charts and statistics.
 
 <iframe src="https://www.youtube.com/embed/placeholder" title="Tutorial: Building a Stock Analysis Report with HoloViz MCP" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="display:block;height:300px;width:500px;margin-left:auto;margin-right:auto"></iframe>
 
@@ -18,17 +18,7 @@ In this tutorial, you will create a complete stock analysis report that visualiz
     - VS Code with GitHub Copilot or another MCP-compatible AI assistant
     - Configured the `HoloViz Planner` agent. ([HoloViz Agents](copilot.md/#using-holoviz-agents))
     - The HoloViz MCP server running ([How to start the server](getting-started.md/#start-the-server))
-    - Python 3.11 or later
-    - `yfinance` installed in your virtual environment: `pip install yfinance`
-
-!!! info "What you'll build"
-    You'll create a stock analysis report that compares AAPL (Apple) and META (Meta) stock prices over the last 5 days with:
-
-    - Individual price charts for each stock
-    - Summary statistics table
-    - Normalized comparison overlay
-    - Trading volume visualization
-    - Professional styling and error handling
+    - `yfinance` installed in the virtual environment where you run `holoviz-mcp`: `pip install yfinance`
 
 ## Step 1: Plan Your Report with the HoloViz Planner
 
@@ -39,15 +29,15 @@ First, let's use the HoloViz Planner agent to design our application architectur
 3. Ask the agent:
 
 ```text
-Please plan how to show me AAPL and META's hourly bar data history for the last 5 days and display the data as charts:
+Please plan how to analyze and create a report showing AAPL and META's hourly bar data history for the last 5 days and display the data as charts:
 
 - Individual price charts for each stock
 - Summary statistics table
 - Normalized comparison overlay
 - Trading volume visualization
 - Professional styling and error handling
 
-Display using the #holoviz_display tool.
+Display using the #holoviz_display tool. KISS - Keep it simple stupid.
 ```
 
 ![HoloViz Planner](../assets/images/stock-analysis-holoviz-planner.png)