WH

Incompatibility with CLI Build

If you intend to build out an Oclif typescript CLI app that is to be consumed by Vitejs, you might experience an issue with integrating the two. The Oclif CLI builds properly, but when executing the CLI through vite, this errors comes up.

[ERR_UNKNOWN_FILE_EXTENSION] TypeError Plugin: ... [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" ...

Spacing Display Issues

By itself, the QCollapsible element placed in a QVBoxLayout or QHBoxLayout will not offer an out-of-the-box solution for a refined display of distributing containers or the containers contents predictably.

Typescript Import Aliases

To simplify the referencing of module import paths, one can configure the ts.config.json like so.

{
  "compilerOptions": {
    ...
    "paths": {
      "@src/*": [
        "src/*"
      ]
    },
    "rootDir": "src",
    "baseUrl": ".",
  },
  "include": [
    "src/**/*"
  ]
}

PyQt - Accordion Equivalent

When there are groups of related information that are to be made available for viewing, but is too visually cluttering when shown all at once, one can use the grouping behavior of an accordion or collapsible section to selectively show information.

One native Qt widget that can be used in PyQT is the QtToolBox. This widget offers a vertical list of collapsible containers where only one can be viewed at a time. It behaves similar to a tab view except the the tab and its associated content are bunched together.

Jump to Specific Elements in the Dom Viewer

Within the "Inspector" or "Elements" (depending on if you are using Firefox or Chrome) Html node viewer tab's input search field, you can use a xpath selector to select a group of elements with the following.

//element-type

This will search for all a tags.

//a

PyQtgraph Graph in Native Window

Dedicating a UI file to store the application layout will make for a more organized process when working with PyQt. The Python code will be cleaner if it focuses on creating the dynamic data that will be inserted into the ui file.

To demonstrate this, create a window.ui file.

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QMainWindow" name="MainWindow">
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralwidget">
     <layout class="QVBoxLayout" name="verticalLayout">
     </layout>
  </widget>
 </widget>
</ui>

Fzf Search JSON Data

JSON is a ubiquitous data format and searching for content in JSON will come up often enough to warrant a real-time search functionality. jq can be used to query json and fzf can be combined with this tool to fulfill our JSON search capabilities.

Start fzf with jq

echo '' | fzf --preview "jq {q} < us-data.json.json"