Skip to content
This repository has been archived by the owner on Feb 22, 2023. It is now read-only.

Make MediaService generic #868

Conversation

sarayourfriend
Copy link
Contributor

Description

Just some optional type enhancements to @obulat's excellent MediaService refactor.

Testing Instructions

Create a test media service in media-service.js like this and inspect the return types of the various functions. Ensure they are as expected!

const testService = new MediaService('image')
testService.getRelatedMedia({ id: 'asdf' })
    .then(({ data }) =>
        data.map(r =>
            /** `r` should be either ImageDetail or AudioDetail depending on what you passed to the MediaService constructor :o */
        )
    )

Checklist

  • My pull request has a descriptive title (not a vague title like Update index.md).
  • My pull request targets the default branch of the repository (main) or a parent feature branch.
  • My commit messages follow best practices.
  • My code follows the established code style of the repository.
  • I added or updated tests for the changes I made (if applicable).
  • I added or updated documentation (if applicable).
  • I tried running the project locally and verified that there are no visible errors.

Developer Certificate of Origin

Developer Certificate of Origin
Developer Certificate of Origin
Version 1.1

Copyright (C) 2004, 2006 The Linux Foundation and its contributors.
1 Letterman Drive
Suite D4700
San Francisco, CA, 94129

Everyone is permitted to copy and distribute verbatim copies of this
license document, but changing it is not allowed.


Developer's Certificate of Origin 1.1

By making a contribution to this project, I certify that:

(a) The contribution was created in whole or in part by me and I
    have the right to submit it under the open source license
    indicated in the file; or

(b) The contribution is based upon previous work that, to the best
    of my knowledge, is covered under an appropriate open source
    license and I have the right under that license to submit that
    work with modifications, whether created in whole or in part
    by me, under the same open source license (unless I am
    permitted to submit under a different license), as indicated
    in the file; or

(c) The contribution was provided directly to me by some other
    person who certified (a), (b) or (c) and I have not modified
    it.

(d) I understand and agree that this project and the contribution
    are public and that a record of the contribution (including all
    personal information I submit with it, including my sign-off) is
    maintained indefinitely and may be redistributed consistent with
    this project or the open source license(s) involved.

@sarayourfriend sarayourfriend added 🟩 priority: low Low priority and doesn't need to be rushed 🤖 aspect: dx Concerns developers' experience with the codebase 🧰 goal: internal improvement Improvement that benefits maintainers, not users labels Feb 15, 2022
@sarayourfriend sarayourfriend requested a review from a team as a code owner February 15, 2022 11:25
Comment on lines +10 to +15
/**
* @template T
* @typedef {T extends `${infer P}-${infer PP}-${infer PPP}` ? [P, PP, PPP] : T extends `${infer P}-${infer PP}` ? [P, PP] : [T]} PartitionLicense
*/

/** @typedef {PartitionLicense<CCLicense>[number]} LicensePart */
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is just me being kind of silly with TS string types. We could just as easily (and probably should just) use a type directly as 'by' | 'sa' | 'nd' | 'nc' 😝

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tend to agree with your comment 😆 I mean it looks very interesting, but it would probably take me years to understand what it means :)

