close #1, close #35, close #17

Author: jstet

.github/workflows/deploy.yml

@@ -1,55 +1,55 @@
-# name: Deploy to GitHub Pages
-
-# on:
-#   workflow_dispatch:
-#   repository_dispatch:
-#     types:
-#       - webhook
-#   push:
-#     branches: 'main'
-
-# jobs:
-#   build_site:
-#     runs-on: ubuntu-latest
-#     steps:
-#       - name: Checkout
-#         uses: actions/checkout@v3
-
-#       - name: Install Node.js
-#         uses: actions/setup-node@v3
-#         with:
-#           node-version: 18
-#           cache: npm
-
-#       - name: Install dependencies
-#         run: npm install
-
-#       - name: build
-#         env:
-#           BASE_PATH: '/${{ github.event.repository.name }}'
-#           PUBLIC_API_URL: 'https://cms.jstet.net'
-#         run: |
-#           npm run build
-
-#       - name: Upload Artifacts
-#         uses: actions/upload-pages-artifact@v2
-#         with:
-#           # this should match the `pages` option in your adapter-static options
-#           path: 'build/'
-
-#   deploy:
-#     needs: build_site
-#     runs-on: ubuntu-latest
-
-#     permissions:
-#       pages: write
-#       id-token: write
-
-#     environment:
-#       name: github-pages
-#       url: ${{ steps.deployment.outputs.page_url }}
-
-#     steps:
-#       - name: Deploy
-#         id: deployment
-#         uses: actions/deploy-pages@v2
+name: Deploy to GitHub Pages
+
+on:
+  workflow_dispatch:
+  repository_dispatch:
+    types:
+      - webhook
+  push:
+    branches: 'main'
+
+jobs:
+  build_site:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: npm
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: build
+        env:
+          BASE_PATH: '/${{ github.event.repository.name }}'
+          PUBLIC_API_URL: 'https://cms.jstet.net'
+        run: |
+          npm run build
+
+      - name: Upload Artifacts
+        uses: actions/upload-pages-artifact@v2
+        with:
+          # this should match the `pages` option in your adapter-static options
+          path: 'build/'
+
+  deploy:
+    needs: build_site
+    runs-on: ubuntu-latest
+
+    permissions:
+      pages: write
+      id-token: write
+
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    steps:
+      - name: Deploy
+        id: deployment
+        uses: actions/deploy-pages@v2

src/lib/components/Filter.svelte

