diff --git a/.eslintrc b/.eslintrc index 0524aabd3..72fee9de8 100644 --- a/.eslintrc +++ b/.eslintrc @@ -6,7 +6,9 @@ ], "rules": { "semi": ["error", "always"], - "no-use-before-define": "off" + "no-use-before-define": "off", + "fabmanager/component-class-named-as-component": "error", + "import/no-default-export": "error" }, "globals": { "Application": true, @@ -19,7 +21,7 @@ "$": true, "KeyboardEvent": true }, - "plugins": ["html-erb"], + "plugins": ["html-erb", "fabmanager"], "overrides": [ { "files": ["**/*.ts", "**/*.tsx"], diff --git a/app/frontend/src/javascript/components/base/text-editor/fab-text-editor.tsx b/app/frontend/src/javascript/components/base/text-editor/fab-text-editor.tsx index bf7414244..37db695fc 100644 --- a/app/frontend/src/javascript/components/base/text-editor/fab-text-editor.tsx +++ b/app/frontend/src/javascript/components/base/text-editor/fab-text-editor.tsx @@ -101,4 +101,5 @@ export const FabTextEditor: React.ForwardRefRenderFunction = ({ user, machine, onShowMachine, onReserveMachine, onError, onSuccess, onLoginRequested, onEnrollRequested, canProposePacks }) => { +const MachineCard: React.FC = ({ user, machine, onShowMachine, onReserveMachine, onError, onSuccess, onLoginRequested, onEnrollRequested, canProposePacks }) => { const { t } = useTranslation('public'); // shall we display a loader to prevent double-clicking, while the machine details are loading? @@ -82,10 +82,12 @@ const MachineCardComponent: React.FC = ({ user, machine, onSho ); }; -export const MachineCard: React.FC = ({ user, machine, onShowMachine, onReserveMachine, onError, onSuccess, onLoginRequested, onEnrollRequested, canProposePacks }) => { +const MachineCardWrapper: React.FC = ({ user, machine, onShowMachine, onReserveMachine, onError, onSuccess, onLoginRequested, onEnrollRequested, canProposePacks }) => { return ( - + ); }; + +export { MachineCardWrapper as MachineCard }; diff --git a/app/frontend/src/javascript/components/machines/pending-training-modal.tsx b/app/frontend/src/javascript/components/machines/pending-training-modal.tsx index e1f32fd2a..051eab884 100644 --- a/app/frontend/src/javascript/components/machines/pending-training-modal.tsx +++ b/app/frontend/src/javascript/components/machines/pending-training-modal.tsx @@ -3,11 +3,12 @@ import { FabModal } from '../base/fab-modal'; import { useTranslation } from 'react-i18next'; import { HtmlTranslate } from '../base/html-translate'; import FormatLib from '../../lib/format'; +import { TDateISO } from '../../typings/date-iso'; interface PendingTrainingModalProps { isOpen: boolean, toggleModal: () => void, - nextReservation: Date, + nextReservation: TDateISO, } /** @@ -20,7 +21,7 @@ export const PendingTrainingModal: React.FC = ({ isOp /** * Return the formatted localized date for the given date */ - const formatDateTime = (date: Date): string => { + const formatDateTime = (date: TDateISO): string => { return t('app.logged.pending_training_modal.DATE_TIME', { DATE: FormatLib.date(date), TIME: FormatLib.time(date) }); }; diff --git a/app/frontend/src/javascript/components/payment-schedule/payment-schedules-table.tsx b/app/frontend/src/javascript/components/payment-schedule/payment-schedules-table.tsx index 9164c9555..3236bf49b 100644 --- a/app/frontend/src/javascript/components/payment-schedule/payment-schedules-table.tsx +++ b/app/frontend/src/javascript/components/payment-schedule/payment-schedules-table.tsx @@ -26,7 +26,7 @@ interface PaymentSchedulesTableProps { /** * This component shows a list of all payment schedules with their associated deadlines (aka. PaymentScheduleItem) and invoices */ -const PaymentSchedulesTableComponent: React.FC = ({ paymentSchedules, showCustomer, refreshList, operator, onError, onCardUpdateSuccess }) => { +const PaymentSchedulesTable: React.FC = ({ paymentSchedules, showCustomer, refreshList, operator, onError, onCardUpdateSuccess }) => { const { t } = useTranslation('shared'); // for each payment schedule: are the details (all deadlines) shown or hidden? @@ -68,8 +68,10 @@ const PaymentSchedulesTableComponent: React.FC = ({ */ const expandCollapseIcon = (paymentScheduleId: number): JSX.Element => { if (isExpanded(paymentScheduleId)) { + // eslint-disable-next-line fabmanager/component-class-named-as-component return ; } else { + // eslint-disable-next-line fabmanager/component-class-named-as-component return ; } }; @@ -93,6 +95,7 @@ const PaymentSchedulesTableComponent: React.FC = ({ const downloadScheduleButton = (id: number): JSX.Element => { const link = `api/payment_schedules/${id}/download`; return ( + // eslint-disable-next-line fabmanager/component-class-named-as-component {t('app.shared.schedules_table.download')} @@ -109,6 +112,7 @@ const PaymentSchedulesTableComponent: React.FC = ({ const key = `app.shared.schedules_table.method_${item.payment_method}`; res += ` (${t(key)})`; } + // eslint-disable-next-line fabmanager/component-class-named-as-component return {res}; }; @@ -121,7 +125,7 @@ const PaymentSchedulesTableComponent: React.FC = ({ const renderPaymentSchedulesTable = (): ReactElement => { return ( - +
@@ -212,12 +216,14 @@ const PaymentSchedulesTableComponent: React.FC = ({ return
; } }; -PaymentSchedulesTableComponent.defaultProps = { showCustomer: false }; +PaymentSchedulesTable.defaultProps = { showCustomer: false }; -export const PaymentSchedulesTable: React.FC = ({ paymentSchedules, showCustomer, refreshList, operator, onError, onCardUpdateSuccess }) => { +const PaymentSchedulesTableWrapper: React.FC = ({ paymentSchedules, showCustomer, refreshList, operator, onError, onCardUpdateSuccess }) => { return ( - + ); }; + +export { PaymentSchedulesTableWrapper as PaymentSchedulesTable }; diff --git a/app/frontend/src/javascript/components/payment/abstract-payment-modal.tsx b/app/frontend/src/javascript/components/payment/abstract-payment-modal.tsx index f031ecca7..42596f0be 100644 --- a/app/frontend/src/javascript/components/payment/abstract-payment-modal.tsx +++ b/app/frontend/src/javascript/components/payment/abstract-payment-modal.tsx @@ -203,7 +203,7 @@ export const AbstractPaymentModal: React.FC = ({ isOp width={modalSize} closeButton={false} customFooter={logoFooter} - className={`payment-modal ${className || ''}`}> + className={`abstract-payment-modal ${className || ''}`}> {ready &&
= ({ plan, userId, subscribedPlanId, operator, onSelectPlan, isSelected, onLoginRequested, canSelectPlan }) => { +const PlanCard: React.FC = ({ plan, userId, subscribedPlanId, operator, onSelectPlan, isSelected, onLoginRequested, canSelectPlan }) => { const { t } = useTranslation('public'); /** * Return the formatted localized amount of the given plan (eg. 20.5 => "20,50 €") @@ -144,10 +144,12 @@ const PlanCardComponent: React.FC = ({ plan, userId, subscribedPl ); }; -export const PlanCard: React.FC = ({ plan, userId, subscribedPlanId, operator, onSelectPlan, isSelected, onLoginRequested, canSelectPlan }) => { +const PlanCardWrapper: React.FC = ({ plan, userId, subscribedPlanId, operator, onSelectPlan, isSelected, onLoginRequested, canSelectPlan }) => { return ( - + ); }; + +export { PlanCardWrapper as PlanCard }; diff --git a/app/frontend/src/javascript/components/pricing/editable-price.tsx b/app/frontend/src/javascript/components/pricing/editable-price.tsx index f6226d33f..d24fb7c20 100644 --- a/app/frontend/src/javascript/components/pricing/editable-price.tsx +++ b/app/frontend/src/javascript/components/pricing/editable-price.tsx @@ -30,6 +30,13 @@ export const EditablePrice: React.FC = ({ price, onSave }) = toggleEdit(); }; + /** + * Callback triggered when the user input a new price + */ + const handleChangePrice = (value: string): void => { + setTempPrice(value); + }; + /** * Enable or disable the edit mode */ @@ -41,7 +48,7 @@ export const EditablePrice: React.FC = ({ price, onSave }) = {!edit && {FormatLib.price(price.amount)}} {edit && - + } className="approve-button" onClick={handleValidateEdit} /> } className="cancel-button" onClick={toggleEdit} /> } diff --git a/app/frontend/src/stylesheets/application.scss b/app/frontend/src/stylesheets/application.scss index c134acab2..fdc00c5d8 100644 --- a/app/frontend/src/stylesheets/application.scss +++ b/app/frontend/src/stylesheets/application.scss @@ -44,7 +44,7 @@ @import "modules/payment-schedule/payment-schedules-list"; @import "modules/payment-schedule/payment-schedules-table"; @import "modules/payment/local-payment/local-payment-modal"; -@import "modules/payment/payment-modal"; +@import "modules/payment/abstract-payment-modal"; @import "modules/payment/payzen/payzen-keys-form"; @import "modules/payment/payzen/payzen-modal"; @import "modules/payment/payzen/payzen-settings"; diff --git a/app/frontend/src/stylesheets/modules/payment-schedule/payment-schedules-table.scss b/app/frontend/src/stylesheets/modules/payment-schedule/payment-schedules-table.scss index 86121e97a..4d4b0d7d7 100644 --- a/app/frontend/src/stylesheets/modules/payment-schedule/payment-schedules-table.scss +++ b/app/frontend/src/stylesheets/modules/payment-schedule/payment-schedules-table.scss @@ -1,4 +1,4 @@ -.schedules-table { +.payment-schedules-table { table-layout: fixed; border: 1px solid #e9e9e9; border-top: 0; diff --git a/app/frontend/src/stylesheets/modules/payment/payment-modal.scss b/app/frontend/src/stylesheets/modules/payment/abstract-payment-modal.scss similarity index 98% rename from app/frontend/src/stylesheets/modules/payment/payment-modal.scss rename to app/frontend/src/stylesheets/modules/payment/abstract-payment-modal.scss index ad905afb0..1483a71b4 100644 --- a/app/frontend/src/stylesheets/modules/payment/payment-modal.scss +++ b/app/frontend/src/stylesheets/modules/payment/abstract-payment-modal.scss @@ -1,4 +1,4 @@ -.payment-modal { +.abstract-payment-modal { .fab-modal-content { padding-bottom: 0; } diff --git a/package.json b/package.json index 942fc73db..305ade0b1 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "@typescript-eslint/parser": "^5.17.0", "eslint": "~8.12.0", "eslint-config-standard": "~17.0.0-1", + "eslint-plugin-fabmanager": "^0.0.13", "eslint-plugin-html-erb": "^1.0.1", "eslint-plugin-import": "~2.25.4", "eslint-plugin-n": "^15.1.0", diff --git a/yarn.lock b/yarn.lock index 463c8cbdd..af07a1863 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4082,6 +4082,11 @@ eslint-plugin-es@^4.1.0: eslint-utils "^2.0.0" regexpp "^3.0.0" +eslint-plugin-fabmanager@^0.0.13: + version "0.0.13" + resolved "https://registry.yarnpkg.com/eslint-plugin-fabmanager/-/eslint-plugin-fabmanager-0.0.13.tgz#bf7b8beee1485a354ecfc42e2649501da25d5996" + integrity sha512-cYJecCNMG/2hJ41HM6GrfnMwb9MaMQXob7V90U8kkdt3Os4rf//cv/6lTWJiX0Wpnp9nVbQavkPKX5cJ8gYA/w== + eslint-plugin-html-erb@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/eslint-plugin-html-erb/-/eslint-plugin-html-erb-1.0.1.tgz#f4a55070d5eabe365e13dba587a1d779bfe36eb6"