matheusps

---
name: Fastcheckout Cart to FastStore
overview: Convert the fastcheckout cart screen into a full FastStore page, replacing the existing component architecture with FastStore's section-based architecture and UI components, while keeping the fastcheckout BFF as the data source via a simple fetch-based GraphQL client.
todos:
  - id: data-layer
    content: "Phase 1: Create BFF GraphQL client, TypeScript types, queries/mutations, and CartPageContext"
    status: pending
  - id: page-scaffold
    content: "Phase 2: Create pages/cart.tsx and CartPage main component with layout"
    status: pending

matheusps

---
name: FastCheckout to FastStore Migration
overview: Migrate the entire FastCheckout application (NestJS BFF + Next.js/Relay client + UI libraries) into a set of FastStore pages, sections, API extensions, and custom components, preserving all checkout features (cart, delivery, payment, review, order placed, sign-in, payment loading).
todos:
  - id: bff-typedefs
    content: Create all GraphQL type definitions (.graphql files) in src/graphql/vtex/typeDefs/ for each checkout domain (cart, auth, payment, shipping, order, summary, coupon, customer, delivery, pickup, simulation, account-settings, store-preferences, custom-fields, dynamic-fields, one-click-checkout, budget, permissions)
    status: pending
  - id: bff-clients
    content: "Create VTEX API client modules for services not covered by FastStore's native clients: VtexIdentityClient, VtexPaymentsClient, VtexWalletHubClient, VtexMasterDataClient, VtexBudgetClient, GoogleMapsClient"
    status: pending

matheusps

noop

matheusps

{
  "data": [
    { "name": "PagarMeV2-1", "connector": "PagarMeV2", "connector-type": "Payment", "payment-group": "Credit Cards, Debit Cards", "mode": "Test" },
    { "name": "Cielo-1", "connector": "CieloV3", "connector-type": "Payment", "payment-group": "Credit Cards, Debit Cards", "mode": "Production" },
    { "name": "ClearSale-1", "connector": "ClearSaleAF", "connector-type": "Anti-fraud", "payment-group": "-", "mode": "Production" }
  ]
}

matheusps

{
   "products":[
      {
         "name":"Macbook Pro",
         "price":18000
      },
      {
         "name":"Iphone",
         "price":200
      },

matheusps

{
  "product": {
    "name": "Macbook Air"
  }
}

matheusps

// Integration APP - IO
import { useIframeState, Iframe } from '@vtex/raccoon-io'


const [size, setSize] = useState('250px')

const iframe = useIframeState({
  asyncHandlers: {
    resize: (data: any) => {
      setSize(data.size)

matheusps

.light {
  --blue: rgb(0, 122, 255);
  --green: rgb(52, 199, 89);
  --indigo: rgb(88, 86, 214);
  --orange: rgb(255, 149, 0);
  --pink: rgb(255, 45, 85);
  --purple: rgb(175, 82, 222);
  --red: rgb(255, 59, 48);
  --teal: rgb(90, 200, 250);
  --yellow: rgb(255, 204, 0);

matheusps

{
  // general
  "window.zoomLevel": 1,
  "workbench.startupEditor": "newUntitledFile",
  "editor.tabSize": 2,
  "editor.rulers": [80, 120],
  "editor.formatOnSave": false,
  "editor.parameterHints.enabled": false,
  "explorer.confirmDelete": false,
  "explorer.confirmDragAndDrop": false,

matheusps

#   -----------------------------
#   Generic paths
#   -----------------------------
export PATH=~/.npm-global/bin:$PATH

#   -----------------------------
#   Themes
#   -----------------------------
ZSH_THEME=""
autoload -U promptinit; promptinit