I noticed that:
- The web and electron versions of our `uuid` module both looked exactly
the same…
- …and deferred to the `uuid` package…
- …and the async version just called the sync API.
So now we will just use the `uuid` package directly everywhere.
This significantly speeds up `yarn lint` for me. It also ensures we’re
listing all source files in the project, including the `.eslintrc` files
and any other files that may be present.
- New linter rules are now added
- Perhaps the `createPayee` method i've tagged with a disable should be
deleted.
- I have ignored unused methods in Plaid/Mobile as this stuff is still
WIP/experimental?
- Enforce that imports from the same package are merged into a single
import
- In `loot-core`, require that imports of other `loot-core` files use a
relative import (like the vast majority of such imports) rather than
specifiers starting with `loot-core/` (probably a result of moving files
out of other packages into `loot-core`)
Multi-line `if`/`for` statements in JS can be confusing since there
aren’t braces to indicate which code is enclosed in the statement. I set
the configuration to `multi-line` to enforce usage of braces for
multi-line statement bodies, but still allow things like `if (foo)
return;`. I additionally added the `consistent` option to require braces
for all elements of an if/else chain if one element has it. As you can
see, this set of options pretty closely matches the existing code style.
I was going to comment in #1008 about this stylistic change but realized
that it’s (IMO) a little impolite to ask for code style changes unless
they can be automatically enforced.
Note that `if (foo) { \n return; \n }` is still valid and won’t be
collapsed. I tried to automatically collapse all such cases but it was a
lot of files and I didn’t want to pick out the useful from the useless
differences.
I got some feedback in the discord that this behavior was disruptive
when zooming in.
- I’ve reduced the breakpoint so hopefully the disruption of the
transition is matched by a significant improvement in available space
now.
- Also the 2 places in the app that use window width (including here)
now check for the width of the `<html>` tag, not the width of the
viewport (those 2 values can be different when doing a pinch-zoom,
causing undesirable layout shifts.)
- Most of the logic has been rewritten to improve the transitions
Mobile & desktop experience
https://user-images.githubusercontent.com/25517624/233653721-b13c5e22-ae11-4bdf-a494-a6916556d05e.movhttps://user-images.githubusercontent.com/25517624/233654784-b6cc1006-44ea-4066-be7a-8d0dd786fb5b.mov
(I’d like tapping on something to close the sidebar on mobile, but that
can be approached in a future PR)
Part 1 of the conversion. Mostly renaming js to ts and making sure
things make still sense. Added also handy TS ESLint rules.
In order to support the various .web/.electron/... I ended up adopting
`index.d.ts` as pattern to share type definition. Let me know if that
makes sense for you too. Right now the function type definition is
duplicated, but the solution will be importing from `index.d.ts` and
using `const fn: FnDef = () => ...` that way we can keep all variants in
sync from a single type file.
Such rewrite however is better done in another PR otherwise we risk
confusing git and loosing history (rename + too many changes). Another
thing that might do in the next PR is convert all files to ESModules, as
things get confusing between CJS exports, ESM default/named and TS adds
extra complains.