Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/preset block settings completion #732

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

aswamy
Copy link
Contributor

@aswamy aswamy commented Jan 23, 2025

What are you adding in this PR?

Fixes #623

  • Added support for presets blocks settings completion + hover
  • Should work for deep-nested blocks within presets

Testing

  • Checkout repo + branch + F5
  • In the test VScode window, open a theme with presets & blocks
  • Create a section/block that references a block
    • Add presets for the referenced block, and configure some of its settings (see tests / ticket description for more concrete examples)

example:

{% schema %}
{
  "name": "Example",
  "tag": null,
  "blocks": [{ "type": "@theme" }, { "type": "@app" }],
  "settings": [],
  "presets": [
    {
      "name": "Example Preset 1",
      "blocks": [
        {
          "type": "<referenced-block-name>",
          "settings": {
            "█"
          }
        }
      ]
    }
  ]
}
{% endschema %}

What's next? Any followup issues?

Pickup remaining tasks under #545

Before you deploy

  • I included a minor bump changeset
  • My feature is backward compatible

@aswamy aswamy requested a review from a team as a code owner January 23, 2025 23:12
@aswamy aswamy requested a review from charlespwd January 23, 2025 23:12
@aswamy aswamy force-pushed the feature/preset-block-settings-completion branch from 3d3ab01 to 1ca8046 Compare January 23, 2025 23:15
@aswamy aswamy force-pushed the feature/preset-block-settings-completion branch from 1ca8046 to e875edf Compare January 24, 2025 21:31
@aswamy aswamy force-pushed the feature/preset-block-settings-completion branch from e875edf to 820091c Compare January 24, 2025 22:01
Copy link
Contributor

@graygilmore graygilmore left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎩 👍🏻
image

@@ -169,7 +169,7 @@ export class DocumentManager {
if (!this.getModeForUri || !this.isValidSchema) return undefined;

const mode = await this.getModeForUri!(uri);
return toSchema(mode, uri, sourceCode, this.isValidSchema);
return toSchema(mode, uri, sourceCode, this.isValidSchema, false);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we need this?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great question! This is definitely going to be a controversial take here. Would love to get @charlespwd 's opinion on it before i merge.

  • Our default schema parser is very strict (does not like any syntax errors)
  • But if you are a dev who's typing their schema, you're going to have syntax errors while typing.
    • E.g. You haven't provided a value for the key you are about to type
       "presets": [
         {
             "settings": {
                 "█"
             }
         }
       ]
    
    • You need auto-completion to type inside that quotes, but since your schema is invalid, all auto-completion gets disabled (BAD)
    • We need less strict JSON parsing (at least during completion, hovers, etc.) BUT not during theme checks

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah! That makes sense to me I think. Not sure what else we could do otherwise, tbh.

* The PresetsBlockSettingsPropertyCompletionProvider offers value completions of the
* `presets.[].(recursive blocks.[]).settings` keys inside section and theme block `{% schema %}` tags.
*
* @example
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Love including the description and example here. I will add this to the branch I'm working on!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Worth adding tests specifically for this function?

import { Translations } from '@shopify/theme-check-common';

export function schemaSettingsPropertyCompletionItems(
parsedSchema: any,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are we able to get rid of the anys in here?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Unfortunately, valid schemas returned from getSchema are any so not much i can do here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Theme block JSON preset block settings completion/hover support
2 participants