Home

Welcome to the schmuck-miser wiki!

News recorded in Eastern Time. Weekend/Evening project.

2012-12-23 01:30

Typescripting for localization 🌐 i18next Chunking plugin 🔌 ! Wow, that was quite an effort 🙇 . My custom loader is done - and a bit more robust. Reviewing various plugins used for i18next ts, I learned 👨‍🎓 a bit of what I had skipped out on and was able to add some custom options to it. Once typescripting is completed, The ChunkedBackend is going to become a plugin for i18next in its own separate npm package 📦 . Why not share 💕 ... the main reason for it is that I couldn't dynamically load localization files 📂 as needed when running off the local file system 🗄️ 🖥️ using a different library 📚 , so I just wrote my own backend to do dynamic imports ⏪ . Scales well without doing heavy lifting 🏋️ as more files are added over time.

2012-12-22 23:15

At this point I've switched over to VS Code 100% on the project. I'm having hiccups learning how some accelerator keys have been remapped for various actions (duplicate existing line, move lines up/down, etc.)

I've been having a nightmare trying to work with @mui Box component and aligning text to the right for Farsi in SelectLanguage component. Typescript and SxProps has trouble if I specify textAlign or direction. Typescript also complains if I try to bypass sx and use style to setup the css styling. I know what works without typescript - I'm just scratching my head trying to understand what it wants via SxProps<Theme> to accomplish the same thing. For now I've commented out the alignment and will come back to it later...

I'm currently in the middle of trying to create a shared interface between OtpSettings/Setup and Theme/Theme. Both components expect parameters with nullable children, and both can return null or an element - so why not hit two worms 🐛 🐛 with one bird 🐦 ... (3... 2... 💥 ouch 🖕 ) so the next problem is

TS2306: File '/Users/lewismoten/dev/schmuck-miser/src/types/IHasChildren.ts' is not a module.

It looks 👀 like a module...

export interface IHasChildren {
  children: JSX.Element;
}

I'm importing 🚚 📦 it like a module ...

import { IHasChildren } from '../../types/IHasChildren';

const Theme = ({ children }: IHasChildren): NullableElement => {

🙄 apparently the new file wasn't saved 💾 .

The fun continues...

2021-12-21 22:18

The repository structure now follows GitFlow. The project has been converted to Typescript on the feature/typescript branch. There are plenty of compile errors at the moment, but it's more reasonable to handle now, before the codebase becomes large. I need to configure my IDE to also perform linting on .ts and .tsx files and call out TypeScript compiler issues. Now that I have interfaces instead of PropTypes, I'm trying find the rite plugin/configuration to generate the PropTypes for runtime checks in the develop mode. Last, the babel configuration file has been split out into separate files for production and development with a common base configuration file.

interface Props {
  children: JSX.Element;
}

const Setup = ({ children }: Props): JSX.Element | null => {
  const isSettingUp = useSelector(selectors.isSettingUp);
  return isSettingUp ? children : null;
};

2021-12-18 01:56

I've been out of coffee beans for about a week... anyhow, I worked on layering an icon component over top of the QR image to see if branding was possible without going through much trouble with the library that generates QR codes. It worked. I changed the timer for OTP tokens to avoid the squeezing once down to single digits. Site name and user are now pulled from the redux state. Front-end UI generates the QR code when secret changes during setup, now allowing redux dev tools to show the correct QR codes when jumping back in history, rather than lost forever. Translations have been added. Debating on wrapping up 2FA and moving onto the next big thing...

2021-12-15 01:38

Moved interval logic for timer out of the UI and into the saga. Forked into a channel to emit current seconds/milliseconds of each minute. Listen for actions to close the channel when timer is no longer needed. 3.33 runs at roughly 200 times per minute. Now we can watch the playback of the timer with redux dev tools!

yield all([ // magical
    takeEvery(channel, onInterval),
    takeEvery(closeActions, closeChannel),
  ]);

2021-12-14 03:17

Update 2FA to display better between landscape and portrait mode, as well as large displays hiding QR code. OTP Secret can be copied to the clipboard with a click of a button. Integration is now supported for password managers (such as 1Password) to fill out one-time passwords.

2021-12-13 03:36

Continued working on 2FA. Setup QR code to render in theme colors applied to side. OTP has its own global state. Animated timer shows seconds remaining and a circular progress bar wrapped around it.

2021-12-12 01:12

Added ability to setup Two-Factor Authentication (2FA) tonight. I generated a Quick Response (QR) Code to scan into Google Authenticator. Since the secret within the QR code is part of the redux global state, it's not really a secret. I'm considering encrypting the data that's downloaded, but may only be able to encode it unless I can make use of certificates.

I may have to set it up sometime down the road to use external services to store and process cryptographic functionality. My intentions are to allow the app to run on its own without an internet connection and import/export the data in a secure way.