@@ -0,0 +1,125 @@
+<script>
+  import {
+    filter,
+    genDropdownLists,
+    setUrlParams,
+    applyUrlSearchParams,
+  } from '$lib/js/filter.js';
+  import DropdownIcon from '$lib/svg/Dropdown.svelte';
+  import _ from 'lodash';
+  import Select from 'svelte-select';
+  import {onMount} from 'svelte';
+  import {page} from '$app/stores';
+
+  export let origData;
+  export let filteredData;
+  export let expanded = false;
+
+  export let selects;
+  export let searchOptions;
+
+  let hidden = 'hidden';
+  let ariaExpanded = false;
+  let searchTerm;
+
+  const values = {};
+
+  onMount(async () => {
+    // when searchParams is set, set them in filter
+    applyUrlSearchParams($page.url.searchParams, values, selects);
+    // if value is set dont hide filter (if someone goes to page with defined url param)
+    if (expanded === false) {
+      if (Object.values(values).some((value) => value !== null)) {
+        hidden = 'visible';
+        ariaExpanded = true;
+      }
+    } else {
+      hidden = 'visible';
+    }
+  });
+  $: selects = genDropdownLists(origData, selects);
+
+  function handleHidden() {
+    hidden = hidden === 'hidden' ? 'visible' : 'hidden';
+    ariaExpanded = ariaExpanded ? false : true;
+  }
+
+  function changeVal(values_) {
+    for (const key in values_) {
+      if (values_.hasOwnProperty(key)) {
+        _.find(selects, {param: key}).value = values_[key];
+      }
+    }
+  }
+  $: changeVal(values);
+
+  $: filteredData = filter(
+    origData,
+    selects,
+    searchTerm,
+    searchOptions,
+    values,
+  );
+
+  $: history.replaceState(
+    history.state,
+    '',
+    setUrlParams($page.url, selects, values),
+  );
+</script>
+
+<div class="">
+  <div class="border-neutral-25 border-b">
+    <button
+      class="inline-flex items-center justify-center pb-1 text-xl font-semibold transition hover:text-secondary"
+      aria-expanded={ariaExpanded}
+      aria-controls="filter"
+      on:click={handleHidden}
+    >
+      Filter
+      <DropdownIcon height={27} width={27} />
+    </button>
+  </div>
+  <div
+    class="text_width grid items-center gap-y-4 md:gap-x-6 {hidden}"
+    id="filter"
+  >
+    <div class="">
+      <span class="mt-4 block pb-1 text-lg font-semibold">Search</span>
+      <div class="flex">
+        <input
+          bind:value={searchTerm}
+          placeholder="Search..."
+          class="border-neutral-25 h-full w-full rounded-md border p-2 pl-4"
+          data-testid="filter-search"
+        />
+      </div>
+    </div>
+    {#each selects as select}
+      <div>
+        <span class="mt-2 block pb-1 text-lg font-semibold">{select.title}</span
+        >
+        <div
+          class={select.param !== 'language' && select.param !== 'langs'
+            ? 'capitalize'
+            : ''}
+        >
+          <Select
+            showChevron
+            placeholder="Select"
+            items={select.items}
+            searchable={select.searchable}
+            multiple={select.multiple}
+            bind:value={values[select.param]}
+            --list-z-index="30"
+          >
+            <div slot="empty" /></Select
+          >
+        </div>
+      </div>
+    {/each}
+  </div>
+</div>
+
+<style>
+</style>

src/lib/components/Pagination.svelte

@@ -0,0 +1,45 @@
+<script>
+  import ArrowLeft from '../svg/ArrowLeft.svelte';
+  import ArrowRight from '../svg/ArrowRight.svelte';
+
+  export let items;
+  export let perPage;
+  export let trimmedItems;
+
+  $: totalItems = items.length;
+  $: currentPage = 0;
+  $: totalPages = Math.ceil(totalItems / perPage);
+  $: start = currentPage * perPage;
+  $: end =
+    currentPage === totalPages - 1 ? totalItems - 1 : start + perPage - 1;
+
+  $: trimmedItems = items.slice(start, end + 1);
+
+  $: totalItems, (currentPage = 0);
+  $: currentPage, start, end;
+</script>
+
+{#if totalItems && totalItems > perPage}
+  <div
+    class="pagination pointer-events-auto flex items-center justify-center"
+    role="navigation"
+    aria-label="Pagination"
+  >
+    <button
+      on:click={() => (currentPage -= 1)}
+      disabled={currentPage === 0 ? true : false}
+      aria-label="previous"
+    >
+      <ArrowLeft width={30} height={30} />
+    </button>
+    <p class="m-0 mx-2">{start + 1} - {end + 1} of {totalItems}</p>
+    <button
+      class="flex"
+      on:click={() => (currentPage += 1)}
+      disabled={currentPage === totalPages - 1 ? true : false}
+      aria-label="next"
+    >
+      <ArrowRight width={30} height={30} />
+    </button>
+  </div>
+{/if}

src/lib/data/organizations/de/&effect.json

@@ -1,6 +1,6 @@
 {
     "name": "&effect",
-    "cause": [
+    "sdgs": [
         16
     ],
     "url": "https://www.and-effect.com/",

src/lib/data/organizations/de/CorrelAid.json renamed to src/lib/data/organizations/de/correlaid.json

@@ -1,6 +1,6 @@
 {
     "name": "CorrelAid",
-    "cause": [4, 17], 
+    "sdgs": [4, 17], 
     "url": "https://www.correlaid.org/",
     "description": "CorrelAid is a non-profit organization dedicated to harnessing the power of data for social good. They bridge the gap between data scientists and organizations with a positive impact by offering their services to NGOs, non-profits, and charitable organizations. CorrelAid provides consulting services and educational resources to empower these non-profit entities to make data-driven decisions. Their mission is to leverage data for the betterment of society and empower civil society to utilize data in decision-making processes.",
     "office_locations_country": [

src/lib/data/organizations/de/german_red_cross.json

@@ -1,6 +1,6 @@
 {
     "name": "German Red Cross",
-    "cause": [3, 10, 16],  
+    "sdgs": [3, 10, 16],  
     "url": "https://drk-wohlfahrt.de/",
     "description": "The GRC saves people, helps in emergencies, offers people a community, stands by the poor and needy and oversees international humanitarian law. Their Data Science Hub tests the use of data science methods for social services.",
     "office_locations_country": [

src/lib/data/organizations/de/giz_data_lab.json

@@ -1,6 +1,6 @@
 {
     "name": "GIZ Data Lab",
-    "cause": [17], 
+    "sdgs": [17], 
     "url": "https://www.giz.de/fachexpertise/html/61847.html",
     "description": "Unkonventionell, innovativ und experimentell - das GIZ Data Lab versteht sich als eine Plattform, die Denker und Praktiker zusammenbringt um die effektive, faire und verantwortungsvolle Nutzung digitaler Daten in der nachhaltigen Entwicklungszusammenarbeit zu fördern. Seit seiner Gründung im Januar 2019 arbeitet das Team agil und chancenorientiert, erforscht neue Trends und entwickelt zukunftsorientierte Lösungen in den Partnerländern der GIZ. Das GIZ Data Lab-Team führt eine Vielzahl an Experimenten im Data4Development-Bereich durch, die in ihrem zeitlichen und thematischen Umfang begrenzt sind und auf konkreten Arbeitshypothesen basieren.",
     "office_locations_country": [

src/lib/data/organizations/de/welthungerhilfe.json

@@ -1,6 +1,6 @@
 {
     "name": "Welthungerhilfe",
-    "cause": [
+    "sdgs": [
         2
     ],
     "url": "https://www.welthungerhilfe.de/",

src/lib/data/organizations/gb/open_data_institute.json

@@ -1,6 +1,6 @@
 {
     "name": "Open Data Institute",
-    "cause": [17],  
+    "sdgs": [17],  
     "url": "https://www.theodi.org/about-the-odi/",
     "description": "The ODI is a non-profit company committed to advancing trust in data across the spectrum - from closed to shared to open data. We work to advance trust in data by providing training, consultancy services, tools and guides - all designed to enable organisations to become more confident and capable in their stewardship and use of data. ",
     "office_locations_country": [

src/lib/data/organizations/gb/our_world_in_data.json

@@ -1,8 +1,8 @@
 {
     "name": "Our World in Data",
-    "cause": [17],  
+    "sdgs": [17],  
     "url": "https://ourworldindata.org/about",
-    "description": "Detailed description present",
+    "description": "Our World in Data (OWID) is a scientific online publication that focuses on large global problems such as poverty, disease, hunger, climate change, war, existential risks, and inequality. Thanks to the work of thousands of researchers around the world who dedicate their lives to it, we often have a good understanding of how it is possible to make progress against the large problems we are facing. The world has the resources to do much better and reduce the suffering in the world. We believe that a key reason why we fail to achieve the progress we are capable of is that we do not make enough use of this existing research and data: the important knowledge is often stored in inaccessible databases, locked away behind paywalls and buried under jargon in academic papers.",
     "office_locations_country": [
       "gb"
     ],