bananabrann / brannan.cloud

My personal website, and root domain of most of my stuffs.
https://brannan.cloud
1 stars 1 forks source link

Refactor BlogPostSortByOption enum to be less of a headache to work with in TypeScript #79

Closed bananabrann closed 1 month ago

bananabrann commented 1 month ago

I could have created this enum and its implementation better. There's a lot of headaches with TypeScript because I am storing the enum's key (a string) into the URL, and there's lots of TypeScript headaches as a result.

I should try and refactor this to be less of a headache. Here are some of the temporary fixes for now:

// .../BlogPostSortByOption.ts

export enum BlogPostSortByOption {
    AlphabeticalTitleAsc = "Title",
    PostedDateAsc = "Posted date",
    MostClaps = "Most claps",
    MostLikes = "Most likes",
    Controversial = "Controversial",
}
// src/routes/blog/+page.svelte

        if (sortOrder) {
            filteredPosts = filteredPosts.sort((a, b) => {
                /*
                    FIXME - There is a mismatch in the enums (see other comment regarding the enum
                    issues). sortOrder is the key (PostedDateAsc) while accessing the enums with
                    BlogPostSortByOption.AlphabeticalTitleAsc returns the value e.g. ("Post date").

                    This is fine for my little app, but eventually it should be addressed.
                */
                switch (sortOrder.toString()) {
                    case "AlphabeticalTitleAsc":
                        return a.title.localeCompare(b.title);

                    case "PostedDateAsc":
                        return new Date(a.postedOn).getTime() - new Date(b.postedOn).getTime();

                    case "MostClaps":
                        return b.claps - a.claps;

                    case "MostLikes":
                        return b.likes - a.likes;

                    case "Controversial":
                        return b.dislikes - a.likes;

                    default:
                        return 0;
                }
            });
        if (sortOrderParams && sortOrderParams in BlogPostSortByOption) {
            /*
            TODO - Fix typing on sortOrder.

            I have no idea why I'm having such difficulties casting the enum with string keys
            into this variable. Both of these options do nothing:

            sortOrder = BlogPostSortByOption[sortOrderParams as keyof typeof BlogPostSortByOption];

            (Object.keys(BlogPostSortByOption) as Array<keyof typeof BlogPostSortByOption>)
            .find(key => BlogPostSortByOption[key] === sortOrderParams);

            A thing that works right now is to use `as unknown as BlogPostSortByOption;`, but
            at that point why even use TypeScript? I'd rather just @ts-ignore it.
            */

            // @ts-ignore
            sortOrder = sortOrderParams;
        } else {
            // @ts-ignore
            sortOrder = "AlphabeticalTitleAsc";
        }