@sarayourfriend sarayourfriend mentioned this pull request Feb 15, 2022
7 tasks
@@ -1,22 +1,45 @@
export const CC_LICENSES = [
export const CC_LICENSES = /** @type {const} */ ([
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@sarayourfriend , can you give me a reference I can read about the type {const} declaration? I couldn't find anything searching for typescript const type.

The reason I'm asking this is the messages I see in my IDEs.
WebStorm is trying to find something in the node_modules, I guess?

Screen Shot 2022-02-15 at 3 14 24 PM

VS Code just shows it as unresolved, even when I set language mode to TypeScript (I don't know what other information can I get about VS Code TS hints)

Screen Shot 2022-02-15 at 3 14 45 PM

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's the JSDoc version of this feature: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-4.html#const-assertions

The TypeScript JSDoc documentation for it is here: https://www.typescriptlang.org/docs/handbook/jsdoc-supported-types.html#casts (the second example in that section)

I'm not sure why TS isn't picking it up. In VSCode have you tried running the "Restart TS Service" command? I have to do that anytime tsconfig.json changes.

For WebStorm it might be the same. You will probably also have to enable the TS language server using the instructions described here: https://www.jetbrains.com/help/webstorm/typescript-support.html#ws_ts_use_ts_service_checkbox

obulat added a commit that referenced this pull request Feb 15, 2022
Copy link
Contributor

@obulat obulat left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for this PR, @sarayourfriend ! It's fantastic, and great for learning more about types, as always!

I have taken all the changes that don't create warnings in my IDE and pushed them to the original PR. There are 2 things I don't think we should tackle here:

  1. licenses - Dhruv has made significant changes to the license code in Update license explanation tooltip #850, so it would create double work load to add typing here.
  2. media type constant types - they have been changed a lot in Remove mediaType from search.query state #851, so the same here.
    Also, I would really like to find out what's wrong with my setup with regards to the {const} type, but until that I would prefer not to add it.
    media-service raises errors when I run pnpm run types, probably because I have not added the mediaType-related constant types, so I didn't add it and licenses to the list of files to check types in.

@sarayourfriend
Copy link
Contributor Author

Woohoo! 🎉 Makes sense to leave that stuff out for now 👍 We definitely need to sort out why the const cast isn't working for you though, it's a fundamental tool in good TypeScript!

obulat added a commit that referenced this pull request Feb 23, 2022
* Create a single media-service data fetching object

* Move slug creation from media service to the api service

* Use typing data from #868

* Update src/constants/media.js

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Apply suggestions from code review

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* edit api-service styles; format

* fix decode-media-data type import

* Return decoded data from the media services

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>
obulat added a commit that referenced this pull request Feb 23, 2022
* Rename AudioDetails (#892)

* Rename AudioDetails folder

* Fix store access

* Revert conversion to Composition API

* Revert conversion to defineComponent

* Update pot

* Use v-show instead of v-if for width-based condition (#884)

* Use v-show instead of v-if for width-based condition

Use v-show instead of v-if to fix server-client mismatch

* Fix waveform not loading on SSR

* Split CI into discrete jobs (#981)

* Split CI into discrete jobs

* Update outdated POT file

* Skip writing POT file if the only thing changing is the date

* Format yaml

* Add yaml to lint staged

* Get locales when setting up node env

* Cram it all into a single workflow

* Add getting translations

* Update license explanation tooltip (#850)

Co-authored-by: Zack Krida <zackkrida@pm.me>
Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Fix attribution HTML glyph reference and fix historical usages as well (#990)

* Fix attribution HTML glyph reference and fix historical usages as well

* Add missing license parts

* Add note to explain directory structure

* Refactor media services (#867)

* Create a single media-service data fetching object

* Move slug creation from media service to the api service

* Use typing data from #868

* Update src/constants/media.js

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Apply suggestions from code review

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* edit api-service styles; format

* fix decode-media-data type import

* Return decoded data from the media services

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Make active media setup store and add unit tests

* Commit the lock file

* Fix merge problems

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>
Co-authored-by: Dhruv Bhanushali <dhruv_b@live.com>
Co-authored-by: Zack Krida <zackkrida@pm.me>
obulat added a commit that referenced this pull request Mar 3, 2022
* Install Pinia

* Update the active media store to use Pinia

* Delete the Vuex store

* Update type definition and use it

* Document the store composition variable

* Fix a lint error that Prettier did not catch locally

* Use `~` instead of `@` in imports

* Update the nav store to use Pinia

* Rename store

* Make mutation payload fields non-nullable

* Fix leftover incorrect usage of the active media store

* Make active media setup store and add unit tests (#997)

* Rename AudioDetails (#892)

* Rename AudioDetails folder

* Fix store access

* Revert conversion to Composition API

* Revert conversion to defineComponent

* Update pot

* Use v-show instead of v-if for width-based condition (#884)

* Use v-show instead of v-if for width-based condition

Use v-show instead of v-if to fix server-client mismatch

* Fix waveform not loading on SSR

* Split CI into discrete jobs (#981)

* Split CI into discrete jobs

* Update outdated POT file

* Skip writing POT file if the only thing changing is the date

* Format yaml

* Add yaml to lint staged

* Get locales when setting up node env

* Cram it all into a single workflow

* Add getting translations

* Update license explanation tooltip (#850)

Co-authored-by: Zack Krida <zackkrida@pm.me>
Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Fix attribution HTML glyph reference and fix historical usages as well (#990)

* Fix attribution HTML glyph reference and fix historical usages as well

* Add missing license parts

* Add note to explain directory structure

* Refactor media services (#867)

* Create a single media-service data fetching object

* Move slug creation from media service to the api service

* Use typing data from #868

* Update src/constants/media.js

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Apply suggestions from code review

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* edit api-service styles; format

* fix decode-media-data type import

* Return decoded data from the media services

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Make active media setup store and add unit tests

* Commit the lock file

* Fix merge problems

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>
Co-authored-by: Dhruv Bhanushali <dhruv_b@live.com>
Co-authored-by: Zack Krida <zackkrida@pm.me>

* fix possibly undefined

* Add tests and other small fixes

* Update nuxt.config.ts

Co-authored-by: Zack Krida <zackkrida@pm.me>

* Move converted modules to /stores/ and add unit tests

* Fix linting error

* Update nuxt.config.ts

Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>

* Add changes from review

* Register component

* Make properties readonly

* Remove dublicates

Co-authored-by: Olga Bulat <obulat@gmail.com>
Co-authored-by: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>
Co-authored-by: Zack Krida <zackkrida@pm.me>
@obulat obulat deleted the refactor_media_services-add_types branch March 29, 2022 12:59
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
🤖 aspect: dx Concerns developers' experience with the codebase 🧰 goal: internal improvement Improvement that benefits maintainers, not users 🟩 priority: low Low priority and doesn't need to be rushed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants