chore: merge pull request #90 from Questionable-Content-Extensions/release/1.3.0

ilyvion · web-flow · commit 9214ca04b78c · 2024-02-03T09:22:26.000+01:00
Release version 1.3.0
diff --git a/.github/workflows/CI.yml b/.github/workflows/CI.yml
@@ -44,6 +44,7 @@ jobs:
                   "npx wait-on http://127.0.0.1:6006/ && npm run test-storybook"
 
             - name: Deploy Storybook
+              if: github.event_name != 'pull_request'
               uses: JamesIves/github-pages-deploy-action@v4
               with:
                   folder: storybook-static
diff --git a/.github/workflows/draft_new_hotfix.yml b/.github/workflows/draft_new_hotfix.yml
@@ -14,6 +14,9 @@ jobs:
         steps:
             - uses: actions/checkout@v3
 
+            - name: Install Node modules
+              run: npm ci
+
             - name: Create hotfix branch
               run: git checkout -b hotfix/${{ github.event.inputs.version }}
 
@@ -22,6 +25,9 @@ jobs:
               with:
                   version: ${{ github.event.inputs.version }}
 
+            - name: Format changelog
+              run: npx prettier -w ./CHANGELOG.md
+
             # In order to make a commit, we need to initialize a user.
             - name: Initialize mandatory git config
               run: |
diff --git a/.github/workflows/draft_new_release.yml b/.github/workflows/draft_new_release.yml
@@ -14,6 +14,9 @@ jobs:
         steps:
             - uses: actions/checkout@v3
 
+            - name: Install Node modules
+              run: npm ci
+
             - name: Create release branch
               run: git checkout -b release/${{ github.event.inputs.version }}
 
@@ -22,6 +25,9 @@ jobs:
               with:
                   version: ${{ github.event.inputs.version }}
 
