Filtering via routes: can I do it a better way

Hello,

I am building an activities website with different types of activities to do in this corona pandemic. For example games, arts and crafts etc.

The goal is to display the activities in the right category. For example:

http://localhost:8000/activities/sports/tennis

I am using filtering via routes and this is working fine however I suspect I have solved it in a dirty way (especially de controller and config route). I am curious if I can do this in a smarter way?

My project is structured as follows:

Blueprint Activity

title: Activity

status:
  draft: Draft
  listed: Published
title: Activity

tabs:

  # content tab
  content:
    label: Content
    icon: text
    columns:

      # main
      left:
        width: 2/3
        sections:
        fields:
          category:
            label: Activity type
            type: select
            options:
              sports: Sports
              nature: Nature
              arts: Arts
              culture: Culture
          tags:
            label: Tags
            type: tags  
            options: query
            query: page.siblings.pluck("tags", ",", true)                       
          intro:
            type: textarea
            size: small
          text:
            type: textarea
            size: large   

      # sidebar
      right:
        width: 1/3
        sections:
        fields:
          cover:
            type: files
            headline: Cover
            layout: cards
            info: "{{ file.dimensions }}"
            template: image
            max: 1
          uploads:
            label: Images
            type: files    

Blueprint Activities

title: Activities
icon: 📚

tabs:

  # content tab
  content:
    label: Content
    icon: text
    columns:

      # main
      left:
        width: 1/2
        sections:
          drafts:
            extends: sections/activities
            headline: Drafts
            status: draft

          unlisted:
            extends: sections/activities
            headline: In Review
            status: unlisted

      # sidebar
      right:
        width: 1/2
        sections:
          listed:
            extends: sections/activities
            headline: Published
            status: listed  

Controller activities

<?php

return function ($page, $category) {

    $activities = $page->children()->listed();

    if ($category) {
        $activities = $activities->filterBy('category', $category, ',');
        
        $subcategory = $activities->first()->blueprint()->fields()['category']['options'][$activities->first()->category()->value()];
        
        return [
            'activities' => $activities,
            'subcategory' => $subcategory
        ];
    }
    
    return [
        'activities' => $activities
    ];

}; 

The route in my config:

'routes' => [
    [
        'pattern' => 'activities/(:any)',
        'action' => function ($category) {
            $page = page('activities');
            
            return $page->render([
                'category' => $category
            ]);
        }
    ],
    [
        'pattern' => 'activities/(:any)/(:any)',
        'action' => function ($category, $slug) {
            if ($page = page('activities/'.$slug)) {
                return $page;
            }
            return false;

        }
    ],

What I don’t understand is where you assign the subcategories like tennis?

Hi!

Sorry for not being clear.
Tennis is an activity

http://localhost:8000/activities
Shows an overview of all activities

http://localhost:8000/activities/sports
Shows an overview of only activities with category ‘sports’

http://localhost:8000/activities/sports/tennis
Show the activity ‘tennis’

I define the categories in my Activity blueprint:

    fields:
      category:
        label: Activity type
        type: select
        options:
          sports: Sports
          nature: Nature
          arts: Arts
          culture: Culture

So “tennis” is a subpage of “activities”? And all these subpages then get assigned a category via the select field? So the normal URL structure would be activities/tennis and you want to place the category in between?

We actually have a recipe here that covers your use case:

That’s right. I built my variant based on the same page you shared. It also works. Just wondering if this is the most logical way to do it. I try to learn if it can be accomplished in a smarter way. Thanks!

Does anyone have an idea if my code approach could be better?