Merge pull request #351 from RaenonX-DL/dev

v2.17.0-beta.2 Release

cypress/integration/redirection.test.ts

@@ -1,5 +1,4 @@
-import {SupportedLanguages} from '../../src/api-def/api';
-import {DEFAULT_LANG} from '../../src/i18n/langCode';
+import {DEFAULT_LANG, SupportedLanguages} from '../../src/api-def/api';
 import {CookiesKeys} from '../../src/utils/cookies/keys';
 
 

package.json

@@ -2,7 +2,7 @@
   "name": "dragalia-site-front",
   "description": "Frontend of Dragalia Lost info website by OM.",
   "repository": "https://github.com/RaenonX-DL/dragalia-site-front",
-  "version": "2.17.0-beta.1",
+  "version": "2.17.0-beta.2",
   "engines": {
     "node": "16.x",
     "npm": "^8.3.0"

pages/api/auth/[...nextauth].ts

@@ -4,7 +4,7 @@ import {TypeORM} from 'next-auth/adapters';
 import Providers from 'next-auth/providers';
 
 import {AUTH_DB} from '../../../src/api-def/models';
-import {AuthPath} from '../../../src/const/path/definitions';
+import {AuthPath} from '../../../src/api-def/paths';
 import {UserModel} from '../../../src/models/user';
 import {ensureIndex} from '../../../src/utils/auth';
 

pages/auth/signin.tsx

@@ -1,8 +1,8 @@
 import {GetServerSideProps} from 'next';
 import {getProviders, getSession} from 'next-auth/client';
 
+import {GeneralPath} from '../../src/api-def/paths';
 import {SignInPage, SignInPageProps} from '../../src/components/elements/common/userControl/signIn/main';
-import {GeneralPath} from '../../src/const/path/definitions';
 
 
 export const getServerSideProps: GetServerSideProps<SignInPageProps> = async (context) => {

server/const/redirect.ts

@@ -1,4 +1,4 @@
-import {GeneralPath, PagePath} from '../../src/const/path/definitions';
+import {GeneralPath, PagePath} from '../../src/api-def/paths';
 
 
 export const redirectLookup: {[P in string]?: PagePath} = {

server/tests/post/analysis/get.test.tsx

@@ -5,12 +5,12 @@ import {screen} from '@testing-library/react';
 import {
   ApiResponseCode,
   CharaAnalysisGetResponse,
+  DEFAULT_LANG,
   DragonAnalysisGetResponse,
   SupportedLanguages,
   UnitType,
 } from '../../../../src/api-def/api';
 import {AnalysisPage} from '../../../../src/components/pages/posts/analysis/output';
-import {DEFAULT_LANG} from '../../../../src/i18n/langCode';
 import {translations} from '../../../../src/i18n/translations/main';
 import {getTFunction} from '../../../../src/i18n/utils';
 import {ApiRequestSender} from '../../../../src/utils/services/api/requestSender';

server/tests/post/misc/get.test.tsx

@@ -2,9 +2,8 @@ import React from 'react';
 
 import {screen} from '@testing-library/react';
 
-import {ApiResponseCode, MiscPostGetResponse, SupportedLanguages} from '../../../../src/api-def/api';
+import {DEFAULT_LANG, ApiResponseCode, MiscPostGetResponse, SupportedLanguages} from '../../../../src/api-def/api';
 import {MiscPage} from '../../../../src/components/pages/posts/misc/output';
-import {DEFAULT_LANG} from '../../../../src/i18n/langCode';
 import {translations} from '../../../../src/i18n/translations/main';
 import {ApiRequestSender} from '../../../../src/utils/services/api/requestSender';
 import {renderReact} from '../../../../test/render/main';

server/tests/post/quest/get.test.tsx

@@ -2,9 +2,8 @@ import React from 'react';
 
 import {screen} from '@testing-library/react';
 
-import {ApiResponseCode, QuestPostGetResponse, SupportedLanguages} from '../../../../src/api-def/api';
+import {DEFAULT_LANG, ApiResponseCode, QuestPostGetResponse, SupportedLanguages} from '../../../../src/api-def/api';
 import {QuestPage} from '../../../../src/components/pages/posts/quest/output';
-import {DEFAULT_LANG} from '../../../../src/i18n/langCode';
 import {translations} from '../../../../src/i18n/translations/main';
 import {ApiRequestSender} from '../../../../src/utils/services/api/requestSender';
 import {renderReact} from '../../../../test/render/main';

server/utils/handlers/routes.ts

@@ -2,11 +2,10 @@ import {URL} from 'url';
 
 import {FastifyInstance, FastifyReply, FastifyRequest} from 'fastify';
 
-import {isSupportedLang} from '../../../src/api-def/api';
-import {DEFAULT_LANG} from '../../../src/i18n/langCode';
+import {DEFAULT_LANG, isSupportedLang} from '../../../src/api-def/api';
+import {urlRemoveLang} from '../../../src/api-def/paths';
 import {CookiesKeys} from '../../../src/utils/cookies/keys';
 import {getCookies} from '../../../src/utils/cookies/utils';
-import {urlRemoveLang} from '../../../src/utils/path/process';
 import {redirectLookup} from '../../const/redirect';
 import {urlObjectToLegacy} from '../url';
 import {NextHandler, Server, ServerHasLang} from './types';

src/components/elements/common/button/dropdown.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+
+import Dropdown from 'react-bootstrap/Dropdown';
+import BsDropdownButton from 'react-bootstrap/DropdownButton';
+import {ButtonVariant} from 'react-bootstrap/types';
+
+
+type Props<E> = {
+  title: string,
+  variant: ButtonVariant,
+  options: E[],
+  isActive: (element: E) => boolean,
+  onClick: (element: E) => void,
+  getOptionText: (element: E) => string,
+};
+
+export const DropdownButton = <E, >({title, variant, options, onClick, isActive, getOptionText}: Props<E>) => {
+  return (
+    <BsDropdownButton title={title} variant={variant} menuVariant="dark">
+      {options.map((option, idx) => (
+        <Dropdown.Item
+          key={idx}
+          onClick={() => onClick(option)}
+          active={isActive(option)}
+        >
+          {getOptionText(option)}
+        </Dropdown.Item>
+      ))}
+    </BsDropdownButton>
+  );
+};

src/components/elements/common/buttonBar.test.tsx

@@ -5,7 +5,7 @@ import userEvent from '@testing-library/user-event';
 
 import {renderReact} from '../../../../test/render/main';
 import {SupportedLanguages} from '../../../api-def/api';
-import {GeneralPath, PATH_ROOT} from '../../../const/path/definitions';
+import {GeneralPath, PATH_ROOT} from '../../../api-def/paths';
 import {ButtonBar} from './buttonBar';
 
 

src/components/elements/common/buttonBar.tsx

@@ -5,8 +5,8 @@ import Col from 'react-bootstrap/Col';
 import Row from 'react-bootstrap/Row';
 import {ButtonVariant} from 'react-bootstrap/types';
 
+import {pathnameRemoveLang, urlRemoveLang} from '../../../api-def/paths';
 import {useI18n} from '../../../i18n/hook';
-import {pathnameRemoveLang, urlRemoveLang} from '../../../utils/path/process';
 
 
 export type ButtonEntry = {

src/components/elements/common/link/internal.test.tsx

@@ -5,8 +5,7 @@ import userEvent from '@testing-library/user-event';
 
 import {renderReact} from '../../../../../test/render/main';
 import {SupportedLanguages} from '../../../../api-def/api';
-import {GeneralPath} from '../../../../const/path/definitions';
-import {makeGeneralUrl} from '../../../../utils/path/make';
+import {makeGeneralUrl, GeneralPath} from '../../../../api-def/paths';
 import {InternalLink} from './internal';
 
 

src/components/elements/common/link/internal.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import {SupportedLanguages} from '../../../../api-def/api';
-import {urlRemoveLang} from '../../../../utils/path/process';
+import {urlRemoveLang} from '../../../../api-def/paths';
 
 
 type Props<T, A extends HTMLAnchorElement> = {

src/components/elements/common/userControl/button/login.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 
 import Button from 'react-bootstrap/Button';
 
-import {AuthPath} from '../../../../../const/path/definitions';
+import {AuthPath} from '../../../../../api-def/paths';
 import {useI18n} from '../../../../../i18n/hook';
 
 

src/components/elements/common/userControl/button/main.test.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import {screen} from '@testing-library/react';
 
 import {renderReact} from '../../../../../../test/render/main';
-import {AuthPath} from '../../../../../const/path/definitions';
+import {AuthPath} from '../../../../../api-def/paths';
 import {translation as translationEN} from '../../../../../i18n/translations/en/translation';
 import {UserControlButton} from './main';
 
@@ -12,9 +12,7 @@ describe('Sign-in button', () => {
   it('shows logout when the user is logged in', async () => {
     renderReact(
       () => <UserControlButton/>,
-      {
-        hasSession: true,
-      },
+      {hasSession: true},
     );
 
     expect(screen.getByText(translationEN.userControl.logout)).toBeInTheDocument();
@@ -23,9 +21,7 @@ describe('Sign-in button', () => {
   it('shows login if the user has not logged in', async () => {
     renderReact(
       () => <UserControlButton/>,
-      {
-        hasSession: false,
-      },
+      {hasSession: false},
     );
 
     expect(screen.getByText(translationEN.userControl.login)).toBeInTheDocument();
@@ -36,9 +32,7 @@ describe('Sign-in button', () => {
       () => <UserControlButton/>,
       {
         hasSession: false,
-        routerOptions: {
-          pathname: AuthPath.SIGN_IN,
-        },
+        routerOptions: {pathname: AuthPath.SIGN_IN},
       },
     );
 

src/components/elements/common/userControl/button/main.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import {AuthPath} from '../../../../../const/path/definitions';
+import {AuthPath} from '../../../../../api-def/paths';
 import {AppReactContext} from '../../../../../context/app/main';
 import {useNextRouter} from '../../../../../utils/router';
 import {LoginButton} from './login';

src/components/elements/gameData/unit/filter/main.test.tsx

@@ -243,6 +243,21 @@ describe('Unit filter input', () => {
     expect(onSearchRequested).toHaveBeenCalledWith(expectedInput);
   });
 
+  it('passes input data with sort order', async () => {
+    renderReact(() => (
+      <UnitFilter
+        sortOrderNames={{unitId: () => 'Unit ID', viewCount: () => 'View Count'}}
+        onSearchRequested={onSearchRequested}
+        generateInputData={() => generateFilterInput('unitId')}
+      />
+    ));
+
+    const sorter = await screen.findByText(/Sort by/);
+    userEvent.click(sorter);
+
+    expect(screen.getByText('Unit ID')).toHaveClass('active');
+  });
+
   it('passes input data with multiple conditions', async () => {
     renderReact(() => (
       <UnitFilter

src/components/elements/gameData/unit/filter/main.tsx

@@ -2,8 +2,6 @@ import React, {FormEvent} from 'react';
 
 import Button from 'react-bootstrap/Button';
 import Col from 'react-bootstrap/Col';
-import Dropdown from 'react-bootstrap/Dropdown';
-import DropdownButton from 'react-bootstrap/DropdownButton';
 import Form from 'react-bootstrap/Form';
 import Spinner from 'react-bootstrap/Spinner';
 
@@ -12,6 +10,7 @@ import {useI18n} from '../../../../../i18n/hook';
 import {GetTranslationFunction} from '../../../../../i18n/types';
 import {useUnitProps} from '../../../../hooks/unitProps';
 import {AdsPageTop, AdsUnitSearchBottom} from '../../../common/ads/main';
+import {DropdownButton} from '../../../common/button/dropdown';
 import {CheckOption} from '../../../common/check/types';
 import {RowTight} from '../../../common/grid/row';
 import {FloatingInput} from '../../../form/control/floating/input';
@@ -104,17 +103,14 @@ export const UnitFilter = <S extends string,
               />
             </Col>
             <Col xs md="auto" className={styles.button}>
-              <DropdownButton title={sortTitle} variant="outline-light" menuVariant="dark">
-                {Object.entries(sortOrderNames).map(([sortBy, getNameFunc], idx) => (
-                  <Dropdown.Item
-                    key={idx}
-                    onClick={() => setInputData({...inputData, sortBy: sortBy as S})}
-                    active={sortBy === inputData.sortBy}
-                  >
-                    {t(getNameFunc as GetTranslationFunction)}
-                  </Dropdown.Item>
-                ))}
-              </DropdownButton>
+              <DropdownButton
+                title={sortTitle}
+                variant="outline-light"
+                options={Object.entries(sortOrderNames)}
+                isActive={([sortBy]) => sortBy === inputData.sortBy}
+                onClick={([sortBy]) => setInputData({...inputData, sortBy})}
+                getOptionText={([_, getNameFunc]) => t(getNameFunc as GetTranslationFunction)}
+              />
             </Col>
             <Col xs="auto" className={styles.button}>
               <Button variant="outline-info" type="submit" disabled={disabled}>

src/components/elements/gameData/unit/iconClickable.test.tsx

@@ -5,8 +5,7 @@ import userEvent from '@testing-library/user-event';
 
 import {renderReact} from '../../../../../test/render/main';
 import {SupportedLanguages, UnitType} from '../../../../api-def/api';
-import {PostPath, StoryPath, UnitPath} from '../../../../const/path/definitions';
-import {makePostUrl, makeStoryUrl, makeUnitUrl} from '../../../../utils/path/make';
+import {makePostUrl, makeStoryUrl, makeUnitUrl, PostPath, StoryPath, UnitPath} from '../../../../api-def/paths';
 import {UnitIconClickable} from './iconClickable';
 
 

src/components/elements/gameData/unit/link.test.tsx

@@ -5,9 +5,8 @@ import userEvent from '@testing-library/user-event';
 
 import {renderReact} from '../../../../../test/render/main';
 import {SupportedLanguages, UnitType} from '../../../../api-def/api';
+import {makePostUrl, makeStoryUrl, makeUnitUrl, PostPath, StoryPath, UnitPath} from '../../../../api-def/paths';
 import {DepotPaths} from '../../../../api-def/resources';
-import {PostPath, StoryPath, UnitPath} from '../../../../const/path/definitions';
-import {makePostUrl, makeStoryUrl, makeUnitUrl} from '../../../../utils/path/make';
 import {UnitLink} from './link';
 
 

src/components/elements/gameData/unit/modal/main.tsx

@@ -2,9 +2,8 @@ import React from 'react';
 
 import Col from 'react-bootstrap/Col';
 
-import {PostPath, StoryPath, UnitPath} from '../../../../../const/path/definitions';
+import {makePostUrl, makeStoryUrl, makeUnitUrl, PostPath, StoryPath, UnitPath} from '../../../../../api-def/paths';
 import {useI18n} from '../../../../../i18n/hook';
-import {makePostUrl, makeStoryUrl, makeUnitUrl} from '../../../../../utils/path/make';
 import {RowTight} from '../../../common/grid/row';
 import {UnitLinkButton} from './button';
 import {UnitInfo} from './types';

src/components/elements/input/panel/entry.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
 
+import ProgressBar from 'react-bootstrap/ProgressBar';
+
 import {EnumEntry} from '../../../../api-def/resources';
 import {EnumCheckboxGroup} from '../../common/check/enum/checkbox';
 import {EnumRadioGroup} from '../../common/check/enum/radio';
@@ -57,6 +59,9 @@ export const InputPanelEntry = <E extends CheckOption, E2 extends EnumEntry, T,
   if (inputEntry.type === 'select') {
     return <InputSelectEntry {...inputEntry} inputData={inputData} setInputData={setInputData}/>;
   }
+  if (inputEntry.type === 'progress') {
+    return <ProgressBar now={inputEntry.value} className="mb-3" {...inputEntry}/>;
+  }
 
   throw new Error(`Unhandled input entry: ${inputEntry}`);
 };

src/components/elements/input/panel/types.ts

@@ -1,3 +1,5 @@
+import {ProgressBarProps} from 'react-bootstrap/ProgressBar';
+
 import {EnumEntry} from '../../../../api-def/resources';
 import {EnumChecksBoxProps} from '../../common/check/enum/checkbox';
 import {EnumRadioGroupProps} from '../../common/check/enum/radio';
@@ -77,6 +79,12 @@ export type InputEntrySelect<E, T> = {
   getText?: (entry: E) => string,
 };
 
+export type InputEntryProgressBar = {
+  type: 'progress',
+  value: number,
+  variant: ProgressBarProps['variant'],
+};
+
 export type InputEntry<E, E2 extends EnumEntry, T, V> =
   InputEntryTitle |
   InputEntrySubTitle |
@@ -87,7 +95,8 @@ export type InputEntry<E, E2 extends EnumEntry, T, V> =
   InputEntryRadioGroup<E, T, V> |
   InputEntryEnumRadioGroup<E2, T> |
   InputEntryEnumCheckGroup<E2, T> |
-  InputEntrySelect<E, T>;
+  InputEntrySelect<E, T> |
+  InputEntryProgressBar;
 
 export type InputEntries<E, E2 extends EnumEntry, T, V> = Array<InputEntry<E, E2, T, V>>;
 

src/components/elements/posts/list/page.test.tsx

@@ -4,7 +4,7 @@ import {screen, waitFor} from '@testing-library/react';
 
 import {renderReact} from '../../../../../test/render/main';
 import {ApiResponseCode} from '../../../../api-def/api';
-import {PostPath} from '../../../../const/path/definitions';
+import {PostPath} from '../../../../api-def/paths';
 import {PostLookupPage} from './page';
 
 

src/components/elements/posts/manageBar.test.tsx

@@ -4,7 +4,7 @@ import {screen} from '@testing-library/react';
 
 import {renderReact} from '../../../../test/render/main';
 import {SupportedLanguages} from '../../../api-def/api';
-import {GeneralPath} from '../../../const/path/definitions';
+import {GeneralPath} from '../../../api-def/paths';
 import {translation as translationEN} from '../../../i18n/translations/en/translation';
 import {PostManageBar} from './manageBar';
 

src/components/elements/posts/output/alert.tsx

@@ -2,10 +2,9 @@ import React from 'react';
 
 import Alert from 'react-bootstrap/Alert';
 
-import {SupportedLanguageNames, PostGetResponse} from '../../../../api-def/api';
-import {PostPath} from '../../../../const/path/definitions';
+import {PostGetResponse, SupportedLanguageNames} from '../../../../api-def/api';
+import {makePostUrl, PostPath} from '../../../../api-def/paths';
 import {useI18n} from '../../../../i18n/hook';
-import {makePostUrl} from '../../../../utils/path/make';
 import {InternalLink} from '../../common/link/internal';