+            - name: Format changelog
+              run: npx prettier -w ./CHANGELOG.md
+
             # In order to make a commit, we need to initialize a user.
             - name: Initialize mandatory git config
               run: |
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.3.0] - 2024-02-03
+
+### Added ✨
+
+-   Add option for sorting members by recent apperance in addition to the existing option of sorting by number of appearances. Closes [#87](https://github.com/Questionable-Content-Extensions/client/issues/87)
+
 ## [1.2.1] - 2023-09-22
 
 ### Fixed 🐛
@@ -392,7 +398,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 [0.1.0]: https://github.com/Questionable-Content-Extensions/client/releases/tag/0.1.0
 [issues]: https://github.com/Questionable-Content-Extensions/client/issues
 [1.0.0]: https://github.com/Questionable-Content-Extensions/client/compare/0.6.2...1.0.0
-[Unreleased]: https://github.com/Questionable-Content-Extensions/client/compare/1.2.1...HEAD
+[Unreleased]: https://github.com/Questionable-Content-Extensions/client/compare/1.3.0...HEAD
+[1.3.0]: https://github.com/Questionable-Content-Extensions/client/compare/1.2.1...1.3.0
 [1.2.1]: https://github.com/Questionable-Content-Extensions/client/compare/1.2.0...1.2.1
 [1.2.0]: https://github.com/Questionable-Content-Extensions/client/compare/1.1.0...1.2.0
 [1.1.0]: https://github.com/Questionable-Content-Extensions/client/compare/1.0.0...1.1.0
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "questionable-content-spa",
-    "version": "1.2.1",
+    "version": "1.3.0",
     "description": "Questionable Content Single-Page Application with Extra Features",
     "private": true,
     "scripts": {
@@ -37,9 +37,9 @@
         "@storybook/preview-api": "^7.4.0",
         "@storybook/react": "^7.4.0",
         "@storybook/react-webpack5": "^7.4.0",
-        "@storybook/test-runner": "^0.13.0",
+        "@storybook/test-runner": "^0.16.0",
         "@storybook/testing-library": "^0.2.0",
-        "@trivago/prettier-plugin-sort-imports": "^4.2.0",
+        "@trivago/prettier-plugin-sort-imports": "^4.3.0",
         "@types/greasemonkey": "^4.0.4",
         "@types/react-color": "^3.0.6",
         "@types/redux-logger": "^3.0.9",
@@ -51,7 +51,7 @@
         "lint-staged": "^14.0.1",
         "msw": "^1.3",
         "npm-run-all": "^4.1.5",
-        "postcss": "^8.4.29",
+        "postcss": "^8.4.31",
         "prettier": "^3.0.3",
         "prop-types": "^15.8.1",
         "react-app-rewired": "^2.2.1",
diff --git a/src/components/ComicDetailsPanel/ComicDetailsPanel.tsx b/src/components/ComicDetailsPanel/ComicDetailsPanel.tsx
@@ -276,6 +276,7 @@ export default function ComicDetailsPanel() {
                 isLoading={isLoadingInitial}
                 isFetching={isFetching}
                 useColors={settings.useColors}
+                orderMembersByLastAppearance={false}
                 onSetCurrentComic={(c, locked) =>
                     dispatch(setCurrentComic(c, { locked }))
                 }
@@ -368,6 +369,9 @@ export default function ComicDetailsPanel() {
                             }
                             useColors={settings.useColors}
                             editMode={settings.editMode}
+                            orderMembersByLastAppearance={
+                                settings.orderMembersByLastAppearance
+                            }
                             onAddItem={(itemBody) => {
                                 addItem({
                                     token: settings.editModeToken,
diff --git a/src/components/ComicDetailsPanel/ItemNavigation/ItemNavigation.tsx b/src/components/ComicDetailsPanel/ItemNavigation/ItemNavigation.tsx
@@ -15,6 +15,7 @@ export default function ItemNavigation({
     isLoading,
     isFetching,
     useColors,
+    orderMembersByLastAppearance,
     onSetCurrentComic,
     onShowInfoFor,
     mode,
@@ -27,6 +28,7 @@ export default function ItemNavigation({
     isLoading: boolean
     isFetching: boolean
     useColors: boolean
+    orderMembersByLastAppearance: boolean
     onSetCurrentComic: (comicNo: ComicId, locked: boolean) => void
     onShowInfoFor: (item: ItemId) => void
     mode: PickEnum<
@@ -76,8 +78,16 @@ export default function ItemNavigation({
             location: location.map(itemNavigationToNavElement),
             storyline: storyline.map(itemNavigationToNavElement),
             locked: locked.map(itemNavigationToNavElement),
+            all: itemNavigationData.map(itemNavigationToNavElement),
         }
-    }, [cast, location, storyline, locked, itemNavigationToNavElement])
+    }, [
+        cast,
+        location,
+        storyline,
+        locked,
+        itemNavigationData,
+        itemNavigationToNavElement,
+    ])
 
     if (isLoading) {
         return (
@@ -98,42 +108,55 @@ export default function ItemNavigation({
         return <></>
     }
 
-    return (
-        <div className="text-center">
-            {!!itemNavElements.locked.length && (
-                <ItemTypeSection
-                    header="Navigation Locked"
-                    isFetching={isFetching}
-                    mode={mode}
-                    elements={itemNavElements.locked}
-                />
-            )}
-            {!!itemNavElements.cast.length && (
-                <ItemTypeSection
-                    header="Cast Members"
-                    isFetching={isFetching}
-                    mode={mode}
-                    elements={itemNavElements.cast}
-                />
-            )}
-            {!!itemNavElements.location.length && (
-                <ItemTypeSection
-                    header="Locations"
-                    isFetching={isFetching}
-                    mode={mode}
-                    elements={itemNavElements.location}
-                />
-            )}
-            {!!itemNavElements.storyline.length && (
+    if (!orderMembersByLastAppearance) {
+        return (
+            <div className="text-center">
+                {!!itemNavElements.locked.length && (
+                    <ItemTypeSection
+                        header="Navigation Locked"
+                        isFetching={isFetching}
+                        mode={mode}
+                        elements={itemNavElements.locked}
+                    />
+                )}
+                {!!itemNavElements.cast.length && (
+                    <ItemTypeSection
+                        header="Cast Members"
+                        isFetching={isFetching}
+                        mode={mode}
+                        elements={itemNavElements.cast}
+                    />
+                )}
+                {!!itemNavElements.location.length && (
+                    <ItemTypeSection
+                        header="Locations"
+                        isFetching={isFetching}
+                        mode={mode}
+                        elements={itemNavElements.location}
+                    />
+                )}
+                {!!itemNavElements.storyline.length && (
+                    <ItemTypeSection
+                        header="Storylines"
+                        isFetching={isFetching}
+                        mode={mode}
+                        elements={itemNavElements.storyline}
+                    />
+                )}
+            </div>
+        )
+    } else {
+        return (
+            <div className="text-center">
                 <ItemTypeSection
-                    header="Storylines"
+                    header="Recent"
                     isFetching={isFetching}
                     mode={mode}
-                    elements={itemNavElements.storyline}
+                    elements={itemNavElements.all}
                 />
-            )}
-        </div>
-    )
+            </div>
+        )
+    }
 }
 
 function ItemTypeSection({
diff --git a/src/components/FilteredNavigationData/FilteredNavigationData.tsx b/src/components/FilteredNavigationData/FilteredNavigationData.tsx
@@ -24,6 +24,7 @@ export default function FilteredNavigationData({
     onSetCurrentComic,
     onShowInfoFor,
     useColors,
+    orderMembersByLastAppearance,
     editMode,
     onAddItem,
 }: {
@@ -35,6 +36,7 @@ export default function FilteredNavigationData({
     onSetCurrentComic: (comicId: ComicId) => void
     onShowInfoFor: (item: ItemId) => void
     useColors: boolean
+    orderMembersByLastAppearance: boolean
     editMode: boolean
     onAddItem: (item: ItemBody) => void
 }) {
@@ -80,6 +82,9 @@ export default function FilteredNavigationData({
                         isLoading={isLoading}
                         isFetching={isFetching}
                         useColors={useColors}
+                        orderMembersByLastAppearance={
+                            orderMembersByLastAppearance
+                        }
                         onSetCurrentComic={onSetCurrentComic}
                         onShowInfoFor={onShowInfoFor}
                         mode={NavElementMode.Missing}
diff --git a/src/components/SettingsDialog/SettingsPanel/SettingsPanel.tsx b/src/components/SettingsDialog/SettingsPanel/SettingsPanel.tsx
@@ -33,6 +33,18 @@ export default function SettingsPanel({
                     "treated like it's enabled, as an editor needs a list of all the cast to do their job effectively."
                 }
             />
+            <ToggleSetting
+                settings={settings}
+                setting="orderMembersByLastAppearance"
+                updateSettings={updateSettings}
+                label="Order members by last appearance"
+                description={
+                    "Ordinarily, members are ordered by how frequently they appear in the comic's strips. " +
+                    "By enabling this setting, they will instead be ordered by how recently they've appeared in the comic " +
+                    "relative to the currently viewed comic. This can be useful if you're an editor because the comic tends " +
+                    'to focus on a set of characters and locations in bulk, which makes finding them easier with this setting on.'
+                }
+            />
             <ToggleSetting
                 settings={settings}
                 setting="skipNonCanon"
diff --git a/src/models/ByIdQuery.ts b/src/models/ByIdQuery.ts
@@ -1,10 +1,12 @@
 // This file was generated by [ts-rs](https://github.com/Aleph-Alpha/ts-rs). Do not edit this file manually.
 import type { Exclusion } from './Exclusion'
 import type { Inclusion } from './Inclusion'
+import type { Sorting } from './Sorting'
 import type { Token } from './Token'
 
 export interface ByIdQuery {
     token?: Token
     exclude?: Exclusion
     include?: Inclusion
+    sorting?: Sorting
 }
diff --git a/src/models/Sorting.ts b/src/models/Sorting.ts
@@ -0,0 +1,3 @@
+// This file was generated by [ts-rs](https://github.com/Aleph-Alpha/ts-rs). Do not edit this file manually.
+
+export type Sorting = 'by-count' | 'by-last-appearance'
diff --git a/src/settings.ts b/src/settings.ts
@@ -21,6 +21,7 @@ export interface SettingValues {
     scrollToTop: boolean
 
     showAllMembers: boolean
+    orderMembersByLastAppearance: boolean
     useColors: boolean
     showItemRandomButton: boolean
     showItemChainButton: boolean
@@ -92,6 +93,7 @@ export class Settings {
         scrollToTop: true,
 
         showAllMembers: false,
+        orderMembersByLastAppearance: false,
         useColors: true,
         showItemRandomButton: false,
         showItemChainButton: false,
diff --git a/src/store/api/comicApiSlice.ts b/src/store/api/comicApiSlice.ts
@@ -30,6 +30,7 @@ export type GetDataQueryArgs = {
     skipGuest: boolean
     skipNonCanon: boolean
     showAllMembers: boolean
+    orderMembersByLastAppearance: boolean
 }
 
 export type GetExcludedQueryArgs = {
@@ -73,6 +74,7 @@ export const comicApiSlice = apiSlice.injectEndpoints({
                 skipGuest,
                 skipNonCanon,
                 showAllMembers,
+                orderMembersByLastAppearance,
             }) => {
                 const urlParameters: ByIdQuery = {}
                 if (editModeToken) {
@@ -86,6 +88,11 @@ export const comicApiSlice = apiSlice.injectEndpoints({
                 if (showAllMembers || editModeToken) {
                     urlParameters.include = 'all'
                 }
+                if (orderMembersByLastAppearance) {
+                    urlParameters.sorting = 'by-last-appearance'
+                } else {
+                    urlParameters.sorting = 'by-count'
+                }
                 const urlQuery = new URLSearchParams(
                     urlParameters as Record<string, string>
                 ).toString()
@@ -392,6 +399,7 @@ export function toGetDataQueryArgs(
         comic,
         editModeToken: settings.editMode ? settings.editModeToken : undefined,
         showAllMembers: settings.showAllMembers,
+        orderMembersByLastAppearance: settings.orderMembersByLastAppearance,
         skipGuest: settings.skipGuest,
         skipNonCanon: settings.skipNonCanon,
     }
