---
py-config:
  splashscreen:
    autoclose: true
  packages:
    - jinja2
    - pandas
---

(list-of-projects)=

# List of Project Proposals

% NOTE: The CSV files used by this page are generated by the script located at
% https://github.com/jupyterhub/outreachy/blob/main/scripts/get-repo-issues.py
% The above script is automatically run on issue opened/closed/(un)labeled
% events by a GitHub Actions workflow located at
% https://github.com/jupyterhub/outreachy/blob/main/.github/workflows/sync-issues.yaml
% The CSV files are then committed and pushed to the issue-data branch of the repo
% https://github.com/jupyterhub/outreachy/tree/issue-data

This table shows the project proposals currently open as issues on the repository,
their status (whether they are being scoped, or have been submitted, etc), and
whether the project needs a mentor to steward it. Please read
[](proposing-projects:labels) to understand the labels.

```{tip}
Refresh the page to keep it up-to-date!
```

```{py-script}
import pandas as pd
from pyodide.http import open_url

# Get the data
data = pd.read_csv(
    open_url(
        "https://raw.githubusercontent.com/jupyterhub/outreachy/issue-data/project-table.csv"
    )
)
data.fillna(" ", inplace=True)

# Function to display the table
display(data.style.hide(axis="index"), target="project-table", append=False)
```

<div id="project-table" class="full-width project-table"></div>

% DataTables config to make the table above look nice
% TODO: Figure out how to make this work nicely with dark theme

<link rel="stylesheet"
      href="https://cdn.datatables.net/1.10.24/css/jquery.dataTables.min.css">
<script type="text/javascript"
        src="https://cdn.datatables.net/1.10.24/js/jquery.dataTables.min.js"></script>

<script>
$(document).ready( function () {
    $('.project-table table').DataTable( {
        "order": [[ 0, "template" ]],
        "pageLength": 25
    });
} );
</script>

% Make the tables a little bit more compact since there's a lot of text

<style>
    table {
        font-size: 1em;
    }

    table th, table td {
        padding: 100;
    }
</style>