Skip to content

Commit

Permalink
[Maintenance] ESLint: prefer-const components folder part 2 (actualbu…
Browse files Browse the repository at this point in the history
…dget#2034)

* ESLint prefer-const components folder part 2

* Release notes
  • Loading branch information
joel-jeremy authored Dec 5, 2023
1 parent f1253ea commit 1972b07
Show file tree
Hide file tree
Showing 96 changed files with 796 additions and 764 deletions.
24 changes: 12 additions & 12 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -239,7 +239,7 @@ module.exports = {
'./packages/api/app/**/*',
'./packages/crdt/**/*',
'./packages/desktop-client/src/*',
// './packages/desktop-client/src/components/*',
'./packages/desktop-client/src/components/*',
'./packages/desktop-client/src/components/accounts/**/*',
'./packages/desktop-client/src/components/autocomplete/**/*',
'./packages/desktop-client/src/components/budget/**/*',
Expand All @@ -249,17 +249,17 @@ module.exports = {
'./packages/desktop-client/src/components/manager/**/*',
'./packages/desktop-client/src/components/mobile/**/*',
'./packages/desktop-client/src/components/modals/**/*',
// './packages/desktop-client/src/components/payees/**/*',
// './packages/desktop-client/src/components/reports/**/*',
// './packages/desktop-client/src/components/responsive/**/*',
// './packages/desktop-client/src/components/rules/**/*',
// './packages/desktop-client/src/components/schedules/**/*',
// './packages/desktop-client/src/components/select/**/*',
// './packages/desktop-client/src/components/settings/**/*',
// './packages/desktop-client/src/components/sidebar/**/*',
// './packages/desktop-client/src/components/spreadsheet/**/*',
// './packages/desktop-client/src/components/transactions/**/*',
// './packages/desktop-client/src/components/util/**/*',
'./packages/desktop-client/src/components/payees/**/*',
'./packages/desktop-client/src/components/reports/**/*',
'./packages/desktop-client/src/components/responsive/**/*',
'./packages/desktop-client/src/components/rules/**/*',
'./packages/desktop-client/src/components/schedules/**/*',
'./packages/desktop-client/src/components/select/**/*',
'./packages/desktop-client/src/components/settings/**/*',
'./packages/desktop-client/src/components/sidebar/**/*',
'./packages/desktop-client/src/components/spreadsheet/**/*',
'./packages/desktop-client/src/components/transactions/**/*',
'./packages/desktop-client/src/components/util/**/*',
'./packages/desktop-client/src/hooks/**/*',
'./packages/desktop-client/src/icons/**/*',
'./packages/desktop-client/src/style/**/*',
Expand Down
2 changes: 1 addition & 1 deletion packages/desktop-client/src/components/AnimatedRefresh.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { type CSSProperties } from '../style';

import View from './common/View';

let spin = keyframes({
const spin = keyframes({
'0%': { transform: 'rotateZ(0deg)' },
'100%': { transform: 'rotateZ(360deg)' },
});
Expand Down
10 changes: 5 additions & 5 deletions packages/desktop-client/src/components/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ function App({
// don't block on this in case they are offline or something)
send('get-remote-files').then(files => {
if (files) {
let remoteFile = files.find(f => f.fileId === cloudFileId);
const remoteFile = files.find(f => f.fileId === cloudFileId);
if (remoteFile && remoteFile.deleted) {
closeBudget();
}
Expand Down Expand Up @@ -122,14 +122,14 @@ function ErrorFallback({ error }: FallbackProps) {
}

function AppWrapper() {
let budgetId = useSelector(
const budgetId = useSelector(
state => state.prefs.local && state.prefs.local.id,
);
let cloudFileId = useSelector(
const cloudFileId = useSelector(
state => state.prefs.local && state.prefs.local.cloudFileId,
);
let loadingText = useSelector(state => state.app.loadingText);
let { loadBudget, closeBudget, loadGlobalPrefs, sync } = useActions();
const loadingText = useSelector(state => state.app.loadingText);
const { loadBudget, closeBudget, loadGlobalPrefs, sync } = useActions();
const [hiddenScrollbars, setHiddenScrollbars] = useState(
hasHiddenScrollbars(),
);
Expand Down
6 changes: 3 additions & 3 deletions packages/desktop-client/src/components/BackgroundImage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@ import * as React from 'react';

import { theme } from '../style';

let linesTop = theme.pageBackgroundLineTop; // lines top
let linesMid = theme.pageBackgroundLineMid; // lines mid
let linesBottom = theme.pageBackgroundLineBottom; // lines bottom
const linesTop = theme.pageBackgroundLineTop; // lines top
const linesMid = theme.pageBackgroundLineMid; // lines mid
const linesBottom = theme.pageBackgroundLineBottom; // lines bottom

export function BackgroundImage() {
return (
Expand Down
4 changes: 2 additions & 2 deletions packages/desktop-client/src/components/BankSyncStatus.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,9 @@ import Text from './common/Text';
import View from './common/View';

export default function BankSyncStatus() {
let accountsSyncing = useSelector(state => state.account.accountsSyncing);
const accountsSyncing = useSelector(state => state.account.accountsSyncing);

let name = accountsSyncing
const name = accountsSyncing
? accountsSyncing === '__all'
? 'accounts'
: accountsSyncing
Expand Down
6 changes: 3 additions & 3 deletions packages/desktop-client/src/components/FatalError.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -113,8 +113,8 @@ function RenderUIError() {
}

function SharedArrayBufferOverride() {
let [expanded, setExpanded] = useState(false);
let [understand, setUnderstand] = useState(false);
const [expanded, setExpanded] = useState(false);
const [understand, setUnderstand] = useState(false);

return expanded ? (
<>
Expand Down Expand Up @@ -152,7 +152,7 @@ function SharedArrayBufferOverride() {
}

function FatalError({ buttonText, error }: FatalErrorProps) {
let [showError, setShowError] = useState(false);
const [showError, setShowError] = useState(false);

const showSimpleRender = 'type' in error && error.type === 'app-init-failure';

Expand Down
10 changes: 5 additions & 5 deletions packages/desktop-client/src/components/FinancesApp.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ function WideNotSupported({ children, redirectTo = '/budget' }) {
}

function RouterBehaviors({ getAccounts }) {
let navigate = useNavigate();
const navigate = useNavigate();
useEffect(() => {
// Get the accounts and check if any exist. If there are no
// accounts, we want to redirect the user to the All Accounts
Expand All @@ -83,8 +83,8 @@ function RouterBehaviors({ getAccounts }) {
});
}, []);

let location = useLocation();
let href = useHref(location);
const location = useLocation();
const href = useHref(location);
useEffect(() => {
undo.setUndoState('url', href);
}, [href]);
Expand All @@ -93,7 +93,7 @@ function RouterBehaviors({ getAccounts }) {
}

function FinancesApp() {
let actions = useActions();
const actions = useActions();
useEffect(() => {
// The default key handler scope
hotkeys.setScope('app');
Expand Down Expand Up @@ -251,7 +251,7 @@ function FinancesApp() {
}

export default function FinancesAppWithContext() {
let app = useMemo(() => <FinancesApp />, []);
const app = useMemo(() => <FinancesApp />, []);

return (
<SpreadsheetProvider>
Expand Down
45 changes: 25 additions & 20 deletions packages/desktop-client/src/components/FixedSizeList.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ const IS_SCROLLING_DEBOUNCE_INTERVAL = 150;
const defaultItemKey = (index, data) => index;

function ResizeObserver({ onResize, children }) {
let ref = useResizeObserver(onResize);
const ref = useResizeObserver(onResize);
return children(ref);
}

Expand Down Expand Up @@ -92,8 +92,8 @@ export default class FixedSizeList extends PureComponent {

getAnchoredScrollPos() {
if (this.anchored && this.props.indexForKey && this._outerRef != null) {
let index = this.props.indexForKey(this.anchored.key);
let baseOffset = this.getOffsetForIndexAndAlignment(index, 'start');
const index = this.props.indexForKey(this.anchored.key);
const baseOffset = this.getOffsetForIndexAndAlignment(index, 'start');
return baseOffset + this.anchored.offset;
}
return null;
Expand All @@ -102,7 +102,7 @@ export default class FixedSizeList extends PureComponent {
componentDidUpdate() {
const { scrollOffset, scrollUpdateWasRequested } = this.state;

let anchoredPos = this.getAnchoredScrollPos();
const anchoredPos = this.getAnchoredScrollPos();
if (anchoredPos != null) {
const outerRef = this._outerRef;
outerRef.scrollTop = anchoredPos;
Expand Down Expand Up @@ -157,9 +157,9 @@ export default class FixedSizeList extends PureComponent {
const items = [];
if (itemCount > 0) {
for (let index = startIndex; index <= stopIndex; index++) {
let key = itemKey(index);
const key = itemKey(index);
let style = this._getItemStyle(index);
let lastPosition = this.lastPositions.current.get(key);
const lastPosition = this.lastPositions.current.get(key);
let animating = false;
positions.set(key, style.top);

Expand Down Expand Up @@ -191,10 +191,10 @@ export default class FixedSizeList extends PureComponent {

// Read this value AFTER items have been created,
// So their actual sizes (if variable) are taken into consideration.
let estimatedTotalSize = this.getEstimatedTotalSize();
const estimatedTotalSize = this.getEstimatedTotalSize();

let OuterElement = outerElementType || outerTagName || 'div';
let InnerElement = innerElementType || innerTagName || 'div';
const OuterElement = outerElementType || outerTagName || 'div';
const InnerElement = innerElementType || innerTagName || 'div';

return (
<ResizeObserver onResize={this.onHeaderResize}>
Expand Down Expand Up @@ -231,7 +231,7 @@ export default class FixedSizeList extends PureComponent {
setRowAnimation = flag => {
this.animationEnabled = flag;

let outerRef = this._outerRef;
const outerRef = this._outerRef;
if (outerRef) {
if (this.animationEnabled) {
outerRef.classList.add('animated');
Expand All @@ -246,12 +246,12 @@ export default class FixedSizeList extends PureComponent {
};

anchor() {
let itemKey = this.props.itemKey || defaultItemKey;
const itemKey = this.props.itemKey || defaultItemKey;

let outerRef = this._outerRef;
let scrollOffset = outerRef ? outerRef.scrollTop : 0;
let index = this.getStartIndexForOffset(scrollOffset);
let key = itemKey(index);
const outerRef = this._outerRef;
const scrollOffset = outerRef ? outerRef.scrollTop : 0;
const index = this.getStartIndexForOffset(scrollOffset);
const key = itemKey(index);

this.anchored = {
key,
Expand Down Expand Up @@ -434,10 +434,15 @@ export default class FixedSizeList extends PureComponent {
_getItemStyleCache = memoizeOne((_, __, ___) => ({}));

_getRangeToRender() {
let { itemCount, overscanCount } = this.props;
let { isScrolling, scrollDirection, scrollOffset } = this.state;
const { itemCount, overscanCount } = this.props;
const {
isScrolling,
scrollDirection,
scrollOffset: originalScrollOffset,
} = this.state;

let anchoredPos = this.getAnchoredScrollPos();
const anchoredPos = this.getAnchoredScrollPos();
let scrollOffset = originalScrollOffset;
if (anchoredPos != null) {
scrollOffset = anchoredPos;
}
Expand Down Expand Up @@ -469,7 +474,7 @@ export default class FixedSizeList extends PureComponent {
}

_onScrollVertical = event => {
let { scrollTop } = event.currentTarget;
const { scrollTop } = event.currentTarget;

this.setState(prevState => {
if (prevState.scrollOffset === scrollTop) {
Expand All @@ -479,7 +484,7 @@ export default class FixedSizeList extends PureComponent {
return null;
}

let scrollOffset = scrollTop;
const scrollOffset = scrollTop;

return {
isScrolling: true,
Expand Down
2 changes: 1 addition & 1 deletion packages/desktop-client/src/components/GlobalKeys.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import * as Platform from 'loot-core/src/client/platform';
import useNavigate from '../hooks/useNavigate';

export default function GlobalKeys() {
let navigate = useNavigate();
const navigate = useNavigate();
useEffect(() => {
const handleKeys = e => {
if (Platform.isBrowser) {
Expand Down
10 changes: 5 additions & 5 deletions packages/desktop-client/src/components/KeyHandlers.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ import React, { createContext, useEffect, useContext } from 'react';

import hotkeys, { type KeyHandler as HotKeyHandler } from 'hotkeys-js';

let KeyScopeContext = createContext('app');
const KeyScopeContext = createContext('app');

hotkeys.filter = event => {
let target = (event.target || event.srcElement) as HTMLElement;
let tagName = target.tagName;
const target = (event.target || event.srcElement) as HTMLElement;
const tagName = target.tagName;

// This is the default behavior of hotkeys, except we only suppress
// key presses if the meta key is not pressed
Expand Down Expand Up @@ -34,7 +34,7 @@ function KeyHandler({
eventType = 'keydown',
handler,
}: KeyHandlerProps) {
let scope = useContext(KeyScopeContext);
const scope = useContext(KeyScopeContext);

if (eventType !== 'keyup' && eventType !== 'keydown') {
throw new Error('KeyHandler: unknown event type: ' + eventType);
Expand Down Expand Up @@ -70,7 +70,7 @@ type KeyHandlersProps = {
keys: Record<string, HotKeyHandler>;
};
export function KeyHandlers({ eventType, keys = {} }: KeyHandlersProps) {
let handlers = Object.keys(keys).map(key => {
const handlers = Object.keys(keys).map(key => {
return (
<KeyHandler
key={key}
Expand Down
8 changes: 4 additions & 4 deletions packages/desktop-client/src/components/LoggedInUser.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,10 @@ export default function LoggedInUser({
style,
color,
}: LoggedInUserProps) {
let userData = useSelector(state => state.user.data);
let { getUserData, signOut, closeBudget } = useActions();
let [loading, setLoading] = useState(true);
let [menuOpen, setMenuOpen] = useState(false);
const userData = useSelector(state => state.user.data);
const { getUserData, signOut, closeBudget } = useActions();
const [loading, setLoading] = useState(true);
const [menuOpen, setMenuOpen] = useState(false);
const serverUrl = useServerURL();

useEffect(() => {
Expand Down
Loading

0 comments on commit 1972b07

Please sign in to comment.