---
# System prepended metadata

title: 'Finishing off Web Wall updates - 8th Sept, 2020'
tags: [filters, connectiondirective, programmingjournal, '2020', yup, pagination]

---

# Finishing off Web Wall updates - 8th Sept, 2020

I paired with A to help her with a GraphQL query not paginating properly. We solved her issue by adding the [@connection directive](https://www.apollographql.com/docs/react/data/pagination/#the-connection-directive) to normalise her paginated results under a single key.

We also discussed how she can better organize and make her file structure more uniform.

In the weekly JavaScript/mobile meeting, I gave an overview of the mobile pipeline updates I've done for C+. Will need to do a proper workshop in the near-future on how to use the new mobile pipelines to create a new App/Play Store release.

Finished off the Web wall updates. One of the things done was a refactor and breaking up of the filter code, leveraging callbacks such as `onCompleted` from the `useMutation` hook to decouple the "create new filter" logic from the other filtering logic.

Validation schema to ensure the user doesn't create a filter of the same name as existing one:

```typescript=
const validationSchema = (filters: readonly SrwFilters_MyFilter[]) =>
    yup.object().shape({
        filterName: yup
            .string()
            .lowercase()
            .notOneOf(
                filters.map(filter => filter.title.toLowerCase()),
                'You already have a filter of the same name'
            )
            .required('You must enter a filter name'),
    })
```

###### tags: `programmingjournal` `2020` `filters` `connectiondirective` `pagination` `yup`