Merge cff6592c4e into 1316eb70ec

README.md

@@ -10,7 +10,7 @@ pairing with smart people at Hashrocket.
 
 For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186).
 
-_1609 TILs and counting..._
+_1613 TILs and counting..._
 
 See some of the other learning resources I work on:
 - [Ruby Operator Lookup](https://www.visualmode.dev/ruby-operators)
@@ -191,6 +191,7 @@ If you've learned something here, support my efforts writing daily TILs by
 - [Lighten And Darken With SCSS](css/lighten-and-darken-with-scss.md)
 - [Make A Block Of Text Respect New Lines](css/make-a-block-of-text-respect-new-lines.md)
 - [Parameterized SCSS Mixins](css/parameterized-scss-mixins.md)
+- [Prevent Invisible Elements From Being Clicked](css/prevent-invisible-elements-from-being-clicked.md)
 - [:root Has Higher Specificity Than html](css/root-has-higher-specificity-than-html.md)
 - [Style A Background With A Linear Gradient](css/style-a-background-with-a-linear-gradient.md)
 - [Using Maps In SCSS](css/using-maps-in-scss.md)
@@ -500,6 +501,7 @@ If you've learned something here, support my efforts writing daily TILs by
 - [Figure Out Your Public IP Address](internet/figure-out-your-public-ip-address.md)
 - [Focus The URL Bar](internet/focus-the-url-bar.md)
 - [Get Random Images From Unsplash](internet/get-random-images-from-unsplash.md)
+- [Grab The RSS Feed For A Substack Blog](internet/grab-the-rss-feed-for-a-substack-blog.md)
 - [Search Tweets By Author](internet/search-tweets-by-author.md)
 - [Show All Pivotal Stories With Blockers](internet/show-all-pivotal-stories-with-blockers.md)
 - [Verify Site Ownership With DNS Record](internet/verify-site-ownership-with-dns-record.md)
@@ -691,6 +693,7 @@ If you've learned something here, support my efforts writing daily TILs by
 ### Mise
 
 - [List The Files Being Loaded By Mise](mise/list-the-files-being-loaded-by-mise.md)
+- [Preserve Color Output For Task Command](mise/preserve-color-output-for-task-command.md)
 - [Read Existing Dot Env File Into Env Vars](mise/read-existing-dot-env-file-into-env-vars.md)
 
 ### MongoDB
@@ -1020,6 +1023,7 @@ If you've learned something here, support my efforts writing daily TILs by
 - [Ensure A Rake Task Cannot Write Data](rails/ensure-a-rake-task-cannot-write-data.md)
 - [Ensure Migrations Use The Latest Schema](rails/ensure-migrations-use-the-latest-schema.md)
 - [Ensure Record Saved With after_commit Callback](rails/ensure-record-saved-with-after-commit-callback.md)
+- [Filter ActiveStorage Blobs To Only Images](rails/filter-active-storage-blobs-to-only-images.md)
 - [Find Or Create A Record With FactoryBot](rails/find-or-create-a-record-with-factory-bot.md)
 - [Find Records With Multiple Associated Records](rails/find-records-with-multiple-associated-records.md)
 - [Force All Users To Sign Out](rails/force-all-users-to-sign-out.md)

css/prevent-invisible-elements-from-being-clicked.md

@@ -0,0 +1,29 @@
+# Prevent Invisible Elements From Being Clicked
+
+I have a nav element that when clicked reveals a custom drop-down menu. It
+reveals it using CSS transitions and transformations (`opacity` and `scale`).
+When the nav element is clicked again, the reverse of these transformations is
+applied to "hide" the menu. This gives a nice visual effect.
+
+It only makes the menu invisible and doesn't actually make it go away. That
+means that menu could be invisible, but hovering over the top of a button on
+the screen. The button cannot be clicked now because the menu is intercepting
+that [_pointer
+event_](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events).
+
+The fix is to apply CSS (or a class) when the drop-down menu is closed that
+tells it to ignore _pointer events_.
+
+```css
+.pointer-events-none {
+  pointer-events: none;
+}
+```
+
+This is more of less what [the `pointer-events-none` TailwindCSS
+utility](https://tailwindcss.com/docs/pointer-events) looks like.
+
+This class is applied by default to the drop-down menu. Then when the nav item
+is clicked, some JavaScript removes that class at the same moment that the menu
+is visually appearing. When a menu item is selected or the menu otherwise
+closed, it transitions away and the `pointer-events-none` class is reapplied.

internet/grab-the-rss-feed-for-a-substack-blog.md

@@ -0,0 +1,27 @@
+# Grab The RSS Feed For A Substack Blog
+
+I've been attempting to put more energy into finding and reading blog posts via
+an RSS feed reader. This as opposed to scrolling and scrolling and hoping that
+the algorithm turns up an interesting article or two.
+
+A lot of people who have been blogging for a while have a handy RSS feed link
+prominently displayed on their site. We love to see it!
+
+There are a few people whose writing I really enjoy that distribute their words
+via Substack. I couldn't find a prominent or not prominent RSS feed link
+anywhere on someone's Substack. What I did learn, after some searching, is that
+you can tack `/feed` onto the end of someone's Substack URL and that will give
+you the XML feed.
+
+For example:
+
+```
+Substack blog landing page URL:
+https://registerspill.thorstenball.com
+
+Substack blog RSS feed URL:
+https://registerspill.thorstenball.com/feed
+```
+
+Grab that feed URL and paste it into your feed reader and you should start
+seeing their stuff show up.

mise/preserve-color-output-for-task-command.md

@@ -0,0 +1,45 @@
+# Preserve Color Output For Task Command
+
+I decided to wrap a couple test running commands for a project into a single
+`test:all` mise task. It looked something like this:
+
+```toml
+[tasks."test:all"]
+run = """
+bundle exec rspec
+yarn test run
+"""
+description = "Run all tests (RSpec and Vitest)"
+depends = ["bundle-install", "node-install"]
+```
+
+I can run this with `mise run test:all` and it works. However, there is a
+glaring issue that immediately juts out. All of the test runner output is
+uncolored text. I'm used to and strongly prefer greens (passes), reds (fails),
+and yellows (skips) of test runner output.
+
+The test runners lose the text coloring when run through `mise` because they
+believe they are not running in _interactive_ mode.
+
+The [`expect`](https://linux.die.net/man/1/expect) tools (`brew install
+expect`) install with another binary called
+[`unbuffer`](https://linux.die.net/man/1/unbuffer). `unbuffer` can coerce a
+command to run in interactive mode. Prepending these test runner commands with
+`unbuffer` will preserve the colors as the results are output to the terminal.
+
+Here is the update `test:all` task:
+
+```toml
+[tasks."test:all"]
+run = """
+unbuffer bundle exec rspec
+unbuffer yarn test run
+"""
+description = "Run all tests (RSpec and Vitest)"
+depends = ["bundle-install", "node-install"]
+```
+
+For some commands, it seems able to stream out (rather than _buffer_) the
+results (e.g. with `vitest`). Whereas with `rspec`, the test suite runs to
+completion and is then output to the terminal. I'm still investigating
+streaming the `rspec` results.

rails/filter-active-storage-blobs-to-only-images.md

@@ -0,0 +1,30 @@
+# Filter ActiveStorage Blobs To Only Images
+
+If your Rails app is using `ActiveStorage` for both images and ActionMailbox
+emails, then you're going to have a mix of both in the `active_storage_blobs`
+table.
+
+```sql
+> select id, filename, content_type from active_storage_blobs limit 2;
+
+| id | filename           | content_type   |
+|----|--------------------|----------------|
+|  1 | shirt-brothers.jpg | image/jpeg     |
+|  2 | message.eml        | message/rfc822 |
+```
+
+In that case, you are going to want to make sure that any part of your system
+that only cares to deal with images filters down to only blobs where the
+`content_type` is one that you care about.
+
+I expect that there might be a couple different image `content_type` values
+that my system handles, so I filter my `active_storage_blobs` like so:
+
+
+```ruby
+@images =
+  ActiveStorage::Blob
+    .where(content_type: %w[image/jpeg image/png image/gif image/webp])
+    .order(created_at: :desc)
+    .first(10)
+```

ruby/find-the-min-and-max-with-a-single-call.md

@@ -21,5 +21,7 @@ at the same time when you call
 
 ```ruby
 list = [3,7,4,15,9,1,2]
+
+list.minmax
 #=> [1,15]
 ```