Today I Learned

In PHP, unlike JavaScript, we don't have native support for Promises or asynchronous programming. This limitation can become apparent when dealing with multiple HTTP requests that need to be made simultaneously. However, the Http::pool method, as shown in the code snippet, offers a workaround by allowing us to leverage parallel processing.

The code uses the HTTP pools functionality provided by the Laravel HTTP client, which is a convenient way to execute multiple HTTP requests concurrently. Here's an expanded explanation of the code:

//dummy code

$responses = Http::pool(fn (Pool $pool) => [
    $pool->get("https://jsonplaceholder.typicode.com/todos/1"),
    $pool->get("https://jsonplaceholder.typicode.com/users/1"),
    $pool->get("https://jsonplaceholder.typicode.com/posts/1")
]);

$todoInfo = $responses[0]->json();
$userInfo = $responses[1]->json();
$postInfo = $responses[2]->json();

This code snippet demonstrates how to make three (or more) simultaneous HTTP calls to different endpoints using HTTP pools in PHP. In a specific situation on the project I'm working on, this approach significantly reduced the load time from 3 seconds to 1.1 seconds.

As I was using Netlify CMS, I wanted to use a relation widget that would dynamically add content depending on the other collection title field.

It's really easy to do this, but I struggled a little bit with it because the documentation wasn't so explicit, and I could not find something useful on the internet.

So here's how you do it:

This is the collection that will have dynamic content, depending on how many call-to-actions you'll create.

  - name: 'call-to-action'
    label: 'Call to action'
    path: "{{slug}}"
    create: true
    folder: 'content/call-to-action'
    fields:
      - {label: 'CTA Category', name: 'ctaCategory', widget: 'string'}
      - label: 'CTA Content'
        name: 'cta'
        widget: 'list'
        fields:
        - {label: 'Title', name: 'title', widget: 'string' }
        - {label: 'Content', name: 'content', widget: 'string' }
        - {label: 'cover', name: 'cover', widget: 'image', media_folder: '/assets/images/covers/'}
        - label: 'Button'
          name: 'button'
          widget: 'object'
          fields:
          - {label: 'url', name: 'url', widget: 'string'}
          - {label: 'title', name: 'title', widget: 'string'}

And now we have to link this collection to a field in the blog collection. The field in the blog collection looks like this :

- { label: 'Call to action category',
 name: 'ctaCategory',
 widget: 'relation', 
 collection: 'call-to-action', 
 search_fields: ["ctaCategory"], 
 value_field: "cta.*", 
 display_fields: ["ctaCategory"]}

The search will be done depending on what "ctaCategory" you select, and to get all the items in the list widget from the "call-to-action" collection, we need to specify in the value field that we want to get every item, and you do this with ".*".

That's all .

As we know, "v-model" does not work on an input that has a type of "file". So to validate a file is a little bit tricky.

For this validation, we will use vee-validate -> https://vee-validate.logaretm.com/v4/

To do this, you need to add a method that triggers the "on change" event on your input and to add on the "ValidationProvider" a ref.

import { ValidationProvider } from 'vee-validate/dist/vee-validate.full.esm'

<ValidationProvider ref="provider" rules="required">
 <input
 ref="file"
 type="file"
 @change="onFileAdd"
 />
</ValidationProvider>

Also you need to go and create the "onFileAdd" method , which will contain the following code:

export default {
 data() {
  return {
    fileData: '',
  }
 }

 methods: {
  async onFileAdd(e){
   const { valid } = await this.$refs.provider.validate(e)
   if (valid) {
    const file = this.$refs.file.files[0]
    this.fileData = file
   }
  }
 }
}

The "fileData" in the data object is the file that will be sent when the form is submitted.

Commit your changes. That's all.

I didn't understand why git did not recognize the renamed files, also deployment build was failing due to these changes.

My initial file name was "Advanced-Menu", I changed the file name, to "advanced-menu" and committed the changes.

The actual problem is that the macOS file system is case insensitive, therefore if you rename a file on macOS, changing only the case, git will not see the changes.

In order to fix it you have to set your git repository to be case insensitive by issuing:

git config core.ignorecase false

and rename the file using git mv:

git mv Advanced-Menu advanced-menu

Commit your changes. That's all.

You could also set this change globally to prevent future issues:

git config --global  core.ignorecase false