inmmerce for VTEX

Name: inmmerce for VTEX
Author: commente.me

Publisher: commente.meThemes in package: 1

Tema, snippets e IntelliSense para quem constrói na VTEX

Open in VS Code GitHub

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

inmmerce for VTEX — Puelche

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project $

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#00000000
activityBar.activeBorder#C25E86
activityBar.background#131117
activityBar.border#00000000
activityBar.foreground#F8F8F2
activityBar.inactiveForeground#9A9A94
activityBarBadge.background#C25E86
activityBarBadge.foreground#131117
activityBarTop.activeBackground#00000000
activityBarTop.activeBorder#C25E86
activityBarTop.background#131117
activityBarTop.foreground#F8F8F2
activityBarTop.inactiveForeground#9A9A94
badge.background#221F29
badge.foreground#F8F8F2
breadcrumb.activeSelectionForeground#F8F8F2
breadcrumb.background#1A181F
breadcrumb.focusForeground#F8F8F2
breadcrumb.foreground#9A9A94
breadcrumbPicker.background#221F29
button.background#C25E86
button.foreground#131117
button.hoverBackground#C25E86CC
button.secondaryBackground#221F29
button.secondaryForeground#F8F8F2
button.secondaryHoverBackground#2E2A3C
chat.avatarBackground#221F29
chat.avatarForeground#F8F8F2
chat.editedFileForeground#F1FA8C
chat.slashCommandBackground#221F29
chat.slashCommandForeground#8BE9FD
debugIcon.breakpointCurrentStackframeForeground#F1FA8C
debugIcon.breakpointDisabledForeground#6272A4
debugIcon.breakpointForeground#FF5555
debugIcon.breakpointStackframeForeground#69FF94
debugIcon.continueForeground#69FF94
debugIcon.disconnectForeground#FF5555
debugIcon.pauseForeground#8BE9FD
debugIcon.restartForeground#69FF94
debugIcon.startForeground#69FF94
debugIcon.stepBackForeground#8BE9FD
debugIcon.stepIntoForeground#8BE9FD
debugIcon.stepOutForeground#8BE9FD
debugIcon.stepOverForeground#8BE9FD
debugIcon.stopForeground#FF5555
debugToolBar.background#221F29
debugToolBar.border#2A2633
descriptionForeground#8F9ABB
diffEditor.border#221F29
diffEditor.insertedLineBackground#69FF941A
diffEditor.insertedTextBackground#69FF941A
diffEditor.removedLineBackground#FF55551A
diffEditor.removedTextBackground#FF55551A
disabledForeground#6272A4
dropdown.background#221F29
dropdown.border#2A2633
dropdown.foreground#F8F8F2
dropdown.listBackground#221F29
editor.background#1A181F
editor.findMatchBackground#3B3549
editor.findMatchHighlightBackground#2E2A3C99
editor.findRangeHighlightBackground#2E2A3C66
editor.foreground#F8F8F2
editor.hoverHighlightBackground#2E2A3C99
editor.inactiveSelectionBackground#2E2A3C99
editor.lineHighlightBackground#282332
editor.lineHighlightBorder#00000000
editor.rangeHighlightBackground#2E2A3C66
editor.selectionBackground#2E2A3C
editor.selectionHighlightBackground#2E2A3C99
editor.wordHighlightBackground#2E2A3C
editor.wordHighlightStrongBackground#2E2A3CCC
editorBracketHighlight.foreground1#9A9A94
editorBracketHighlight.foreground2#8BE9FD
editorBracketHighlight.foreground3#FF79C6
editorBracketHighlight.foreground4#50FA7B
editorBracketHighlight.foreground5#F1FA8C
editorBracketHighlight.foreground6#FFB86C
editorBracketHighlight.unexpectedBracket.foreground#FF5555
editorBracketMatch.background#2E2A3C
editorBracketMatch.border#00000000
editorCodeLens.foreground#9A9A94
editorCursor.background#1A181F
editorCursor.foreground#C25E86
editorError.foreground#FF5555
editorGhostText.foreground#6272A4
editorGroup.border#221F29
editorGroupHeader.noTabsBackground#131117
editorGroupHeader.tabsBackground#131117
editorGroupHeader.tabsBorder#221F29
editorGutter.addedBackground#69FF94
editorGutter.background#1A181F
editorGutter.deletedBackground#FF5555
editorGutter.modifiedBackground#8BE9FD
editorHint.foreground#50FA7B
editorHoverWidget.background#221F29
editorHoverWidget.border#2A2633
editorHoverWidget.foreground#F8F8F2
editorIndentGuide.activeBackground#3B3549
editorIndentGuide.activeBackground1#3B3549
editorIndentGuide.background#26222F
editorIndentGuide.background1#26222F
editorInfo.foreground#8BE9FD
editorInlayHint.foreground#9A9A94
editorInlayHint.parameterForeground#D2D2CC
editorInlayHint.typeForeground#8BE9FD
editorLightBulb.foreground#F1FA8C
editorLightBulbAi.foreground#FF79C6
editorLightBulbAutoFix.foreground#8BE9FD
editorLineNumber.activeForeground#8F9ABB
editorLineNumber.foreground#6272A4
editorLink.activeForeground#8BE9FD
editorOverviewRuler.addedForeground#69FF94
editorOverviewRuler.border#00000000
editorOverviewRuler.deletedForeground#FF5555
editorOverviewRuler.errorForeground#FF5555
editorOverviewRuler.infoForeground#8BE9FD
editorOverviewRuler.modifiedForeground#8BE9FD
editorOverviewRuler.warningForeground#F1FA8C
editorRuler.foreground#26222F
editorStickyScroll.background#1A181F
editorStickyScrollHover.background#221F29
editorSuggestWidget.background#221F29
editorSuggestWidget.border#2A2633
editorSuggestWidget.foreground#F8F8F2
editorSuggestWidget.highlightForeground#DA84B4
editorSuggestWidget.selectedBackground#2E2A3C
editorSuggestWidget.selectedForeground#F8F8F2
editorWarning.foreground#F1FA8C
editorWhitespace.foreground#26222F
editorWidget.background#221F29
editorWidget.border#2A2633
editorWidget.foreground#F8F8F2
errorForeground#FF5555
focusBorder#3B3549
foreground#F8F8F2
gitDecoration.addedResourceForeground#69FF94
gitDecoration.conflictingResourceForeground#F1FA8C
gitDecoration.deletedResourceForeground#FF5555
gitDecoration.ignoredResourceForeground#6272A4
gitDecoration.modifiedResourceForeground#8BE9FD
gitDecoration.stageDeletedResourceForeground#FF5555
gitDecoration.stageModifiedResourceForeground#8BE9FD
gitDecoration.submoduleResourceForeground#8F9ABB
gitDecoration.untrackedResourceForeground#50FA7B
icon.foreground#9A9A94
input.background#221F29
input.border#2A2633
input.foreground#F8F8F2
input.placeholderForeground#9A9A94
inputOption.activeBackground#2E2A3C
inputOption.activeBorder#3B3549
inputOption.activeForeground#F8F8F2
inputValidation.errorBackground#221F29
inputValidation.errorBorder#FF5555
inputValidation.infoBackground#221F29
inputValidation.infoBorder#8BE9FD
inputValidation.warningBackground#221F29
inputValidation.warningBorder#F1FA8C
keybindingLabel.background#221F29
keybindingLabel.border#2A2633
keybindingLabel.bottomBorder#2A2633
keybindingLabel.foreground#F8F8F2
list.activeSelectionBackground#2E2A3C
list.activeSelectionForeground#F8F8F2
list.dropBackground#2E2A3C66
list.errorForeground#FF5555
list.focusBackground#2E2A3C
list.focusForeground#F8F8F2
list.highlightForeground#DA84B4
list.hoverBackground#221F29
list.hoverForeground#F8F8F2
list.inactiveSelectionBackground#2E2A3C99
list.inactiveSelectionForeground#F8F8F2
list.warningForeground#F1FA8C
listFilterWidget.background#221F29
listFilterWidget.outline#3B3549
menu.background#221F29
menu.border#2A2633
menu.foreground#F8F8F2
menu.selectionBackground#2E2A3C
menu.selectionForeground#F8F8F2
menu.separatorBackground#2A2633
menubar.selectionBackground#2E2A3C
menubar.selectionForeground#F8F8F2
merge.commonHeaderBackground#2E2A3C
merge.currentHeaderBackground#69FF9433
merge.incomingHeaderBackground#8BE9FD33
minimap.errorHighlight#FF5555
minimap.findMatchHighlight#3B3549
minimap.warningHighlight#F1FA8C
minimapSlider.activeBackground#2E2A3CCC
minimapSlider.background#2E2A3C66
minimapSlider.hoverBackground#2E2A3C99
notificationCenterHeader.background#221F29
notificationCenterHeader.foreground#8F9ABB
notificationLink.foreground#8BE9FD
notifications.background#221F29
notifications.border#2A2633
notifications.foreground#F8F8F2
notificationsErrorIcon.foreground#FF5555
notificationsInfoIcon.foreground#8BE9FD
notificationsWarningIcon.foreground#F1FA8C
panel.background#131117
panel.border#221F29
panelSectionHeader.background#131117
panelTitle.activeBorder#C25E86
panelTitle.activeForeground#F8F8F2
panelTitle.inactiveForeground#9A9A94
peekView.border#C25E86
peekViewEditor.background#221F29
peekViewEditor.matchHighlightBackground#2E2A3C
peekViewResult.background#131117
peekViewResult.fileForeground#F8F8F2
peekViewResult.lineForeground#F8F8F2
peekViewResult.matchHighlightBackground#2E2A3C
peekViewResult.selectionBackground#2E2A3C
peekViewResult.selectionForeground#F8F8F2
peekViewTitle.background#221F29
peekViewTitleDescription.foreground#8F9ABB
peekViewTitleLabel.foreground#F8F8F2
pickerGroup.border#2A2633
pickerGroup.foreground#8F9ABB
problemsErrorIcon.foreground#FF5555
problemsInfoIcon.foreground#8BE9FD
problemsWarningIcon.foreground#F1FA8C
progressBar.background#C25E86
quickInput.background#221F29
quickInput.foreground#F8F8F2
quickInputList.focusBackground#2E2A3C
quickInputList.focusForeground#F8F8F2
quickInputTitle.background#221F29
sash.hoverBorder#3B3549
scrollbar.shadow#00000000
scrollbarSlider.activeBackground#2E2A3C
scrollbarSlider.background#2E2A3C99
scrollbarSlider.hoverBackground#2E2A3CCC
selection.background#2E2A3C
settings.headerForeground#F8F8F2
settings.modifiedItemIndicator#8BE9FD
sideBar.background#131117
sideBar.border#221F29
sideBar.foreground#F8F8F2
sideBarSectionHeader.background#131117
sideBarSectionHeader.border#221F29
sideBarSectionHeader.foreground#F8F8F2
sideBarTitle.foreground#8F9ABB
statusBar.background#131117
statusBar.border#221F29
statusBar.debuggingBackground#131117
statusBar.debuggingForeground#F1FA8C
statusBar.foreground#9A9A94
statusBar.noFolderBackground#131117
statusBar.noFolderForeground#9A9A94
statusBarItem.activeBackground#2E2A3C
statusBarItem.errorBackground#131117
statusBarItem.errorForeground#FF5555
statusBarItem.hoverBackground#221F29
statusBarItem.prominentBackground#221F29
statusBarItem.prominentForeground#F8F8F2
statusBarItem.remoteBackground#221F29
statusBarItem.remoteForeground#F8F8F2
statusBarItem.warningBackground#131117
statusBarItem.warningForeground#F1FA8C
symbolIcon.arrayForeground#9A9A94
symbolIcon.booleanForeground#BD93F9
symbolIcon.classForeground#8BE9FD
symbolIcon.colorForeground#9A9A94
symbolIcon.constantForeground#BD93F9
symbolIcon.constructorForeground#50FA7B
symbolIcon.enumeratorForeground#8BE9FD
symbolIcon.enumeratorMemberForeground#BD93F9
symbolIcon.eventForeground#50FA7B
symbolIcon.fieldForeground#8BE9FD
symbolIcon.fileForeground#9A9A94
symbolIcon.folderForeground#9A9A94
symbolIcon.functionForeground#50FA7B
symbolIcon.interfaceForeground#8BE9FD
symbolIcon.keyForeground#9A9A94
symbolIcon.keywordForeground#FF79C6
symbolIcon.methodForeground#50FA7B
symbolIcon.moduleForeground#FF79C6
symbolIcon.namespaceForeground#FF79C6
symbolIcon.nullForeground#9A9A94
symbolIcon.numberForeground#BD93F9
symbolIcon.objectForeground#9A9A94
symbolIcon.operatorForeground#9A9A94
symbolIcon.packageForeground#FF79C6
symbolIcon.propertyForeground#8BE9FD
symbolIcon.referenceForeground#FF79C6
symbolIcon.snippetForeground#50FA7B
symbolIcon.stringForeground#F1FA8C
symbolIcon.structForeground#8BE9FD
symbolIcon.textForeground#F1FA8C
symbolIcon.typeParameterForeground#8BE9FD
symbolIcon.unitForeground#9A9A94
symbolIcon.variableForeground#8BE9FD
tab.activeBackground#1A181F
tab.activeBorder#00000000
tab.activeBorderTop#C25E86
tab.activeForeground#F8F8F2
tab.border#221F29
tab.hoverBackground#221F29
tab.inactiveBackground#131117
tab.inactiveForeground#9A9A94
tab.lastPinnedBorder#2A2633
tab.unfocusedActiveBackground#1A181F
tab.unfocusedActiveForeground#9A9A94
tab.unfocusedHoverBackground#221F29
tab.unfocusedInactiveForeground#6272A4
terminal.ansiBlack#21222C
terminal.ansiBlue#BD93F9
terminal.ansiBrightBlack#6272A4
terminal.ansiBrightBlue#D6ACFF
terminal.ansiBrightCyan#A4FFFF
terminal.ansiBrightGreen#69FF94
terminal.ansiBrightMagenta#FF92DF
terminal.ansiBrightRed#FF6E6E
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#FFFFA5
terminal.ansiCyan#8BE9FD
terminal.ansiGreen#50FA7B
terminal.ansiMagenta#FF79C6
terminal.ansiRed#FF5555
terminal.ansiWhite#F8F8F2
terminal.ansiYellow#F1FA8C
terminal.background#131117
terminal.border#221F29
terminal.foreground#F8F8F2
terminal.selectionBackground#2E2A3C
terminalCommandDecoration.defaultBackground#9A9A94
terminalCommandDecoration.errorBackground#FF5555
terminalCommandDecoration.successBackground#69FF94
terminalCursor.background#131117
terminalCursor.foreground#C25E86
testing.iconPassed#69FF94
testing.iconQueued#F1FA8C
testing.iconSkipped#6272A4
testing.iconUnset#6272A4
textBlockQuote.background#221F29
textBlockQuote.border#2A2633
textCodeBlock.background#221F29
textLink.activeForeground#50FA7B
textLink.foreground#8BE9FD
textPreformat.foreground#F1FA8C
textSeparator.foreground#2A2633
titleBar.activeBackground#131117
titleBar.activeForeground#F8F8F2
titleBar.border#00000000
titleBar.inactiveBackground#131117
titleBar.inactiveForeground#9A9A94
toolbar.hoverBackground#2E2A3C
tree.indentGuidesStroke#26222F
welcomePage.progress.foreground#50FA7B
welcomePage.tileBackground#221F29
welcomePage.tileBorder#2A2633
widget.border#2A2633
widget.shadow#13111766

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
keyword, keyword.control, keyword.other, storage, storage.type, storage.modifier, keyword.control.at-rule, keyword.graphql, keyword.type.graphql, keyword.other.prisma, storage.type.prisma, keyword.other.special-method.dockerfile, keyword.other.dockerfile, meta.diff.header	#FF79C6	—
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.import.from, keyword.control.import.python, keyword.other.import	#FF79C6	italic
entity.name.function, support.function, meta.function-call entity.name.function, variable.function, entity.name.method, variable.graphql, entity.name.function.graphql, variable.other.assignment.prisma, variable.other.prisma, support.function.prisma, support.function.builtin.python, support.function.magic.python, support.type.python, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, entity.name.command.shell, support.function.shell, entity.name.function.shell, meta.function-call.shell	#50FA7B	—
entity.other.attribute-name, entity.other.attribute-name.html, meta.jsx.attribute entity.other.attribute-name, meta.tag entity.other.attribute-name	#50FA7B	italic
entity.name.type, entity.name.class, entity.name.namespace, entity.other.inherited-class, support.type, support.class, entity.name.type.interface, entity.name.type.alias, meta.object-literal.key, variable.other.property, support.variable.property, support.type.graphql, entity.name.type.graphql, entity.name.type.prisma, entity.name.type.model.prisma, support.type.primitive.prisma, support.type.property-name.css, variable.css, support.type.custom-property.name.css, support.type.property-name.json, support.type.property-name.toml, entity.name.tag.yaml, variable.other.env, keyword.other.definition.ini, variable.other.normal.shell, variable.other.special.shell, variable.other.positional.shell, punctuation.definition.variable.shell	#8BE9FD	—
entity.name.type.parameter, meta.type.parameters entity.name.type, variable.parameter.type	#8BE9FD	italic
string, string.quoted, string.template, string.unquoted, punctuation.definition.string, markup.underline.link, markup.inline.raw.markdown, markup.fenced_code.block.markdown, meta.property-value.css string, source.env string, string.quoted.single.env, string.quoted.double.env	#F1FA8C	—
constant.numeric, constant.language, constant.language.boolean, constant.language.null, constant.other, support.constant, variable.other.constant, variable.other.enummember, keyword.other.unit, string.regexp, constant.character.escape, keyword.operator.quantifier.regexp, constant.other.placeholder, meta.fstring.python constant, meta.embedded.line.python constant.other.placeholder	#BD93F9	—
entity.name.tag, support.class.component, entity.name.function.decorator, entity.name.function.decorator.python, punctuation.definition.decorator.python, meta.decorator punctuation.decorator, entity.name.tag.css, entity.name.function.prisma, keyword.other.attribute.prisma, storage.type.attribute.prisma, entity.name.function.directive.graphql, entity.name.type.anchor.yaml, variable.other.alias.yaml, punctuation.definition.anchor.yaml, entity.name.section.toml	#FFB86C	—
markup.heading.1.markdown, markup.heading.2.markdown, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown, markup.heading.3.markdown, markup.heading.4.markdown, markup.heading.5.markdown, markup.heading.6.markdown	#FFB86C	bold
variable, variable.other.readwrite, meta.definition.variable.name, text.html.markdown, meta.paragraph.markdown, support.constant.property-value.css, string.unquoted.plain.out.yaml, string.unquoted.plain.in.yaml, source.gitignore, string.other.ignore, meta.ignore	#F8F8F2	—
variable.parameter, meta.function.parameters variable, variable.parameter.graphql, meta.arguments.graphql variable, entity.name.variable.parameter	#D2D2CC	italic
punctuation, meta.brace, punctuation.separator, punctuation.terminator, punctuation.accessor, keyword.operator, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.logical, keyword.operator.comparison, keyword.operator.relational, keyword.operator.ternary, punctuation.definition.tag, punctuation.definition.heading.markdown, punctuation.definition.list.begin.markdown, punctuation.definition.bold.markdown, punctuation.definition.italic.markdown, punctuation.definition.quote.begin.markdown, punctuation.definition.metadata.markdown, fenced_code.block.language.markdown, punctuation.definition.markdown, keyword.operator.optional.prisma, keyword.operator.list.prisma, constant.character.wildcard.ignore, keyword.operator.negation.ignore, punctuation.separator.ignore	#9A9A94	—
comment, comment.line, comment.block, comment.block.documentation, punctuation.definition.comment, markup.quote.markdown	#8F9ABB	italic
storage.type.class.jsdoc, entity.name.type.instance.jsdoc, comment.block.documentation storage.type, comment.block.documentation keyword, keyword.other.documentation, keyword.codetag.notation, comment keyword.codetag	#8F9ABB	italic bold
markup.bold, markup.bold.markdown	#FFFFFF	bold
markup.italic, markup.italic.markdown	#F8F8F2	italic
string.other.link.title.markdown, string.other.link.description.markdown	#8BE9FD	—
invalid, invalid.illegal	#FF5555	—
invalid.deprecated	#F1FA8C	strikethrough
markup.inserted, markup.inserted.diff	#69FF94	—
markup.deleted, markup.deleted.diff	#FF5555	—
support.class.component, support.class.component.tsx, support.class.component.jsx, support.class.component.js, entity.name.tag.namespace.tsx, entity.name.tag.namespace.jsx	#8BE9FD	—
punctuation.section.embedded.begin.tsx, punctuation.section.embedded.end.tsx, punctuation.section.embedded.begin.jsx, punctuation.section.embedded.end.jsx, punctuation.section.embedded.begin.js, punctuation.section.embedded.end.js, meta.embedded.expression.tsx punctuation.section.embedded, meta.jsx.children.tsx punctuation.section.embedded	#FF79C6	—
punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx, punctuation.definition.tag.begin.jsx, punctuation.definition.tag.end.jsx, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html	#9A9A94	—
variable.graphql, variable.other.graphql, meta.variables.graphql variable, variable.parameter.graphql	#D2D2CC	italic
variable.language.this, variable.language.super, variable.language.this.js, variable.language.this.ts, variable.language.this.tsx, variable.language.special.self.python, variable.language.special.cls.python, variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python	#BD93F9	italic
storage.modifier.async, storage.modifier.async.ts, storage.modifier.async.tsx, storage.modifier.async.js, keyword.control.flow.await, keyword.other.await, keyword.control.flow.js, keyword.control.flow.ts, keyword.control.flow.tsx	#FF79C6	italic
keyword.control.anchor.regexp, punctuation.definition.group.regexp, punctuation.definition.character-class.regexp, constant.other.character-class.regexp, constant.other.character-class.set.regexp, keyword.operator.or.regexp, keyword.operator.negation.regexp	#FFB86C	—
variable.other.readwrite.alias, variable.other.readwrite.alias.ts, variable.other.readwrite.alias.tsx, variable.other.readwrite.alias.js, meta.import variable.other.readwrite, meta.export variable.other.readwrite, meta.import support.type, variable.other.alias	#A4FFFF	italic
meta.definition.variable.name, meta.var.expr entity.name.function, meta.definition.function variable.other	#D6ACFF	—