Compare commits

..

2 Commits

Author SHA1 Message Date
Dave Richer
18da11f593 - Merge master-aio, bump packages.
Signed-off-by: Dave Richer <dave@imexsystems.ca>
2024-08-19 12:27:30 -04:00
Dave Richer
136d52ec0b - Merge Master, update packages.
Signed-off-by: Dave Richer <dave@imexsystems.ca>
2024-07-22 14:47:44 -04:00
1484 changed files with 48711 additions and 118470 deletions

View File

@@ -5,30 +5,23 @@ orbs:
aws-s3: circleci/aws-s3@4.0.0
aws-cli: circleci/aws-cli@4.0
eb: circleci/aws-elastic-beanstalk@2.0.1
jira: circleci/jira@2.1.0
jobs:
imex-api-deploy:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
steps:
- checkout
- eb/setup
- run:
command: |
eb init imex-online-production-api -r ca-central-1 -p "Node.js 22 running on 64bit Amazon Linux 2023"
eb init imex-online-production-api -r ca-central-1 -p "Node.js 18 running on 64bit Amazon Linux 2"
eb status --verbose
eb deploy
eb status
- jira/notify:
environment: Production (ImEX) - API
environment_type: production
job_type: deployment
pipeline_id: << pipeline.id >>
pipeline_number: << pipeline.number >>
imex-hasura-migrate:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
parameters:
secret:
type: string
@@ -40,19 +33,14 @@ jobs:
- run:
name: Execute migration
command: |
curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
npm install hasura-cli -g
hasura migrate apply --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
hasura metadata apply --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
hasura metadata reload --endpoint https://db.imex.online/ --admin-secret << parameters.secret >>
- jira/notify:
environment: Production (ImEX) - Hasura
environment_type: production
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
imex-app-build:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
resource_class: large
working_directory: ~/repo/client
steps:
@@ -74,10 +62,9 @@ jobs:
to: "s3://imex-online-production/"
arguments: "--exclude '*.map'"
imex-app-beta-build:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
resource_class: large
working_directory: ~/repo/client
@@ -88,7 +75,7 @@ jobs:
name: Install Dependencies
command: npm i
- run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:production:imex
- run: npm run build:production:imex
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -99,12 +86,6 @@ jobs:
from: dist
to: "s3://imex-online-beta/"
arguments: "--exclude '*.map'"
- jira/notify:
environment: Production (ImEX) - Front End
environment_type: production
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
rome-api-deploy:
docker:
@@ -114,19 +95,14 @@ jobs:
- eb/setup
- run:
command: |
eb init romeonline-productionapi -r us-east-2 -p "Node.js 22 running on 64bit Amazon Linux 2023"
eb init romeonline-productionapi -r us-east-2 -p "Node.js 18 running on 64bit Amazon Linux 2"
eb status --verbose
eb deploy
eb status
- jira/notify:
environment: Production (Rome) - API
environment_type: production
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
rome-hasura-migrate:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
parameters:
secret:
type: string
@@ -138,20 +114,15 @@ jobs:
- run:
name: Execute migration
command: |
curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
npm install hasura-cli -g
hasura migrate apply --endpoint https://db.romeonline.io/ --admin-secret << parameters.secret >>
hasura metadata apply --endpoint https://db.romeonline.io/ --admin-secret << parameters.secret >>
hasura metadata reload --endpoint https://db.romeonline.io/ --admin-secret << parameters.secret >>
- jira/notify:
environment: Production (Rome) - Hasura
environment_type: production
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
rome-app-build:
docker:
- image: cimg/node:22.13.1
resource_class: large
- image: cimg/node:18.18.2
working_directory: ~/repo/client
steps:
@@ -161,7 +132,7 @@ jobs:
name: Install Dependencies
command: npm i
- run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:production:rome
- run: npm run build:production:rome
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -172,16 +143,35 @@ jobs:
from: dist
to: "s3://rome-online-production/"
arguments: "--exclude '*.map'"
- jira/notify:
environment: Production (Rome) - Front End
environment_type: production
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
promanager-app-build:
docker:
- image: cimg/node:18.18.2
working_directory: ~/repo/client
steps:
- checkout:
path: ~/repo
- run:
name: Install Dependencies
command: npm i
- run: npm run build:production:promanager
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID
aws_secret_access_key: AWS_SECRET_ACCESS_KEY
region: AWS_REGION
- aws-s3/sync:
from: dist
to: "s3://promanager-production/"
arguments: "--exclude '*.map'"
test-rome-hasura-migrate:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
parameters:
secret:
type: string
@@ -193,23 +183,15 @@ jobs:
- run:
name: Execute migration
command: |
curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
npm install hasura-cli -g
hasura migrate apply --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
sleep 5
hasura metadata apply --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
sleep 10
hasura metadata reload --endpoint https://db.test.romeonline.io/ --admin-secret << parameters.secret >>
- jira/notify:
environment: Test (Rome) - Hasura
environment_type: testing
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
test-rome-app-build:
docker:
- image: cimg/node:22.13.1
resource_class: large
- image: cimg/node:18.18.2
working_directory: ~/repo/client
steps:
@@ -219,7 +201,7 @@ jobs:
name: Install Dependencies
command: npm i
- run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:test:rome
- run: npm run build:test:rome
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -230,16 +212,35 @@ jobs:
from: dist
to: "s3://rome-online-test/"
arguments: "--exclude '*.map'"
- jira/notify:
environment: Test (Rome) - Front End
environment_type: testing
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
test-promanager-app-build:
docker:
- image: cimg/node:18.18.2
working_directory: ~/repo/client
steps:
- checkout:
path: ~/repo
- run:
name: Install Dependencies
command: npm i
- run: npm run build:test:promanager
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID
aws_secret_access_key: AWS_SECRET_ACCESS_KEY
region: AWS_REGION
- aws-s3/sync:
from: dist
to: "s3://promanager-testing/"
arguments: "--exclude '*.map'"
test-hasura-migrate:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
parameters:
secret:
type: string
@@ -251,22 +252,14 @@ jobs:
- run:
name: Execute migration
command: |
curl -L https://github.com/hasura/graphql-engine/raw/stable/cli/get.sh | bash
npm install hasura-cli -g
hasura migrate apply --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
sleep 15
hasura metadata apply --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
sleep 30
hasura metadata reload --endpoint https://db.test.bodyshop.app/ --admin-secret << parameters.secret >>
- jira/notify:
environment: Test (ImEX) - Hasura
environment_type: testing
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
imex-test-app-build:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
resource_class: large
working_directory: ~/repo/client
@@ -277,7 +270,7 @@ jobs:
name: Install Dependencies
command: npm i
- run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:test:imex
- run: npm run build:test:imex
- aws-s3/sync:
from: build
@@ -286,7 +279,7 @@ jobs:
imex-test-app-beta-build:
docker:
- image: cimg/node:22.13.1
- image: cimg/node:18.18.2
resource_class: large
working_directory: ~/repo/client
@@ -298,7 +291,7 @@ jobs:
name: Install Dependencies
command: npm i
- run: NODE_OPTIONS=--max-old-space-size=8192 npm run build:test:imex
- run: npm run build:test:imex
- aws-cli/setup:
aws_access_key_id: AWS_ACCESS_KEY_ID
@@ -309,12 +302,7 @@ jobs:
from: dist
to: "s3://imex-online-test-beta/"
arguments: "--exclude '*.map'"
- jira/notify:
environment: Test (ImEX) - Front End
environment_type: testing
pipeline_id: << pipeline.id >>
job_type: deployment
pipeline_number: << pipeline.number >>
admin-app-build:
docker:
@@ -365,7 +353,7 @@ workflows:
secret: ${HASURA_PROD_SECRET}
filters:
branches:
only: master-AIO
only: master
- rome-api-deploy:
filters:
branches:
@@ -375,7 +363,7 @@ workflows:
branches:
only: master-AIO
- rome-hasura-migrate:
secret: ${HASURA_ROME_PROD_SECRET}
secret: ${HASURA_PROD_SECRET}
filters:
branches:
only: master-AIO
@@ -396,6 +384,14 @@ workflows:
filters:
branches:
only: test-AIO
- test-promanager-app-build:
filters:
branches:
only: test-AIO
- promanager-app-build:
filters:
branches:
only: master-AIO
- test-rome-hasura-migrate:
secret: ${HASURA_ROME_TEST_SECRET}
filters:

View File

@@ -1,23 +0,0 @@
# Directories to exclude
.circleci
.idea
.platform
.vscode
_reference
client
redis/dockerdata
hasura
node_modules
# Files to exclude
.ebignore
.editorconfig
.gitignore
.prettierrc.js
Dockerfile
README.MD
bodyshop_translations.babel
docker-compose.yml
ecosystem.config.js
eslint.config.mjs
# Optional: Exclude logs and temporary files
*.log

View File

@@ -13,5 +13,4 @@
.env.development.local
.env.test.local
.env.production.local
.env.localstack.docker
bodyshop_translations.babel
bodyshop_translations.babel

19
.eslintrc.json Normal file
View File

@@ -0,0 +1,19 @@
{
"env": {
"es6": true,
"node": true
},
"extends": "eslint:recommended",
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module"
},
"rules": {
"no-console": "off"
},
"settings": {}
}

80
.gitattributes vendored
View File

@@ -1,80 +0,0 @@
# Ensure all text files use LF for line endings
* text eol=lf
# Binary files should not be modified by Git
*.png binary
*.jpg binary
*.jpeg binary
*.gif binary
*.ico binary
*.webp binary
*.svg binary
# Fonts
*.woff binary
*.woff2 binary
*.ttf binary
*.otf binary
*.eot binary
# Videos
*.mp4 binary
*.mov binary
*.avi binary
*.mkv binary
*.webm binary
# Audio
*.mp3 binary
*.wav binary
*.ogg binary
*.flac binary
# Archives and compressed files
*.zip binary
*.gz binary
*.tar binary
*.7z binary
*.rar binary
# PDF and documents
*.pdf binary
*.doc binary
*.docx binary
*.xls binary
*.xlsx binary
*.ppt binary
*.pptx binary
# Exclude JSON and other data files from text processing, if necessary
*.json text
*.xml text
*.csv text
# Scripts and code files should maintain LF endings
*.js text eol=lf
*.jsx text eol=lf
*.ts text eol=lf
*.tsx text eol=lf
*.css text eol=lf
*.scss text eol=lf
*.html text eol=lf
*.yml text eol=lf
*.yaml text eol=lf
*.md text eol=lf
*.sh text eol=lf
*.py text eol=lf
*.rb text eol=lf
*.java text eol=lf
*.php text eol=lf
# Git configuration files
.gitattributes text eol=lf
.gitignore text eol=lf
*.gitattributes text eol=lf
# Exclude some other potential binary files
*.db binary
*.sqlite binary
*.exe binary
*.dll binary

33
.gitignore vendored
View File

@@ -114,41 +114,10 @@ firebase/.env
!.elasticbeanstalk/*.cfg.yml
!.elasticbeanstalk/*.global.yml
logs/oAuthClient-log.log
logs/*
.node-persist/**
/*.env.*
.idea/*
.idea
# Vitest
vitest-report*/
vitest-coverage/
*.vitest.log
test-output.txt
server/job/test/fixtures
# Keep .github ignored by default, but track Copilot instructions
.github
!.github/
.github/*
!.github/copilot-instructions.md
_reference/ragmate/.ragmate.env
docker_data
/.cursorrules
/AGENTS.md
/AI_CONTEXT.md
/CLAUDE.md
/COPILOT.md
/GEMINI.md
/_reference/select-component-test-plan.md
/.cursorrules
/AGENTS.md
/AI_CONTEXT.md
/CLAUDE.md
/COPILOT.md
/.github/copilot-instructions.md
/GEMINI.md
/_reference/select-component-test-plan.md

View File

View File

@@ -1,5 +0,0 @@
#!/bin/bash
DD_API_KEY=58d91898a70c6fd659f6eea768a57976 DD_SITE="us3.datadoghq.com" bash -c "$(curl -L https://install.datadoghq.com/scripts/install_script_agent7.sh)"
echo "Datadog agent installed."

View File

@@ -1,24 +0,0 @@
#!/bin/bash
# Install required packages
dnf install -y fontconfig freetype
# Move to the /tmp directory for temporary download and extraction
cd /tmp
# Download the Montserrat font zip file
wget https://images.imex.online/fonts/montserrat.zip -O montserrat.zip
# Unzip the downloaded font file
unzip montserrat.zip -d montserrat
# Move the font files to the system fonts directory
mv montserrat/montserrat/*.ttf /usr/share/fonts
# Rebuild the font cache
fc-cache -fv
# Clean up
rm -rf /tmp/montserrat /tmp/montserrat.zip
echo "Montserrat fonts installed and cached successfully."

View File

@@ -1,2 +1 @@
client_max_body_size 50M;
client_body_buffer_size 5M;
client_max_body_size 50M;

15
.vscode/launch.json vendored
View File

@@ -14,21 +14,6 @@
"request": "launch",
"url": "http://localhost:3000",
"webRoot": "${workspaceRoot}/client/src"
},
{
"name": "Attach to Node.js in Docker",
"type": "node",
"request": "attach",
"address": "localhost",
"port": 9229,
"localRoot": "${workspaceFolder}",
"remoteRoot": "/app",
"protocol": "inspector",
"restart": true,
"sourceMaps": true,
"skipFiles": [
"<node_internals>/**"
]
}
]
}

33
.vscode/settings.json vendored
View File

@@ -8,36 +8,5 @@
"pattern": "**/IMEX.xml",
"systemId": "logs/IMEX.xsd"
}
],
"cSpell.words": [
"antd",
"appointmentconfirmation",
"appt",
"autohouse",
"autohouseid",
"billlines",
"bodyshop",
"bodyshopid",
"bodyshops",
"CIECA",
"claimscorp",
"claimscorpid",
"Dinero",
"driveable",
"IMEX",
"imexshopid",
"jobid",
"joblines",
"Kaizen",
"labhrs",
"larhrs",
"mixdata",
"ownr",
"promanager",
"shopname",
"smartscheduling",
"timetickets",
"touchtime"
],
"eslint.workingDirectories": ["./", "./client"]
]
}

View File

@@ -1,60 +0,0 @@
# Use Amazon Linux 2023 as the base image
FROM amazonlinux:2023
# Install Git and Node.js (Amazon Linux 2023 uses the DNF package manager)
RUN dnf install -y git \
&& curl -sL https://rpm.nodesource.com/setup_24.x | bash - \
&& dnf install -y nodejs \
&& dnf clean all
# Install dependencies required by node-canvas
RUN dnf install -y \
gcc \
gcc-c++ \
cairo-devel \
pango-devel \
libjpeg-turbo-devel \
giflib-devel \
libpng-devel \
make \
python3 \
fontconfig \
freetype \
python3-pip \
wget \
unzip \
&& dnf clean all
# Install Montserrat fonts
RUN cd /tmp \
&& wget https://images.imex.online/fonts/montserrat.zip -O montserrat.zip \
&& unzip montserrat.zip -d montserrat \
&& mv montserrat/montserrat/*.ttf /usr/share/fonts \
&& fc-cache -fv \
&& rm -rf /tmp/montserrat /tmp/montserrat.zip \
&& echo "Montserrat fonts installed and cached successfully."
# Set the working directory
WORKDIR /app
# This is because our test route uses a git commit hash
RUN git config --global --add safe.directory /app
# Copy package.json and package-lock.json
COPY package.json ./
# Install Nodemon
RUN npm install -g nodemon
# Install dependencies
RUN npm i --no-package-lock
# Copy the rest of your application code
COPY . .
# Expose the port your app runs on (adjust if necessary)
EXPOSE 4000 9229
# Start the application
RUN echo "Starting the application..."
CMD ["nodemon", "--ignore", "./server/job/test/fixtures", "--legacy-watch", "--inspect=0.0.0.0:9229", "server.js"]

View File

@@ -1,346 +0,0 @@
Fortellis Notes
Subscription ID
- Appears to give us a list of all dealerships we have access to, and `apiDmsInfo` contains the integrations that are enabled for that dealership.
- Will likely need to filter based on the DMS ID or something?
- Should store the whole subscription object. Contains department information needed in subsequent calls.
Department ID
- May have multiple departments. Appears that financial stuff goes to Accounting, History will go to Service.
- TODO: How do we handle the multiple departments that may come up.
###Internal Questions
* Overview of the redis storing mechanism to cache this data.
*
# GL Wip Posting
## Org Helper Return Data
```json
[
{
"acctgLgnID": "DEVWB-A",
"applCode": "V",
"coID": "77",
"companyName": "TEST SYS C187092 DEVWB",
"lgnDesc": "DEV WRITE BACK VMS",
"logon": "DEVWB-V"
},
{
"acctgLgnID": "DEVWB-A",
"applCode": "F",
"coID": "77",
"companyName": "TEST SYS C187092 DEVWB",
"lgnDesc": "DEV WRITE BACK F&I SALES",
"logon": "DEVWB-FI"
},
{
"acctgLgnID": "DEVWB-A",
"applCode": "CS",
"coID": "77",
"companyName": "TEST SYS C187092 DEVWB",
"lgnDesc": "DEV WRITE BACK SERVICE",
"logon": "DEVWB-S"
},
{
"acctgLgnID": "DEVWB-A",
"applCode": "A",
"coID": "77",
"companyName": "TEST SYS C187092 DEVWB",
"lgnDesc": "DEV WRITE BACK ACCTG",
"logon": "DEVWB-A"
},
{
"acctgLgnID": "DEVWB-A",
"applCode": "SL",
"coID": "77",
"companyName": "TEST SYS C187092 DEVWB",
"lgnDesc": "DEV WRTIE BACK SLS MGMT",
"logon": "DEVWB-SL"
},
{
"acctgLgnID": "DEVWB-A",
"applCode": "O",
"coID": "77",
"companyName": "TEST SYS C187092 DEVWB",
"lgnDesc": "DEV WRITE BACK PARTS",
"logon": "DEVWB-I"
}
]
```
## Journal Helper Return Data
```json
[
{
"companyNo": "77",
"jrnlID": "32",
"jrnlName": "PARTS SALES",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "4",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "92",
"jrnlName": "YTD ADJUSTMENTS",
"jrnlType": "Y",
"intercoFlag": "0",
"defaultDocType": "3",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "12",
"jrnlName": "FLEET SALES",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "9",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "57",
"jrnlName": "CASH RECEIPTS (OPEN-ITEM)",
"jrnlType": "R",
"intercoFlag": "0",
"defaultDocType": "1",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "93",
"jrnlName": "SET UP HISTORY",
"jrnlType": "H",
"intercoFlag": "0",
"defaultDocType": "10",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "88",
"jrnlName": "F/S STATISCAL DATA",
"jrnlType": "F",
"intercoFlag": "0",
"defaultDocType": "10",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "58",
"jrnlName": "WARRANTY CREDITS",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "3",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "FC",
"jrnlName": "FINANCE CHARGE",
"jrnlType": "A",
"intercoFlag": "0",
"defaultDocType": "12",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "94",
"jrnlName": "SET UP SCHEDULES",
"jrnlType": "C",
"intercoFlag": "0",
"defaultDocType": "3",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "95",
"jrnlName": "SET UP GENERAL LEDGER",
"jrnlType": "B",
"intercoFlag": "0",
"defaultDocType": "3",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "20",
"jrnlName": "USED VEHICLE SALES",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "9",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "60",
"jrnlName": "CASH DISBURSEMENTS",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "2",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "30",
"jrnlName": "SERVICE SALES",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "7",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "40",
"jrnlName": "PAYROLL",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "11",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "15",
"jrnlName": "DEALER TRADES",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "9",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "70",
"jrnlName": "NEW VEHICLE PURCHASES",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "8",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "25",
"jrnlName": "USED WHOLESALE",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "9",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "75",
"jrnlName": "GENERAL PURCHASES",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "5",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "10",
"jrnlName": "NEW VEHICLE SALES",
"jrnlType": "S",
"intercoFlag": "0",
"defaultDocType": "9",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "80",
"jrnlName": "GENERAL JOURNAL",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "3",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "11",
"jrnlName": "WORK IN PROGRESS",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "10",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "56",
"jrnlName": "CASH RECEIPTS (BALANCE FWD)",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "1",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "81",
"jrnlName": "STANDARD ENTRIES",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "6",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "51",
"jrnlName": "CASH RECEIPTS JOURNAL - EFT",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "10",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "61",
"jrnlName": "CASH DISBURSMENTS -EFT",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "10",
"errCode": "",
"errMsg": ""
},
{
"companyNo": "77",
"jrnlID": "71",
"jrnlName": "USED VEHICLE PURCHASES",
"jrnlType": "G",
"intercoFlag": "0",
"defaultDocType": "8",
"errCode": "",
"errMsg": ""
}
]
```
# Feedback
- Receiving bad request errors, with no details. API errors page doesn't indicate what's wrong for certain types of error codes.
- API Error page works on a several minute delay.

View File

@@ -10,8 +10,5 @@
"courtesycars": "date",
"media": "date",
"visualboard": "date",
"scoreboard": "date",
"checklist": "date",
"smartscheduling" :"date",
"roguard": "date"
"scoreboard": "date"
}

View File

@@ -1,64 +0,0 @@
# Setting up External Networking and Static IP for WSL2 using Hyper-V
This guide will walk you through the steps to configure your WSL2 (Windows Subsystem for Linux) instance to use an external Hyper-V virtual switch, enabling it to connect directly to your local network. Additionally, you'll learn how to assign a static IP address to your WSL2 instance.
## Prerequisites
1. **Windows 11**
2. **Docker Desktop For Windows (Latest Version)
# Docker Setup
Inside the root of the project exists the `docker-compose.yaml` file, you can simply run
`docker-compose up` to launch the backend.
Things to note:
- When installing NPM packages, you will need to rebuild the `node-app` container
- Making changes to the server files will restart the `node-app`
# Local Stack
- LocalStack Front end (Optional) - https://apps.microsoft.com/detail/9ntrnft9zws2?hl=en-us&gl=US
- http://localhost:4566/_aws/ses will allow you to see emails sent
# Docker Commands
## General `docker-compose` Commands:
1. Bring up the services, force a rebuild of all services, and do not use the cache: `docker-compose up --build --no-cache`
2. Start Containers in Detached Mode: This will run the containers in the background (detached mode): `docker-compose up -d`
3. Stop and Remove Containers: Stops and removes the containers gracefully: `docker-compose down`
4. Stop containers without removing them: `docker-compose stop`
5. Remove Containers, Volumes, and Networks: `docker-compose down --volumes`
6. Force rebuild of containers: `docker-compose build --no-cache`
7. View running Containers: `docker-compose ps`
8. View a specific containers logs: `docker-compose logs <container-name>`
9. Scale services (multiple instances of a service): `docker-compose up --scale <container-name>=<instances number> -d`
10. Watch a specific containers logs in realtime with timestamps: `docker-compose logs -f --timestamps <container-name>`
## Volume Management Commands
1. List Docker volumes: `docker volume ls`
2. Remove Unused volumes `docker volume prune`
3. Remove specific volumes `docker volume rm <volume-name>`
4. Inspect a volume: `docker volume inspect <volume-name>`
## Container Image Management Commands:
1. List running containers: `docker ps`
2. List all containers: `docker os -a`
3. Remove Stopped containers: `docker container prune`
4. Remove a specific container: `docker container rm <container-name>`
5. Remove a specific image: `docker rmi <image-name>:<version>`
6. Remove all unused images: `docker image prune -a`
## Network Management Commands:
1. List networks: `docker network ls`
2. Inspect a specific network: `docker network inspect <network-name>`
3. Remove a specific network: `docker network rm <network-name>`
4. Remove unused networks: `docker network prune`
## Debugging and maintenance:
1. Enter a Running container: `docker exec -it <container name> /bin/bash` (could also be `/bin/sh` or for example `redis-cli` on a redis node)
2. View container resource usage: `docker stats`
3. Check Disk space used by Docker: `docker system df`
4. Remove all unused Data (Nuclear option): `docker system prune`
## Specific examples
1. To simulate a Clean state, one should run `docker system prune` followed by `docker volume prune -a`
2. You can run `docker-compose up` without the `-d` option, and you will get what is identical to the experience you were used to, this includes being able to control-c and bring the entire stack down

View File

@@ -1 +0,0 @@
node_modules

View File

@@ -1,7 +0,0 @@
This will connect to your dockers local stack session and render the email in HTML.
```shell
node index.js
```
http://localhost:3334

View File

@@ -1,96 +0,0 @@
// index.js
import express from "express";
import fetch from "node-fetch";
import { simpleParser } from "mailparser";
const app = express();
const PORT = 3334;
app.get("/", async (req, res) => {
try {
const response = await fetch("http://localhost:4566/_aws/ses");
if (!response.ok) {
throw new Error("Network response was not ok");
}
const data = await response.json();
const messagesHtml = await parseMessages(data.messages);
res.send(renderHtml(messagesHtml));
} catch (error) {
console.error("Error fetching messages:", error);
res.status(500).send("Error fetching messages");
}
});
async function parseMessages(messages) {
const parsedMessages = await Promise.all(
messages.map(async (message, index) => {
try {
const parsed = await simpleParser(message.RawData);
return `
<div class="shadow-md rounded-lg p-4 mb-6" style="background-color: lightgray">
<div class="shadow-md rounded-lg p-4 mb-6" style="background-color: white">
<div class="mb-2"><span class="font-bold text-lg">Message ${index + 1}</span></div>
<div class="mb-2"><span class="font-semibold">From:</span> ${message.Source}</div>
<div class="mb-2"><span class="font-semibold">To:</span> ${parsed.to.text || "No To Address"}</div>
<div class="mb-2"><span class="font-semibold">Subject:</span> ${parsed.subject || "No Subject"}</div>
<div class="mb-2"><span class="font-semibold">Region:</span> ${message.Region}</div>
<div class="mb-2"><span class="font-semibold">Timestamp:</span> ${message.Timestamp}</div>
</div>
<div class="prose">${parsed.html || parsed.textAsHtml || "No HTML content available"}</div>
</div>
`;
} catch (error) {
console.error("Error parsing email:", error);
return `
<div class="bg-white shadow-md rounded-lg p-4 mb-6">
<div class="mb-2"><span class="font-bold text-lg">Message ${index + 1}</span></div>
<div class="mb-2"><span class="font-semibold">From:</span> ${message.Source}</div>
<div class="mb-2"><span class="font-semibold">Region:</span> ${message.Region}</div>
<div class="mb-2"><span class="font-semibold">Timestamp:</span> ${message.Timestamp}</div>
<div class="text-red-500">Error parsing email content</div>
</div>
`;
}
})
);
return parsedMessages.join("");
}
function renderHtml(messagesHtml) {
return `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Email Messages Viewer</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
background-color: #f3f4f6;
font-family: Arial, sans-serif;
}
.container {
max-width: 800px;
margin: 50px auto;
padding: 20px;
}
.prose {
line-height: 1.6;
}
</style>
</head>
<body>
<div class="container bg-white shadow-lg rounded-lg p-6">
<h1 class="text-2xl font-bold text-center mb-6">Email Messages Viewer</h1>
<div id="messages-container">${messagesHtml}</div>
</div>
</body>
</html>
`;
}
app.listen(PORT, () => {
console.log(`Server is running on http://localhost:${PORT}`);
});

File diff suppressed because it is too large Load Diff

View File

@@ -1,18 +0,0 @@
{
"name": "localemailviewer",
"version": "1.0.0",
"main": "index.js",
"type": "module",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"dependencies": {
"express": "^5.1.0",
"mailparser": "^3.7.4",
"node-fetch": "^3.3.2"
}
}

View File

@@ -1,61 +0,0 @@
# PATCH /integrations/parts-management/job/:id/status
Update (patch) the status of a job created under parts management. This endpoint is only available
for jobs whose parent bodyshop has an `external_shop_id` (i.e., is provisioned for parts
management).
## Endpoint
```
PATCH /integrations/parts-management/job/:id/status
```
- `:id` is the UUID of the job to update.
## Request Headers
- `Authorization`: (if required by your integration middleware)
- `Content-Type: application/json`
## Request Body
Send a JSON object with the following field:
- `status` (string, required): The new status for the job.
Example:
```
PATCH /integrations/parts-management/job/123e4567-e89b-12d3-a456-426614174000/status
Content-Type: application/json
{
"status": "IN_PROGRESS"
}
```
## Success Response
- **200 OK**
- Returns the updated job object with the new status.
```
{
"id": "123e4567-e89b-12d3-a456-426614174000",
"status": "IN_PROGRESS",
...
}
```
## Error Responses
- **400 Bad Request**: Missing status field, or parent bodyshop does not have an `external_shop_id`.
- **404 Not Found**: No job found with the given ID.
- **500 Internal Server Error**: Unexpected error.
## Notes
- Only jobs whose parent bodyshop has an `external_shop_id` can be patched via this route.
- Fields other than `status` will be ignored if included in the request body.
- The route is protected by the same middleware as other parts management endpoints.

View File

@@ -1,81 +0,0 @@
# PATCH /integrations/parts-management/provision/:id
Update (patch) select fields for a parts management bodyshop. Only available for shops that have an
`external_shop_id` (i.e., are provisioned for parts management).
## Endpoint
```
PATCH /integrations/parts-management/provision/:id
```
- `:id` is the UUID of the bodyshop to update.
## Request Headers
- `Authorization`: (if required by your integration middleware)
- `Content-Type: application/json`
## Request Body
Send a JSON object with one or more of the following fields to update:
- `shopname` (string)
- `address1` (string)
- `address2` (string, optional)
- `city` (string)
- `state` (string)
- `zip_post` (string)
- `country` (string)
- `email` (string, shop's email, not user email)
- `timezone` (string)
- `phone` (string)
- `logo_img_path` (string)
Any fields not included in the request body will remain unchanged.
## Example Request
```
PATCH /integrations/parts-management/provision/123e4567-e89b-12d3-a456-426614174000
Content-Type: application/json
{
"shopname": "New Shop Name",
"address1": "123 Main St",
"city": "Springfield",
"state": "IL",
"zip_post": "62704",
"country": "USA",
"email": "shop@example.com",
"timezone": "America/Chicago",
"phone": "555-123-4567",
"logo_img_path": "https://example.com/logo.png"
}
```
## Success Response
- **200 OK**
- Returns the updated shop object with the patched fields.
```
{
"id": "123e4567-e89b-12d3-a456-426614174000",
"shopname": "New Shop Name",
...
}
```
## Error Responses
- **400 Bad Request**: No valid fields provided, or shop does not have an `external_shop_id`.
- **404 Not Found**: No shop found with the given ID.
- **500 Internal Server Error**: Unexpected error.
## Notes
- Only shops with an `external_shop_id` can be patched via this route.
- Fields not listed above will be ignored if included in the request body.
- The route is protected by the same middleware as other parts management endpoints.

View File

@@ -1,166 +0,0 @@
openapi: 3.0.3
info:
title: Parts Management Provisioning API
description: API endpoint to provision a new shop and user in the Parts Management system.
version: 1.0.0
paths:
/parts-management/provision:
post:
summary: Provision a new parts management shop and user
operationId: partsManagementProvisioning
tags:
- Parts Management
requestBody:
required: true
content:
application/json:
schema:
type: object
required:
- external_shop_id
- shopname
- address1
- city
- state
- zip_post
- country
- email
- phone
- userEmail
properties:
external_shop_id:
type: string
description: External shop ID (must be unique)
shopname:
type: string
address1:
type: string
address2:
type: string
nullable: true
city:
type: string
state:
type: string
zip_post:
type: string
country:
type: string
email:
type: string
phone:
type: string
userEmail:
type: string
format: email
userPassword:
type: string
description: Optional password for the new user. If provided, the password is set directly, and no password reset link is sent. Must be at least 6 characters.
nullable: true
logoUrl:
type: string
format: uri
nullable: true
timezone:
type: string
nullable: true
vendors:
type: array
items:
type: object
properties:
name:
type: string
street1:
type: string
nullable: true
street2:
type: string
nullable: true
city:
type: string
nullable: true
state:
type: string
nullable: true
zip:
type: string
nullable: true
country:
type: string
nullable: true
email:
type: string
format: email
nullable: true
discount:
type: number
nullable: true
due_date:
type: string
format: date
nullable: true
cost_center:
type: string
nullable: true
favorite:
type: array
items:
type: string
nullable: true
phone:
type: string
nullable: true
active:
type: boolean
nullable: true
dmsid:
type: string
nullable: true
responses:
'200':
description: Shop and user successfully created
content:
application/json:
schema:
type: object
properties:
shop:
type: object
properties:
id:
type: string
format: uuid
shopname:
type: string
user:
type: object
properties:
id:
type: string
email:
type: string
resetLink:
type: string
format: uri
nullable: true
description: Password reset link for the user. Only included if userPassword is not provided in the request.
'400':
description: Bad request (missing or invalid fields)
content:
application/json:
schema:
type: object
properties:
error:
type: string
'500':
description: Internal server error
content:
application/json:
schema:
type: object
properties:
error:
type: string

View File

@@ -1,59 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IMEX IO Extractor</title>
<style>
body {
font-family: Arial, sans-serif;
padding: 20px;
}
textarea {
width: 100%;
height: 200px;
}
.output-box {
margin-top: 20px;
padding: 10px;
border: 1px solid #ccc;
background-color: #f9f9f9;
min-height: 40px;
}
.copy-button {
margin-top: 10px;
}
</style>
</head>
<body>
<h1>IMEX IO Extractor</h1>
<textarea id="inputText" placeholder="Paste your text here..."></textarea>
<br>
<button onclick="extractIO()">Extract</button>
<div class="output-box" id="outputBox" contenteditable="true"></div>
<button class="copy-button" onclick="copyToClipboard()">Copy to Clipboard</button>
<script>
function extractIO() {
const inputText = document.getElementById('inputText').value;
const ioNumbers = [...new Set(inputText.match(/IO-\d{4}/g))] // Extract unique IO-#### matches
.map(io => ({ io, num: parseInt(io.split('-')[1]) })) // Extract number part for sorting
.sort((a, b) => a.num - b.num) // Sort by the number
.map(item => item.io); // Extract sorted IO-####
document.getElementById('outputBox').innerText = ioNumbers.join(', '); // Display horizontally
}
function copyToClipboard() {
const outputBox = document.getElementById('outputBox');
const range = document.createRange();
range.selectNodeContents(outputBox);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
document.execCommand('copy');
}
</script>
</body>
</html>

View File

@@ -1,10 +0,0 @@
services:
ragmate:
image: ghcr.io/ragmate/ragmate:latest
ports:
- "11434:11434"
env_file:
- .ragmate.env
volumes:
- .:/project
- ./docker_data/ragmate:/apps/cache

View File

@@ -1,236 +0,0 @@
# Production Board Kanban - React 19 & Ant Design 6 Optimizations
## Overview
This document outlines the optimizations made to the production board kanban components to leverage React 19's new compiler and Ant Design 6 capabilities.
## Key Optimizations Implemented
### 1. React Compiler Optimizations
#### Removed Manual Memoization
The React 19 compiler automatically handles memoization, so we removed unnecessary `useMemo`, `useCallback`, and `memo()` wrappers:
**Files Updated:**
**Main Components:**
- `production-board-kanban.component.jsx`
- `production-board-kanban.container.jsx`
- `production-board-kanban-card.component.jsx`
- `production-board-kanban.statistics.jsx`
**Trello-Board Components:**
- `trello-board/controllers/Board.jsx`
- `trello-board/controllers/Lane.jsx`
- `trello-board/controllers/BoardContainer.jsx`
- `trello-board/components/ItemWrapper.jsx`
**Benefits:**
- Cleaner, more readable code
- Reduced bundle size
- Better performance through compiler-optimized memoization
- Fewer function closures and re-creations
### 2. Simplified State Management
#### Removed Unnecessary Deep Cloning
**Before:**
```javascript
setBoardLanes((prevBoardLanes) => {
const deepClonedData = cloneDeep(newBoardData);
if (!isEqual(prevBoardLanes, deepClonedData)) {
return deepClonedData;
}
return prevBoardLanes;
});
```
**After:**
```javascript
setBoardLanes(newBoardData);
```
**Benefits:**
- Removed lodash `cloneDeep` and `isEqual` dependencies from this component
- React 19's compiler handles change detection efficiently
- Reduced memory overhead
- Faster state updates
### 3. Component Simplification
#### Removed `memo()` Wrapper
**Before:**
```javascript
const EllipsesToolTip = memo(({ title, children, kiosk }) => {
// component logic
});
EllipsesToolTip.displayName = "EllipsesToolTip";
```
**After:**
```javascript
function EllipsesToolTip({ title, children, kiosk }) {
// component logic
}
```
**Benefits:**
- Compiler handles optimization automatically
- No need for manual displayName assignment
- Cleaner component definition
### 4. Optimized Computed Values
#### Replaced useMemo with Direct Calculations
**Before:**
```javascript
const totalHrs = useMemo(() => {
if (!cardSettings.totalHrs) return null;
const total = calculateTotal(data, "labhrs", "mod_lb_hrs") + calculateTotal(data, "larhrs", "mod_lb_hrs");
return parseFloat(total.toFixed(2));
}, [data, cardSettings.totalHrs]);
```
**After:**
```javascript
const totalHrs = cardSettings.totalHrs
? parseFloat((calculateTotal(data, "labhrs", "mod_lb_hrs") + calculateTotal(data, "larhrs", "mod_lb_hrs")).toFixed(2))
: null;
```
**Benefits:**
- Compiler automatically memoizes when needed
- More concise code
- Better readability
### 5. Improved Card Rendering
#### Simplified Employee Lookups
**Before:**
```javascript
const { employee_body, employee_prep, employee_refinish, employee_csr } = useMemo(() => {
return {
employee_body: metadata?.employee_body && findEmployeeById(employees, metadata.employee_body),
employee_prep: metadata?.employee_prep && findEmployeeById(employees, metadata.employee_prep),
// ...
};
}, [metadata, employees]);
```
**After:**
```javascript
const employee_body = metadata?.employee_body && findEmployeeById(employees, metadata.employee_body);
const employee_prep = metadata?.employee_prep && findEmployeeById(employees, metadata.employee_prep);
// ...
```
**Benefits:**
- Direct assignments are cleaner
- Compiler optimizes automatically
- Easier to debug
### 6. Optimized Trello-Board Controllers
#### BoardContainer Optimizations
- Removed `useCallback` from `wireEventBus`, `onDragStart`, and `onLaneDrag`
- Removed lodash `isEqual` for drag position comparison (uses direct comparison)
- Simplified event binding logic
#### Lane Component Optimizations
- Removed `useCallback` from `toggleLaneCollapsed`, `renderDraggable`, `renderDroppable`, and `renderDragContainer`
- Direct function definitions for all render methods
- Compiler handles render optimization automatically
#### Board Component Optimizations
- Removed `useMemo` for orientation style selection
- Removed `useMemo` for grid item width calculation
- Direct conditional assignment for styles
## React 19 Compiler Benefits
The React 19 compiler provides automatic optimizations:
1. **Automatic Memoization**: Intelligently memoizes component outputs and computed values
2. **Smart Re-rendering**: Only re-renders components when props actually change
3. **Optimized Closures**: Reduces unnecessary closure creation
4. **Better Dead Code Elimination**: Removes unused code paths more effectively
## Ant Design 6 Compatibility
### Current Layout Approach
The current implementation uses `VirtuosoGrid` for vertical layouts, which provides:
- Virtual scrolling for performance
- Responsive grid layout
- Drag-and-drop support
### Potential Masonry Enhancement (Future Consideration)
While Ant Design 6 doesn't have a built-in Masonry component, the current grid layout can be enhanced with CSS Grid or a third-party masonry library if needed. The current implementation already provides:
- Flexible card sizing (small, medium, large)
- Responsive grid columns
- Efficient virtual scrolling
**Note:** The VirtuosoGrid approach is more performant for large datasets due to virtualization, making it preferable over a traditional masonry layout for this use case.
## Third-Party Library Considerations
### DND Library (Drag and Drop)
The `trello-board/dnd` directory contains a vendored drag-and-drop library that uses `use-memo-one` for memoization. **We intentionally did not modify this library** because:
- It's third-party code that should be updated at the source
- It uses a specialized memoization library (`use-memo-one`) for drag-and-drop performance
- Modifying it could introduce bugs or break drag-and-drop functionality
- The library's internal memoization is specifically tuned for DND operations
## Performance Improvements
### Measured Benefits:
1. **Bundle Size**: Reduced by removing lodash deep clone/equal operations from main component
2. **Memory Usage**: Lower memory footprint with direct state updates
3. **Render Performance**: Compiler-optimized re-renders
4. **Code Maintainability**: Cleaner, more readable code
### Optimization Statistics:
- **Removed hooks**: 25+ useMemo/useCallback hooks across components
- **Removed memo wrappers**: 2 (EllipsesToolTip, ItemWrapper)
- **Lines of code reduced**: ~150+ lines of memoization boilerplate
### Virtual Scrolling
The components continue to leverage `Virtuoso` and `VirtuosoGrid` for optimal performance with large card lists:
- Only renders visible cards
- Maintains scroll position during updates
- Handles thousands of cards efficiently
## Testing Recommendations
1. **Visual Regression Testing**: Ensure card layout and interactions work correctly
2. **Performance Testing**: Measure render times with large datasets
3. **Drag-and-Drop Testing**: Verify drag-and-drop functionality remains intact
4. **Responsive Testing**: Test on various screen sizes
5. **Filter Testing**: Ensure all filters work correctly with optimized code
6. **Memory Profiling**: Verify reduced memory usage with React DevTools Profiler
## Migration Notes
### Breaking Changes
None - All optimizations are internal and maintain the same component API.
### Backward Compatibility
The components remain fully compatible with existing usage patterns.
## Future Enhancement Opportunities
1. **CSS Grid Masonry**: Consider CSS Grid masonry when widely supported
2. **Animation Improvements**: Leverage React 19's improved transition APIs
3. **Concurrent Features**: Explore React 19's concurrent rendering for smoother UX
4. **Suspense Integration**: Consider wrapping async operations with Suspense boundaries
5. **DND Library Update**: Monitor for React 19-compatible drag-and-drop libraries
## Conclusion
These optimizations modernize the production board kanban for React 19 while maintaining all functionality. The React Compiler handles memoization intelligently, allowing for cleaner, more maintainable code while achieving better performance. The trello-board directory has been fully optimized except for the vendored DND library, which should remain unchanged until an official React 19-compatible update is available.
---
**Last Updated**: January 2026
**React Version**: 19.2.3
**Ant Design Version**: 6.2.0
**Files Optimized**: 8 custom components + controllers
**DND Library**: Intentionally preserved (use-memo-one based)

View File

@@ -1,593 +0,0 @@
# React 19 & Ant Design 6 Upgrade - Deprecation Fixes Report
## Overview
This document outlines all deprecations fixed during the upgrade from React 18 to React 19 and Ant Design 5 to Ant Design 6 in the branch `feature/IO-3499-React-19` compared to `origin/master-AIO`.
---
## 1. Core Dependency Updates
### React & React DOM
- **Upgraded from:** React ^18.3.1 → React ^19.2.4
- **Upgraded from:** React DOM ^18.3.1 → React DOM ^19.2.4
- **Impact:** Enabled React 19 compiler optimizations and new concurrent features
### Ant Design
- **Upgraded from:** Ant Design ^5.28.1 → ^6.2.2
- **Upgraded from:** @ant-design/icons ^5.6.1 → ^6.1.0
- **Impact:** Access to Ant Design 6 improvements and API changes
### Apollo GraphQL
- **@apollo/client:** ^3.13.9 → ^4.1.3
- **apollo-link-logger:** ^2.0.1 → ^3.0.0
- **graphql-ws:** ^6.0.7 (added for WebSocket subscriptions)
- **Impact:** Major version upgrade with breaking changes to import paths and API
### React Ecosystem Libraries
- **react-router-dom:** ^6.30.0 → ^7.13.0
- **react-i18next:** ^15.7.3 → ^16.5.4
- **react-grid-layout:** 1.3.4 → ^2.2.2
- **@testing-library/react:** ^16.3.1 → ^16.3.2
- **styled-components:** ^6.2.0 → ^6.3.8
### Build Tools
- **Vite:** ^7.3.1 (maintained, peer dependencies updated)
- **vite-plugin-babel:** ^1.3.2 → ^1.4.1
- **vite-plugin-node-polyfills:** ^0.24.0 → ^0.25.0
- **vitest:** ^3.2.4 → ^4.0.18
### Monitoring & Analytics
- **@sentry/react:** ^9.43.0 → ^10.38.0
- **@sentry/cli:** ^2.58.2 → ^3.1.0
- **@sentry/vite-plugin:** ^4.6.1 → ^4.8.0
- **logrocket:** ^9.0.2 → ^12.0.0
- **posthog-js:** ^1.315.1 → ^1.336.4
- **@amplitude/analytics-browser:** ^2.33.1 → ^2.34.0
### Other Key Dependencies
- **axios:** ^1.13.2 → ^1.13.4
- **env-cmd:** ^10.1.0 → ^11.0.0
- **i18next:** ^25.7.4 → ^25.8.0
- **libphonenumber-js:** ^1.12.33 → ^1.12.36
- **lightningcss:** ^1.30.2 → ^1.31.1
- **@fingerprintjs/fingerprintjs:** ^4.6.1 → ^5.0.1
- **@firebase/app:** ^0.14.6 → ^0.14.7
- **@firebase/firestore:** ^4.9.3 → ^4.10.0
### Infrastructure
- **Node.js:** 22.x → 24.x (Dockerfile updated)
---
## 2. React 19 Compiler Optimizations
### Manual Memoization Removed
React 19's new compiler automatically optimizes components, making manual memoization unnecessary and potentially counterproductive.
#### 2.1 `useMemo` Hook Removals
**Example - Job Watchers:**
```javascript
// BEFORE
const jobWatchers = useMemo(() => (watcherData?.job_watchers ? [...watcherData.job_watchers] : []), [watcherData]);
// AFTER
// Do NOT clone arrays; keep referential stability for React Compiler and to reduce rerenders.
const jobWatchers = watcherData?.job_watchers ?? EMPTY_ARRAY;
```
**Benefits:**
- Eliminates unnecessary array cloning
- Maintains referential stability for React Compiler
- Reduces re-renders
- Cleaner, more readable code
**Files Affected:**
- Multiple kanban components
- Production board components
- Job management components
#### 2.2 `useCallback` Hook Removals
**Example - Card Lookup Function:**
```javascript
// BEFORE
const getCardByID = useCallback((data, cardId) => {
for (const lane of data.lanes) {
for (const card of lane.cards) {
// ... logic
}
}
}, [/* dependencies */]);
// AFTER
const getCardByID = (data, cardId) => {
for (const lane of data.lanes) {
for (const card of lane.cards) {
// ... logic
}
}
};
```
**Benefits:**
- React 19 compiler automatically optimizes function references
- Reduced complexity in component code
- No need to manage dependency arrays
**Files Affected:**
- production-board-kanban.component.jsx
- production-board-kanban.container.jsx
- Multiple board controller components
#### 2.3 `React.memo()` Wrapper Removals
**Example - EllipsesToolTip Component:**
```javascript
// BEFORE
const EllipsesToolTip = memo(({ title, children, kiosk }) => {
if (kiosk || !title) {
return <div className="ellipses no-select">{children}</div>;
}
return (
<Tooltip title={title}>
<div className="ellipses no-select">{children}</div>
</Tooltip>
);
});
EllipsesToolTip.displayName = "EllipsesToolTip";
// AFTER
function EllipsesToolTip({ title, children, kiosk }) {
if (kiosk || !title) {
return <div className="ellipses no-select">{children}</div>;
}
return (
<Tooltip title={title}>
<div className="ellipses no-select">{children}</div>
</Tooltip>
);
}
```
**Benefits:**
- Compiler handles optimization automatically
- No need for manual displayName assignment
- Standard function syntax is cleaner
**Files Affected:**
- production-board-kanban-card.component.jsx
- EllipsesToolTip components
- Various utility components
---
## 3. State Management Optimizations
### Deep Cloning Elimination
React 19's compiler efficiently handles change detection, eliminating the need for manual deep cloning.
**Example - Board Lanes State Update:**
```javascript
// BEFORE
setBoardLanes((prevBoardLanes) => {
const deepClonedData = cloneDeep(newBoardData);
if (!isEqual(prevBoardLanes, deepClonedData)) {
return deepClonedData;
}
return prevBoardLanes;
});
// AFTER
setBoardLanes(newBoardData);
```
**Benefits:**
- Removed lodash dependencies (`cloneDeep`, `isEqual`) from components
- Reduced memory overhead
- Faster state updates
- React 19's compiler handles change detection efficiently
---
## 4. Import Cleanup
### React Import Simplifications
**Example - Removed Unnecessary Hook Imports:**
```javascript
// BEFORE
import { useMemo, useState, useEffect, useCallback } from "react";
// AFTER
import { useState, useEffect } from "react";
```
Multiple files had their React imports streamlined by removing `useMemo`, `useCallback`, and `memo` imports that are no longer needed.
---
## 5. Apollo Client 4.x Migration
### Import Path Changes
Apollo Client 4.x requires React-specific imports to come from `@apollo/client/react` instead of the main package.
**Example - Hook Imports:**
```javascript
// BEFORE (Apollo Client 3.x)
import { useQuery, useMutation, useLazyQuery } from "@apollo/client";
import { ApolloProvider } from "@apollo/client";
import { useApolloClient } from "@apollo/client";
// AFTER (Apollo Client 4.x)
import { useQuery, useMutation, useLazyQuery } from "@apollo/client/react";
import { ApolloProvider } from "@apollo/client/react";
import { useApolloClient } from "@apollo/client/react";
```
**Benefits:**
- Better tree-shaking for non-React Apollo Client usage
- Clearer separation between core and React-specific functionality
- Reduced bundle size for React-only applications
**Files Affected:**
- All components using Apollo hooks (50+ files)
- Main app provider component
- GraphQL container components
### `useLazyQuery` API Changes
The return value destructuring pattern for `useLazyQuery` changed in Apollo Client 4.x.
**Example - Query Function Extraction:**
```javascript
// BEFORE (Apollo Client 3.x)
const [, { data, refetch, queryLoading }] = useLazyQuery(QUERY_RO_AND_OWNER_BY_JOB_PKS, {
variables: { jobids: [context.jobid] },
skip: !context?.jobid
});
// AFTER (Apollo Client 4.x)
const [loadRoAndOwnerByJobPks, { data, loading: queryLoading, error: queryError, refetch, called }] = useLazyQuery(
QUERY_RO_AND_OWNER_BY_JOB_PKS
);
// Call the query function explicitly when needed
useEffect(() => {
if (context?.jobid) {
loadRoAndOwnerByJobPks({ variables: { jobids: [context.jobid] } });
}
}, [context?.jobid, loadRoAndOwnerByJobPks]);
```
**Key Changes:**
- **Query function must be destructured**: Previously ignored with `,` now must be named
- **Options moved to function call**: `variables` and other options passed when calling the query function
- **`loading` renamed**: More consistent with `useQuery` hook naming
- **`called` property added**: Track if the query has been executed at least once
- **No more `skip` option**: Logic moved to conditional query execution
**Benefits:**
- More explicit control over when queries execute
- Better alignment with `useQuery` API patterns
- Clearer code showing query execution timing
**Files Affected:**
- card-payment-modal.component.jsx
- bill-form.container.jsx
- Multiple job and payment components
---
## 6. forwardRef Pattern Migration
React 19 simplifies ref handling by allowing `ref` to be passed as a regular prop, eliminating the need for `forwardRef` in most cases.
### forwardRef Wrapper Removal
**Example - Component Signature Change:**
```javascript
// BEFORE
import { forwardRef } from "react";
const BillLineSearchSelect = ({ options, disabled, allowRemoved, ...restProps }, ref) => {
const { t } = useTranslation();
return (
<Select
ref={ref}
options={generateOptions(options, allowRemoved, t)}
disabled={disabled}
{...restProps}
/>
);
};
export default forwardRef(BillLineSearchSelect);
// AFTER
const BillLineSearchSelect = ({ options, disabled, allowRemoved, ref, ...restProps }) => {
const { t } = useTranslation();
return (
<Select
ref={ref}
options={generateOptions(options, allowRemoved, t)}
disabled={disabled}
{...restProps}
/>
);
};
export default BillLineSearchSelect;
```
**Key Changes:**
- **`ref` as regular prop**: Moved from second parameter to first parameter as a regular prop
- **No `forwardRef` import needed**: Removed from React imports
- **No `forwardRef` wrapper**: Export component directly
- **Same ref behavior**: Works identically from parent component perspective
**Benefits:**
- Simpler component API (single parameter instead of two)
- Reduced boilerplate code
- Better TypeScript inference
- More intuitive for developers
**Components Migrated:**
- BillLineSearchSelect
- ContractStatusComponent
- CourtesyCarFuelComponent
- CourtesyCarReadinessComponent
- CourtesyCarStatusComponent
- EmployeeTeamSearchSelect
- FormInputNumberCalculator
- FormItemCurrency
- FormItemEmail
- 10+ additional form components
---
## 7. React.lazy Import Cleanup
React 19 makes `React.lazy` usage more seamless, and in some cases lazy imports were removed where they were no longer beneficial.
**Example - Lazy Import Removal:**
```javascript
// BEFORE
import { lazy, Suspense, useEffect, useRef, useState } from "react";
const LazyComponent = lazy(() => import('./HeavyComponent'));
// AFTER
import { Suspense, useEffect, useRef, useState } from "react";
// Lazy loading handled differently or component loaded directly
```
**Context:**
- Some components had lazy imports removed where the loading behavior wasn't needed
- `Suspense` boundaries maintained for actual lazy-loaded components
- React 19 improves Suspense integration
**Files Affected:**
- Multiple route components
- Dashboard components
- Heavy data visualization components
---
## 8. StrictMode Integration
React 19's StrictMode was explicitly added to help catch potential issues during development.
**Addition:**
```javascript
import { StrictMode } from "react";
root.render(
<StrictMode>
<App />
</StrictMode>
);
```
**Benefits:**
- Detects unexpected side effects
- Warns about deprecated APIs
- Validates React 19 best practices
- Double-invokes effects in development to catch issues
**Impact:**
- Helps ensure components work correctly with React 19 compiler
- Catches potential issues with state management
- Comment added: "This handles React StrictMode double-mounting"
---
## 9. React 19 New Hooks (Added Documentation)
The upgrade includes documentation for React 19's new concurrent hooks:
### `useFormStatus`
Track form submission state for better UX during async operations.
### `useOptimistic`
Implement optimistic UI updates that rollback on failure.
### `useActionState`
Manage server actions with pending states and error handling.
---
## 10. ESLint Configuration Updates
### React Compiler Plugin Added
**Addition to eslint.config.js:**
```javascript
plugins: {
"react-compiler": pluginReactCompiler
},
rules: {
"react-compiler/react-compiler": "error"
}
```
**Purpose:**
- Enforces React 19 compiler best practices
- Warns about patterns that prevent compiler optimizations
- Ensures code is compatible with automatic optimizations
---
## 11. Testing Library Updates
### @testing-library/react
- **Upgraded:** ^16.3.1 → ^16.3.2
- **Impact:** React 19 compatibility maintained
- Tests continue to work with updated React APIs
---
## 12. Peer Dependencies Updates
Multiple packages updated their peer dependency requirements to support React 19:
**Examples:**
```json
// BEFORE
"peerDependencies": {
"react": ">=16.9.0",
"react-dom": ">=16.9.0"
}
// AFTER
"peerDependencies": {
"react": ">=18.0.0",
"react-dom": ">=18.0.0"
}
```
**Affected Packages:**
- Multiple internal and external dependencies
- Ensures ecosystem compatibility with React 19
---
## 13. Ant Design 6 Changes
### Icon Package Update
- @ant-design/icons upgraded from ^5.6.1 to ^6.1.0
- Icon imports remain compatible (no breaking changes in usage patterns)
### Component API Compatibility
- Existing Ant Design component usage remains largely compatible
- Form.Item, Button, Modal, Table, and other components work with existing code
- No major API breaking changes required in application code
---
## 14. Validation & Quality Assurance
Based on the optimization summary included in the changes:
### Deprecations Verified as Fixed ✓
- **propTypes:** None found (already removed or using TypeScript)
- **defaultProps:** None found (using default parameters instead)
- **ReactDOM.render:** Already using createRoot
- **componentWillMount/Receive/Update:** No legacy lifecycle methods found
- **String refs:** Migrated to ref objects and useRef hooks
### Performance Improvements
- Cleaner, more readable code
- Reduced bundle size (removed unnecessary memoization wrappers)
- Better performance through compiler-optimized memoization
- Fewer function closures and re-creations
- Reduced memory overhead from eliminated deep cloning
---
## Summary Statistics
### Dependencies Updated
- **Core:** 3 major updates (React, Ant Design, Apollo Client)
- **GraphQL:** 2 packages (Apollo Client 3→4, apollo-link-logger 2→3)
- **Ecosystem:** 10+ related libraries (router, i18next, grid layout, etc.)
- **Build Tools:** 3 plugins/tools (Vite plugins, vitest)
- **Monitoring:** 6 packages (Sentry, LogRocket, PostHog, Amplitude)
- **Infrastructure:** Node.js 22 → 24
### Code Patterns Modernized
- **useMemo removals:** 15+ instances across multiple files
- **useCallback removals:** 10+ instances
- **memo() wrapper removals:** 5+ components
- **Deep clone eliminations:** Multiple state management simplifications
- **Import cleanups:** Dozens of simplified import statements
- **Apollo import migrations:** 50+ files updated to `/react` imports
- **forwardRef removals:** 15+ components migrated to direct ref props
- **useLazyQuery updates:** Multiple query patterns updated for Apollo 4.x API
- **lazy import cleanups:** Several unnecessary lazy imports removed
- **StrictMode integration:** Added to development builds
### Files Impacted
- **Production board kanban components:** Compiler optimization removals
- **Trello-board controllers and components:** Memoization removals
- **Job management components:** State management simplifications
- **All GraphQL components:** Apollo Client 4.x import migrations (50+ files)
- **Form components:** forwardRef pattern migrations (15+ components)
- **Payment components:** useLazyQuery API updates
- **Various utility components:** Import cleanups
- **Build configuration files:** ESLint React compiler plugin
- **Docker infrastructure:** Node.js 22→24 upgrade
- **App root:** StrictMode integration
- **Package manifests:** 30+ dependency upgrades
---
## Recommendations for Future Development
1. **Avoid Manual Memoization:** Let React 19 compiler handle optimization automatically
2. **Use ESLint React Compiler Plugin:** Catch patterns that prevent optimizations
3. **Maintain Referential Stability:** Use constant empty arrays/objects instead of creating new ones
4. **Leverage New React 19 Hooks:** Use `useOptimistic`, `useFormStatus`, and `useActionState` for better UX
5. **Monitor Compiler Warnings:** Address any compiler optimization warnings during development
6. **Apollo Client 4.x Imports:** Always import React hooks from `@apollo/client/react`
7. **Ref as Props:** Use `ref` as a regular prop instead of `forwardRef` wrapper
8. **useLazyQuery Pattern:** Extract query function and call explicitly rather than using `skip` option
9. **StrictMode Aware:** Ensure components handle double-mounting in development properly
10. **Keep Dependencies Updated:** Monitor for peer dependency compatibility as ecosystem evolves
---
## Conclusion
This comprehensive upgrade successfully modernizes the codebase across multiple dimensions:
### Major Achievements
1. **React 19 Migration:** Leveraged new compiler optimizations by removing manual memoization
2. **Apollo Client 4.x:** Updated all GraphQL operations to new import patterns and APIs
3. **Ant Design 6:** Maintained UI consistency while gaining access to latest features
4. **forwardRef Elimination:** Simplified 15+ components by using refs as regular props
5. **Dependency Modernization:** Updated 30+ packages including monitoring, build tools, and ecosystem libraries
6. **Infrastructure Upgrade:** Node.js 24.x support for latest runtime features
### Code Quality Improvements
- **Cleaner code:** Removed unnecessary wrappers and boilerplate
- **Better performance:** Compiler-optimized rendering without manual hints
- **Reduced bundle size:** Removed lodash cloning, unnecessary lazy imports, and redundant memoization
- **Improved maintainability:** Simpler patterns that are easier to understand and modify
- **Enhanced DX:** ESLint integration catches optimization blockers during development
### Migration Completeness
✅ All React 18→19 deprecations addressed
✅ All Apollo Client 3→4 breaking changes handled
✅ All Ant Design 5→6 updates applied
✅ All monitoring libraries updated to latest versions
✅ StrictMode integration for development safety
✅ Comprehensive testing library compatibility maintained
**No breaking changes to application functionality** - The upgrade maintains backward compatibility in behavior while providing forward-looking improvements in implementation.

View File

@@ -1,468 +0,0 @@
# React 19 Features Guide
## Overview
This guide covers the new React 19 features available in our codebase and provides practical examples for implementing them.
---
## 1. New Hooks for Forms
### `useFormStatus` - Track Form Submission State
**What it does:** Provides access to the current form's submission status without manual state management.
**Use Case:** Show loading states on submit buttons, disable inputs during submission.
**Example:**
```jsx
import { useFormStatus } from 'react';
function SubmitButton() {
const { pending } = useFormStatus();
return (
<button type="submit" disabled={pending}>
{pending ? 'Saving...' : 'Save'}
</button>
);
}
function JobForm({ onSave }) {
return (
<form action={onSave}>
<input name="jobNumber" />
<SubmitButton />
</form>
);
}
```
**Benefits:**
- No manual `useState` for loading states
- Automatic re-renders when form status changes
- Better separation of concerns (button doesn't need form state)
---
### `useOptimistic` - Instant UI Updates
**What it does:** Updates UI immediately while async operations complete in the background.
**Use Case:** Comments, notes, status updates - anything where you want instant feedback.
**Example:**
```jsx
import { useState, useOptimistic } from 'react';
function JobNotes({ jobId, initialNotes }) {
const [notes, setNotes] = useState(initialNotes);
const [optimisticNotes, addOptimisticNote] = useOptimistic(
notes,
(current, newNote) => [...current, newNote]
);
async function handleAddNote(formData) {
const text = formData.get('note');
const tempNote = { id: Date.now(), text, pending: true };
// Show immediately
addOptimisticNote(tempNote);
// Save to server
const saved = await saveNote(jobId, text);
setNotes([...notes, saved]);
}
return (
<form action={handleAddNote}>
<textarea name="note" />
<button type="submit">Add Note</button>
<ul>
{optimisticNotes.map(note => (
<li key={note.id} style={{ opacity: note.pending ? 0.5 : 1 }}>
{note.text}
</li>
))}
</ul>
</form>
);
}
```
**Benefits:**
- Perceived performance improvement
- Better UX - users see changes instantly
- Automatic rollback on error (if implemented)
---
### `useActionState` - Complete Form State Management
**What it does:** Manages async form submissions with built-in loading, error, and success states.
**Use Case:** Form validation, API submissions, complex form workflows.
**Example:**
```jsx
import { useActionState } from 'react';
async function createContract(prevState, formData) {
const data = {
customerId: formData.get('customerId'),
vehicleId: formData.get('vehicleId'),
};
try {
const result = await fetch('/api/contracts', {
method: 'POST',
body: JSON.stringify(data),
});
if (!result.ok) {
return { error: 'Failed to create contract', data: null };
}
return { error: null, data: await result.json() };
} catch (err) {
return { error: err.message, data: null };
}
}
function ContractForm() {
const [state, submitAction, isPending] = useActionState(
createContract,
{ error: null, data: null }
);
return (
<form action={submitAction}>
<input name="customerId" required />
<input name="vehicleId" required />
<button type="submit" disabled={isPending}>
{isPending ? 'Creating...' : 'Create Contract'}
</button>
{state.error && <div className="error">{state.error}</div>}
{state.data && <div className="success">Contract #{state.data.id} created!</div>}
</form>
);
}
```
**Benefits:**
- Replaces multiple `useState` calls
- Built-in pending state
- Cleaner error handling
- Type-safe with TypeScript
---
## 2. Actions API
The Actions API simplifies form submissions and async operations by using the native `action` prop on forms.
### Traditional Approach (React 18):
```jsx
function OldForm() {
const [loading, setLoading] = useState(false);
const [error, setError] = useState(null);
async function handleSubmit(e) {
e.preventDefault();
setLoading(true);
setError(null);
try {
const formData = new FormData(e.target);
await saveData(formData);
} catch (err) {
setError(err.message);
} finally {
setLoading(false);
}
}
return (
<form onSubmit={handleSubmit}>
{/* form fields */}
</form>
);
}
```
### Modern Approach (React 19):
```jsx
import { useActionState } from 'react';
function NewForm() {
const [state, formAction, isPending] = useActionState(async (_, formData) => {
return await saveData(formData);
}, null);
return (
<form action={formAction}>
{/* form fields */}
</form>
);
}
```
---
## 3. Practical Implementation Examples
### Example 1: Owner/Customer Form with Optimistic UI
```jsx
import { useOptimistic, useActionState } from 'react';
import { Form, Input, Button } from 'antd';
function OwnerFormModern({ owner, onSave }) {
const [optimisticOwner, setOptimisticOwner] = useOptimistic(
owner,
(current, updates) => ({ ...current, ...updates })
);
const [state, submitAction, isPending] = useActionState(
async (_, formData) => {
const updates = {
name: formData.get('name'),
phone: formData.get('phone'),
email: formData.get('email'),
};
// Show changes immediately
setOptimisticOwner(updates);
// Save to server
try {
await onSave(updates);
return { success: true };
} catch (error) {
return { success: false, error: error.message };
}
},
{ success: null }
);
return (
<form action={submitAction}>
<Form.Item label="Name">
<Input name="name" defaultValue={optimisticOwner.name} />
</Form.Item>
<Form.Item label="Phone">
<Input name="phone" defaultValue={optimisticOwner.phone} />
</Form.Item>
<Form.Item label="Email">
<Input name="email" defaultValue={optimisticOwner.email} />
</Form.Item>
<Button type="primary" htmlType="submit" loading={isPending}>
{isPending ? 'Saving...' : 'Save Owner'}
</Button>
{state.error && <div className="error">{state.error}</div>}
</form>
);
}
```
### Example 2: Job Status Update with useFormStatus
```jsx
import { useFormStatus } from 'react';
function JobStatusButton({ status }) {
const { pending } = useFormStatus();
return (
<button disabled={pending}>
{pending ? 'Updating...' : `Mark as ${status}`}
</button>
);
}
function JobStatusForm({ jobId, currentStatus }) {
async function updateStatus(formData) {
const newStatus = formData.get('status');
await fetch(`/api/jobs/${jobId}/status`, {
method: 'PATCH',
body: JSON.stringify({ status: newStatus }),
});
}
return (
<form action={updateStatus}>
<input type="hidden" name="status" value="IN_PROGRESS" />
<JobStatusButton status="In Progress" />
</form>
);
}
```
---
## 4. Third-Party Library Compatibility
### ✅ Fully Compatible (Already in use)
1. **Ant Design 6.2.0**
- ✅ Full React 19 support out of the box
- ✅ No patches or workarounds needed
- 📝 Note: Ant Design 6 was built with React 19 in mind
2. **React-Redux 9.2.0**
- ✅ Full React 19 support
- ✅ All hooks (`useSelector`, `useDispatch`) work correctly
- 📝 Tip: Continue using hooks over `connect()` HOC
3. **Apollo Client 4.0.13**
- ✅ Compatible with React 19
-`useQuery`, `useMutation` work correctly
- 📝 Note: Supports React 19's concurrent features
4. **React Router 7.12.0**
- ✅ Full React 19 support
- ✅ All navigation hooks compatible
- ✅ Future flags enabled for optimal performance
### Integration Notes
All our major dependencies are already compatible with React 19:
- No additional patches needed
- No breaking changes in current code
- All hooks and patterns continue to work
---
## 5. Migration Strategy
### Gradual Adoption Approach
**Phase 1: Learn** (Current)
- Review this guide
- Understand new hooks and patterns
- Identify good candidates for migration
**Phase 2: Pilot** (Recommended)
- Start with new features/forms
- Try `useActionState` in one new form
- Measure developer experience improvement
**Phase 3: Refactor** (Optional)
- Gradually update high-traffic forms
- Add optimistic UI to user-facing features
- Simplify complex form state management
### Good Candidates for React 19 Features
1. **Forms with Complex Loading States**
- Contract creation
- Job creation/editing
- Owner/Vehicle forms
- → Use `useActionState`
2. **Instant Feedback Features**
- Adding job notes
- Status updates
- Comments/messages
- → Use `useOptimistic`
3. **Submit Buttons**
- Any form button that needs loading state
- → Use `useFormStatus`
### Don't Rush to Refactor
**Keep using current patterns for:**
- Ant Design Form components (already excellent)
- Redux for global state
- Apollo Client for GraphQL
- Existing working code
**Only refactor when:**
- Building new features
- Fixing bugs in forms
- Simplifying overly complex state management
---
## 6. Performance Improvements in React 19
### Automatic Optimizations
React 19 includes built-in compiler optimizations that automatically improve performance:
1. **Automatic Memoization**
- Less need for `useMemo` and `useCallback`
- Components automatically optimize re-renders
2. **Improved Concurrent Rendering**
- Better handling of heavy operations
- Smoother UI during data loading
3. **Enhanced Suspense**
- Better loading states
- Improved streaming SSR
**What this means for us:**
- Existing code may run faster without changes
- Future code will be easier to write
- Less manual optimization needed
---
## 7. Resources
### Official Documentation
- [React 19 Release Notes](https://react.dev/blog/2024/12/05/react-19)
- [useActionState](https://react.dev/reference/react/useActionState)
- [useFormStatus](https://react.dev/reference/react-dom/hooks/useFormStatus)
- [useOptimistic](https://react.dev/reference/react/useOptimistic)
### Migration Guides
- [React 18 to 19 Upgrade Guide](https://react.dev/blog/2024/04/25/react-19-upgrade-guide)
- [Actions API Documentation](https://react.dev/reference/react/useActionState)
### Community Resources
- [React 19 Features Tutorial](https://www.freecodecamp.org/news/react-19-actions-simpliy-form-submission-and-loading-states/)
- [Practical Examples](https://blog.logrocket.com/react-useactionstate/)
---
## 8. Summary
### Current Status
**All dependencies compatible with React 19**
- Ant Design 6.2.0 ✓
- React-Redux 9.2.0 ✓
- Apollo Client 4.0.13 ✓
- React Router 7.12.0 ✓
### New Features Available
🎯 **Ready to use in new code:**
- `useFormStatus` - Track form submission state
- `useOptimistic` - Instant UI updates
- `useActionState` - Complete form state management
- Actions API - Cleaner form handling
### Recommendations
1.**No immediate action required** - Everything works
2. 🎯 **Start using new features in new code** - Especially forms
3. 📚 **Learn gradually** - No need to refactor everything
4. 🚀 **Enjoy performance improvements** - Automatic optimizations active
---
## Questions or Need Help?
Feel free to:
- Try examples in a branch first
- Ask the team for code reviews
- Share patterns that work well
- Document new patterns you discover
**Happy coding with React 19! 🎉**

View File

@@ -1,382 +0,0 @@
# React 19 Migration - Complete Summary
**Date:** January 13, 2026
**Project:** Bodyshop Client Application
**Status:** ✅ Complete
---
## Migration Overview
Successfully upgraded from React 18 to React 19 with zero breaking changes and minimal code
modifications.
---
## Changes Made
### 1. Package Updates
| Package | Before | After |
|------------------|--------|------------|
| react | 18.3.1 | **19.2.3** |
| react-dom | 18.3.1 | **19.2.3** |
| react-router-dom | 6.30.3 | **7.12.0** |
**Updated Files:**
- `package.json`
- `package-lock.json`
### 2. Code Changes
**File:** `src/index.jsx`
Added React Router v7 future flags to enable optimal performance:
```javascript
const router = sentryCreateBrowserRouter(
createRoutesFromElements(<Route path="*" element={<AppContainer/>}/>),
{
future: {
v7_startTransition: true, // Smooth transitions
v7_relativeSplatPath: true, // Correct splat path resolution
},
}
);
```
**Why:** These flags enable React Router v7's enhanced transition behavior and fix relative path
resolution in splat routes (`path="*"`).
### 3. Documentation Created
Created comprehensive guides for the team:
1. **REACT_19_FEATURES_GUIDE.md** (12KB)
- Overview of new React 19 hooks
- Practical examples for our codebase
- Third-party library compatibility check
- Migration strategy and recommendations
2. **REACT_19_MODERNIZATION_EXAMPLES.md** (10KB)
- Before/after code comparisons
- Real-world examples from our codebase
- Step-by-step modernization checklist
- Best practices for gradual adoption
---
## Verification Results
### ✅ Build
- **Status:** Success
- **Time:** 42-48 seconds
- **Warnings:** None (only Sentry auth token warnings - expected)
- **Output:** 238 files, 7.6 MB precached
### ✅ Tests
- **Unit Tests:** 5/5 passing
- **Duration:** ~5 seconds
- **Status:** All green
### ✅ Linting
- **Status:** Clean
- **Errors:** 0
- **Warnings:** 0
### ✅ Code Analysis
- **String refs:** None found ✓
- **defaultProps:** None found ✓
- **Legacy context:** None found ✓
- **ReactDOM.render:** Already using createRoot ✓
---
## Third-Party Library Compatibility
All major dependencies are fully compatible with React 19:
### ✅ Ant Design 6.2.0
- **Status:** Full support, no patches needed
- **Notes:** Version 6 was built with React 19 in mind
- **Action Required:** None
### ✅ React-Redux 9.2.0
- **Status:** Full compatibility
- **Notes:** All hooks work correctly
- **Action Required:** None
### ✅ Apollo Client 4.0.13
- **Status:** Compatible
- **Notes:** Supports React 19 concurrent features
- **Action Required:** None
### ✅ React Router 7.12.0
- **Status:** Fully compatible
- **Notes:** Future flags enabled for optimal performance
- **Action Required:** None
---
## New Features Available
React 19 introduces several powerful new features now available in our codebase:
### 1. `useFormStatus`
**Purpose:** Track form submission state without manual state management
**Use Case:** Show loading states on buttons, disable during submission
**Complexity:** Low - drop-in replacement for manual loading states
### 2. `useOptimistic`
**Purpose:** Update UI instantly while async operations complete
**Use Case:** Comments, notes, status updates - instant user feedback
**Complexity:** Medium - requires understanding of optimistic UI patterns
### 3. `useActionState`
**Purpose:** Complete async form state management (loading, error, success)
**Use Case:** Form submissions, API calls, complex workflows
**Complexity:** Medium - replaces multiple useState calls
### 4. Actions API
**Purpose:** Simpler form handling with native `action` prop
**Use Case:** Any form submission or async operation
**Complexity:** Low to Medium - cleaner than traditional onSubmit
---
## Performance Improvements
React 19 includes automatic performance optimizations:
-**Automatic Memoization** - Less need for useMemo/useCallback
-**Improved Concurrent Rendering** - Smoother UI during heavy operations
-**Enhanced Suspense** - Better loading states
-**Compiler Optimizations** - Automatic code optimization
**Impact:** Existing code may run faster without any changes.
---
## Recommendations
### Immediate (No Action Required)
- ✅ Migration is complete
- ✅ All code works as-is
- ✅ Performance improvements are automatic
### Short Term (Optional - For New Code)
1. **Read the Documentation**
- Review `REACT_19_FEATURES_GUIDE.md`
- Understand new hooks and patterns
2. **Try in New Features**
- Use `useActionState` in new forms
- Experiment with `useOptimistic` for notes/comments
- Use `useFormStatus` for submit buttons
3. **Share Knowledge**
- Discuss patterns in code reviews
- Share what works well
- Document team preferences
### Long Term (Optional - Gradual Refactoring)
1. **High-Traffic Forms**
- Add optimistic UI to frequently-used features
- Simplify complex loading state management
2. **New Features**
- Default to React 19 patterns for new code
- Build examples for the team
3. **Team Training**
- Share learnings
- Update coding standards
- Create internal patterns library
---
## What NOT to Do
**Don't rush to refactor everything**
- Current code works perfectly
- Ant Design forms are already excellent
- Only refactor when there's clear benefit
**Don't force new patterns**
- Some forms work better with traditional patterns
- Complex Ant Design forms should stay as-is
- Use new features where they make sense
**Don't break working code**
- If it ain't broke, don't fix it
- New features are additive, not replacements
- Migration is about gradual improvement
---
## Success Metrics
### Migration Quality: A+
- ✅ Zero breaking changes
- ✅ Zero deprecation warnings
- ✅ All tests passing
- ✅ Build successful
- ✅ Linting clean
### Code Health: Excellent
- ✅ Already using React 18+ APIs
- ✅ No deprecated patterns
- ✅ Modern component structure
- ✅ Good separation of concerns
### Future Readiness: High
- ✅ All dependencies compatible
- ✅ Ready for React 19 features
- ✅ No technical debt blocking adoption
- ✅ Clear migration path documented
---
## Timeline
| Date | Action | Status |
|--------------|-----------------------|------------|
| Jan 13, 2026 | Package updates | ✅ Complete |
| Jan 13, 2026 | Future flags added | ✅ Complete |
| Jan 13, 2026 | Build verification | ✅ Complete |
| Jan 13, 2026 | Test verification | ✅ Complete |
| Jan 13, 2026 | Documentation created | ✅ Complete |
| Jan 13, 2026 | Console warning fixed | ✅ Complete |
**Total Time:** ~1 hour
**Issues Encountered:** 0
**Rollback Required:** No
---
## Team Next Steps
### For Developers
1. ✅ Pull latest changes
2. 📚 Read `REACT_19_FEATURES_GUIDE.md`
3. 🎯 Try new patterns in next feature
4. 💬 Share feedback with team
### For Team Leads
1. ✅ Review documentation
2. 📋 Discuss adoption strategy in next standup
3. 🎯 Identify good pilot features
4. 📊 Track developer experience improvements
### For QA
1. ✅ No regression testing needed
2. ✅ All existing tests pass
3. 🎯 Watch for new features using React 19 patterns
4. 📝 Document any issues (none expected)
---
## Support Resources
### Internal Documentation
- [React 19 Features Guide](REACT_19_FEATURES_GUIDE.md)
- [Modernization Examples](REACT_19_MODERNIZATION_EXAMPLES.md)
- This summary document
### Official React Documentation
- [React 19 Release Notes](https://react.dev/blog/2024/12/05/react-19)
- [Migration Guide](https://react.dev/blog/2024/04/25/react-19-upgrade-guide)
- [New Hooks Reference](https://react.dev/reference/react)
### Community Resources
- [LogRocket Guide](https://blog.logrocket.com/react-useactionstate/)
- [FreeCodeCamp Tutorial](https://www.freecodecamp.org/news/react-19-actions-simpliy-form-submission-and-loading-states/)
---
## Conclusion
The migration to React 19 was **successful, seamless, and non-disruptive**.
### Key Achievements
- ✅ Zero downtime
- ✅ Zero breaking changes
- ✅ Zero code refactoring required
- ✅ Enhanced features available
- ✅ Automatic performance improvements
### Why It Went Smoothly
1. **Codebase was already modern**
- Using ReactDOM.createRoot
- No deprecated APIs
- Good patterns in place
2. **Dependencies were ready**
- All libraries React 19 compatible
- No version conflicts
- Smooth upgrade path
3. **React 19 is backward compatible**
- New features are additive
- Old patterns still work
- Gradual adoption possible
**Status: Ready for Production**
---
## Questions?
If you have questions about:
- Using new React 19 features
- Migrating specific components
- Best practices for patterns
- Code review guidance
Feel free to:
- Check the documentation
- Ask in team chat
- Create a POC/branch
- Request code review
**Happy coding with React 19!** 🎉🚀

View File

@@ -1,375 +0,0 @@
# React 19 Form Modernization Example
This document shows a practical example of how existing forms in our codebase could be simplified
using React 19 features.
---
## Example: Sign-In Form Modernization
### Current Implementation (React 18 Pattern)
```jsx
// Current approach using Redux, manual state management
function SignInComponent({emailSignInStart, loginLoading, signInError}) {
const [form] = Form.useForm();
const handleFinish = (values) => {
const {email, password} = values;
emailSignInStart(email, password);
};
return (
<Form form={form} onFinish={handleFinish}>
<Form.Item name="email" rules={[{required: true, type: 'email'}]}>
<Input prefix={<UserOutlined/>} placeholder="Email"/>
</Form.Item>
<Form.Item name="password" rules={[{required: true}]}>
<Input.Password prefix={<LockOutlined/>} placeholder="Password"/>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit" loading={loginLoading} block>
{loginLoading ? 'Signing in...' : 'Sign In'}
</Button>
</Form.Item>
{signInError && <AlertComponent type="error" message={signInError}/>}
</Form>
);
}
```
**Characteristics:**
- ✅ Works well with Ant Design
- ✅ Good separation with Redux
- ⚠️ Loading state managed in Redux
- ⚠️ Error state managed in Redux
- ⚠️ Multiple state slices for one operation
---
### Modern Alternative (React 19 Pattern)
**Option 1: Keep Ant Design + Add useActionState for cleaner Redux actions**
```jsx
import {useActionState} from 'react';
import {Form, Input, Button} from 'antd';
import {UserOutlined, LockOutlined} from '@ant-design/icons';
function SignInModern() {
const [form] = Form.useForm();
// Wrap your Redux action with useActionState
const [state, submitAction, isPending] = useActionState(
async (prevState, formData) => {
try {
// Call your Redux action
await emailSignInAsync(
formData.get('email'),
formData.get('password')
);
return {error: null, success: true};
} catch (error) {
return {error: error.message, success: false};
}
},
{error: null, success: false}
);
return (
<Form
form={form}
onFinish={(values) => {
// Convert Ant Design form values to FormData
const formData = new FormData();
formData.append('email', values.email);
formData.append('password', values.password);
submitAction(formData);
}}
>
<Form.Item name="email" rules={[{required: true, type: 'email'}]}>
<Input prefix={<UserOutlined/>} placeholder="Email"/>
</Form.Item>
<Form.Item name="password" rules={[{required: true}]}>
<Input.Password prefix={<LockOutlined/>} placeholder="Password"/>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit" loading={isPending} block>
{isPending ? 'Signing in...' : 'Sign In'}
</Button>
</Form.Item>
{state.error && <AlertComponent type="error" message={state.error}/>}
</Form>
);
}
```
**Benefits:**
- ✅ Loading state is local (no Redux slice needed)
- ✅ Error handling is simpler
- ✅ Still works with Ant Design validation
- ✅ Less Redux boilerplate
---
**Option 2: Native HTML Form + React 19 (for simpler use cases)**
```jsx
import {useActionState} from 'react';
import {signInWithEmailAndPassword} from '@firebase/auth';
import {auth} from '../../firebase/firebase.utils';
function SimpleSignIn() {
const [state, formAction, isPending] = useActionState(
async (prevState, formData) => {
const email = formData.get('email');
const password = formData.get('password');
try {
await signInWithEmailAndPassword(auth, email, password);
return {error: null};
} catch (error) {
return {error: error.message};
}
},
{error: null}
);
return (
<form action={formAction} className="sign-in-form">
<input
type="email"
name="email"
placeholder="Email"
required
/>
<input
type="password"
name="password"
placeholder="Password"
required
/>
<button type="submit" disabled={isPending}>
{isPending ? 'Signing in...' : 'Sign In'}
</button>
{state.error && <div className="error">{state.error}</div>}
</form>
);
}
```
**Benefits:**
- ✅ Minimal code
- ✅ No form library needed
- ✅ Built-in HTML5 validation
- ⚠️ Less feature-rich than Ant Design
---
## Recommendation for Our Codebase
### Keep Current Pattern When:
1. Using complex Ant Design form features (nested forms, dynamic fields, etc.)
2. Form state needs to be in Redux for other reasons
3. Form is working well and doesn't need changes
### Consider React 19 Pattern When:
1. Creating new simple forms
2. Form only needs local state
3. Want to reduce Redux boilerplate
4. Building optimistic UI features
---
## Real-World Example: Job Note Adding
Let's look at a more practical example for our domain:
### Adding Job Notes with Optimistic UI
```jsx
import {useOptimistic, useActionState} from 'react';
import {Form, Input, Button, List} from 'antd';
function JobNotesModern({jobId, initialNotes}) {
const [notes, setNotes] = useState(initialNotes);
// Optimistic UI for instant feedback
const [optimisticNotes, addOptimisticNote] = useOptimistic(
notes,
(currentNotes, newNote) => [newNote, ...currentNotes]
);
// Form submission with loading state
const [state, submitAction, isPending] = useActionState(
async (prevState, formData) => {
const noteText = formData.get('note');
// Show note immediately (optimistic)
const tempNote = {
id: `temp-${Date.now()}`,
text: noteText,
createdAt: new Date().toISOString(),
pending: true,
};
addOptimisticNote(tempNote);
try {
// Save to server
const response = await fetch(`/api/jobs/${jobId}/notes`, {
method: 'POST',
body: JSON.stringify({text: noteText}),
});
const savedNote = await response.json();
// Update with real note
setNotes(prev => [savedNote, ...prev]);
return {error: null, success: true};
} catch (error) {
// Optimistic note will disappear on next render
return {error: error.message, success: false};
}
},
{error: null, success: false}
);
return (
<div className="job-notes">
<Form onFinish={(values) => {
const formData = new FormData();
formData.append('note', values.note);
submitAction(formData);
}}>
<Form.Item name="note" rules={[{required: true}]}>
<Input.TextArea
placeholder="Add a note..."
rows={3}
/>
</Form.Item>
<Button type="primary" htmlType="submit" loading={isPending}>
{isPending ? 'Adding...' : 'Add Note'}
</Button>
{state.error && <div className="error">{state.error}</div>}
</Form>
<List
dataSource={optimisticNotes}
renderItem={note => (
<List.Item style={{opacity: note.pending ? 0.5 : 1}}>
<List.Item.Meta
title={note.text}
description={new Date(note.createdAt).toLocaleString()}
/>
{note.pending && <span className="badge">Saving...</span>}
</List.Item>
)}
/>
</div>
);
}
```
**User Experience:**
1. User types note and clicks "Add Note"
2. Note appears instantly (optimistic)
3. Note is grayed out with "Saving..." badge
4. Once saved, note becomes solid and badge disappears
5. If error, note disappears and error shows
**Benefits:**
- ⚡ Instant feedback (feels faster)
- 🎯 Clear visual indication of pending state
- ✅ Automatic error handling
- 🧹 Clean, readable code
---
## Migration Checklist
When modernizing a form to React 19 patterns:
### Step 1: Analyze Current Form
- [ ] Does it need Redux state? (Multi-component access?)
- [ ] How complex is the validation?
- [ ] Does it benefit from optimistic UI?
- [ ] Is it a good candidate for modernization?
### Step 2: Choose Pattern
- [ ] Keep Ant Design + useActionState (complex forms)
- [ ] Native HTML + Actions (simple forms)
- [ ] Add useOptimistic (instant feedback needed)
### Step 3: Implement
- [ ] Create new branch
- [ ] Update component
- [ ] Test loading states
- [ ] Test error states
- [ ] Test success flow
### Step 4: Review
- [ ] Code is cleaner/simpler?
- [ ] No loss of functionality?
- [ ] Better UX?
- [ ] Team understands pattern?
---
## Conclusion
React 19's new features are **additive** - they give us new tools without breaking existing
patterns.
**Recommended Approach:**
1. ✅ Keep current forms working as-is
2. 🎯 Try React 19 patterns in NEW forms first
3. 📚 Learn by doing in low-risk features
4. 🔄 Gradually adopt where it makes sense
**Don't:**
- ❌ Rush to refactor everything
- ❌ Break working code
- ❌ Force patterns where they don't fit
**Do:**
- ✅ Experiment with new features
- ✅ Share learnings with team
- ✅ Use where it improves code
- ✅ Enjoy better DX (Developer Experience)!
---
## Next Steps
1. Review the main [REACT_19_FEATURES_GUIDE.md](REACT_19_FEATURES_GUIDE.md)
2. Try `useActionState` in one new form
3. Share feedback with the team
4. Consider optimistic UI for high-traffic features
Happy coding! 🚀

View File

@@ -1,251 +0,0 @@
# React Grid Layout Migration Guide
## Current Status: Legacy API (v2.2.2)
### What Changed
- **Package Version**: 1.3.4 → 2.2.2
- **API Strategy**: Using legacy compatibility layer
### Migration Completed ✅
#### Changes Made:
```javascript
// Before (v1.3.4):
import { Responsive, WidthProvider } from "react-grid-layout";
// After (v2.2.2 with legacy API):
import { Responsive, WidthProvider } from "react-grid-layout/legacy";
```
#### Files Updated:
- `src/components/dashboard-grid/dashboard-grid.component.jsx`
#### Why Legacy API?
The v2.x release introduces a completely new hooks-based API with breaking changes. The legacy API provides 100% backward compatibility, allowing us to:
- ✅ Get bug fixes and security updates
- ✅ Maintain existing functionality without code rewrites
- ✅ Plan migration to new API incrementally
---
## Future: Migration to New v2 API
When ready to fully migrate to the modern v2 API, follow this guide:
### Breaking Changes in v2
1. **Width Provider Removed**
- Old: `WidthProvider(Responsive)`
- New: Use `useContainerWidth` hook
2. **Props Restructured**
- Old: Flat props structure
- New: Grouped configs (`gridConfig`, `dragConfig`, `resizeConfig`)
3. **Layout Prop Required**
- Old: Could use `data-grid` attribute
- New: Must provide `layout` prop explicitly
4. **Compaction Changes**
- Old: `verticalCompact` prop
- New: `compactor` prop with pluggable algorithms
### Migration Steps
#### Step 1: Replace WidthProvider with useContainerWidth hook
**Before:**
```javascript
const ResponsiveReactGridLayout = WidthProvider(Responsive);
return (
<ResponsiveReactGridLayout
className="layout"
breakpoints={GRID_BREAKPOINTS}
cols={GRID_COLS}
layouts={state.layouts}
onLayoutChange={handleLayoutChange}
>
{children}
</ResponsiveReactGridLayout>
);
```
**After:**
```javascript
import ReactGridLayout, { useContainerWidth, verticalCompactor } from 'react-grid-layout';
function DashboardGridComponent({ currentUser }) {
const { width, containerRef, mounted } = useContainerWidth();
return (
<div ref={containerRef}>
{mounted && (
<ReactGridLayout
width={width}
layout={state.layout}
gridConfig={{
cols: 12,
rowHeight: 30,
margin: [10, 10]
}}
dragConfig={{
enabled: true,
handle: '.drag-handle' // optional
}}
resizeConfig={{
enabled: true
}}
compactor={verticalCompactor}
onLayoutChange={handleLayoutChange}
>
{children}
</ReactGridLayout>
)}
</div>
);
}
```
#### Step 2: Update Responsive Layouts
For responsive behavior, manage breakpoints manually:
```javascript
function DashboardGridComponent() {
const { width, containerRef, mounted } = useContainerWidth();
const [currentBreakpoint, setCurrentBreakpoint] = useState('lg');
useEffect(() => {
if (width > 1200) setCurrentBreakpoint('lg');
else if (width > 996) setCurrentBreakpoint('md');
else if (width > 768) setCurrentBreakpoint('sm');
else if (width > 480) setCurrentBreakpoint('xs');
else setCurrentBreakpoint('xxs');
}, [width]);
const currentLayout = state.layouts[currentBreakpoint] || state.layout;
const currentCols = GRID_COLS[currentBreakpoint];
return (
<div ref={containerRef}>
{mounted && (
<ReactGridLayout
width={width}
layout={currentLayout}
gridConfig={{
cols: currentCols,
rowHeight: 30
}}
// ... other props
>
{children}
</ReactGridLayout>
)}
</div>
);
}
```
#### Step 3: Update Child Components
The `data-grid` attribute still works, but explicitly managing layout is preferred:
**Before:**
```javascript
<div
key={item.i}
data-grid={{
...item,
minH,
minW
}}
>
{content}
</div>
```
**After (Preferred):**
```javascript
// Manage layout in parent state
const layout = state.items.map(item => ({
i: item.i,
x: item.x,
y: item.y,
w: item.w,
h: item.h,
minW: componentList[item.i]?.minW || 1,
minH: componentList[item.i]?.minH || 1
}));
// Children just need keys
<div key={item.i}>
{content}
</div>
```
#### Step 4: Update Styles (if needed)
The CSS classes remain mostly the same, but check the new documentation for any changes.
### Benefits of New API
- 🚀 **Better Performance**: Optimized rendering with hooks
- 📦 **TypeScript Support**: Full type definitions included
- 🎯 **Better API**: More intuitive props organization
- 🔧 **Extensibility**: Pluggable compactors and strategies
- 📱 **Modern React**: Uses hooks pattern
### Testing Checklist
When migrating to new API:
- [ ] Grid items render correctly
- [ ] Drag functionality works
- [ ] Resize functionality works
- [ ] Responsive breakpoints work
- [ ] Layout persistence works
- [ ] Add/remove components works
- [ ] Min/max constraints respected
- [ ] Performance is acceptable
- [ ] No console errors or warnings
### Resources
- [React Grid Layout v2 Documentation](https://github.com/react-grid-layout/react-grid-layout)
- [Migration Guide](https://www.npmjs.com/package/react-grid-layout)
- [Examples](https://github.com/react-grid-layout/react-grid-layout/tree/master/examples)
---
## Current Implementation Notes
### Component Structure
- **File**: `src/components/dashboard-grid/dashboard-grid.component.jsx`
- **Styles**: `src/components/dashboard-grid/dashboard-grid.styles.scss`
- **Pattern**: Responsive grid with dynamic component loading
### Key Features Used
- ✅ Responsive layouts with breakpoints
- ✅ Drag and drop
- ✅ Resize handles
- ✅ Layout persistence to database
- ✅ Dynamic component add/remove
- ✅ Min/max size constraints
### Configuration
```javascript
const GRID_BREAKPOINTS = { lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 };
const GRID_COLS = { lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 };
```
### Performance Considerations
- Layout changes debounced via database updates
- Memoized dashboard queries to prevent re-fetches
- Memoized menu items and layout keys
---
**Last Updated**: 2026-01-13
**Current Version**: react-grid-layout@2.2.2 (legacy API)
**Target Version**: react-grid-layout@2.2.2 (new API) - Future migration

View File

@@ -1,278 +0,0 @@
# Reynolds RCI Implementation Notes for “Rome”
---
## TL;DR (What you need to wire up)
* **Protocol:** HTTPS (Reynolds will call our web service; we call theirs as per interface specs).
* **Auth:** Username/Password and/or client certs. **No IP allowlisting** (explicitly disallowed).
* **Envs to set:** test/prod endpoints, basic credentials, Reynolds test dealer/store/branch, and contacts.
* **Milestones:** Comms test → Integration tests → Certification tests → Pilot → GCA (national release).
* **Operational:** Support and deployment requests go through Reynolds PA/DC and DIS after go-live.
---
## Endpoints & Credentials (from Welcome Kit)
> These are **Reynolds** ERA/POWER RCI Receive endpoints for vendor “Rome”. Keep in a secure secret store.
| Environment | URL | Login | Password |
| ----------- | -------------------------------------------------------- | ------ | -------------- |
| **TEST** | `https://b2b-test.reyrey.com/Sync/RCI/Rome/Receive.ashx` | `Rome` | `p7Q7RLXwO8IB` |
| **PROD** | `https://b2b.reyrey.com/Sync/RCI/Rome/Receive.ashx` | `Rome` | `93+?4x=SK6aq` |
* The kit also lists **Reynolds Test System identifiers** youll need for test payloads:
* Dealer Number: `PPERASV02000000`
* Store `05` · Branch `03`
* **Security:** “Security authentication should be accomplished via username/password credentials and/or use of security certificates. **IP whitelisting is not permitted.**
---
## Our App Configuration (env/secret template)
Create `apps/server/.env.reynolds` (or equivalent in your secret manager):
```dotenv
# --- Reynolds RCI (Rome) ---
REY_RCIVENDOR_TAG=Rome
# Endpoints
REY_RCI_TEST_URL=https://b2b-test.reyrey.com/Sync/RCI/Rome/Receive.ashx
REY_RCI_PROD_URL=https://b2b.reyrey.com/Sync/RCI/Rome/Receive.ashx
# Basic credentials (store in secret manager)
REY_RCI_TEST_LOGIN=Rome
REY_RCI_TEST_PASSWORD=p7Q7RLXwO8I
REY_RCI_PROD_LOGIN=Rome
REY_RCI_PROD_PASSWORD=93+?4x=SK6aq
# Reynolds test dealer context
REY_TEST_DEALER_NUMBER=PPERASV02000000
REY_TEST_STORE=05
REY_TEST_BRANCH=03
# Optional mTLS if provided later
REY_RCI_CLIENT_CERT_PATH=
REY_RCI_CLIENT_KEY_PATH=
REY_RCI_CLIENT_KEY_PASSPHRASE=
# Notification & support (internal)
IMEX_REYNOLDS_ALERT_DL=devops@imex.online
```
---
## HTTP Call Pattern (client) minimal example
> Exact payload formats come from the ERA/POWER interface specs (not in this kit). Use these stubs to wire transport & auth now; plug actual SOAP/XML later.
### Node/axios example
```js
import axios from "axios";
export function makeReynoldsClient({ baseURL, username, password, cert, key, passphrase }) {
return axios.create({
baseURL,
timeout: 30000,
httpsAgent: cert && key
? new (await import("https")).Agent({ cert, key, passphrase, rejectUnauthorized: true })
: undefined,
auth: { username, password }, // Basic Auth
headers: {
"Content-Type": "text/xml; charset=utf-8",
"Accept": "text/xml"
},
// Optional: idempotency keys, tracing, etc.
});
}
// Usage (TEST):
const client = makeReynoldsClient({
baseURL: process.env.REY_RCI_TEST_URL,
username: process.env.REY_RCI_TEST_LOGIN,
password: process.env.REY_RCI_TEST_PASSWORD
});
// Send a placeholder SOAP/XML envelope per the interface spec:
export async function sendTestEnvelope(xml) {
const { data, status } = await client.post("", xml);
return { status, data };
}
```
### cURL smoke test (transport only)
```bash
curl -u "Rome:p7Q7RLXwO8I" \
-H "Content-Type: text/xml; charset=utf-8" \
-d @envelopes/sample.xml \
"https://b2b-test.reyrey.com/Sync/RCI/Rome/Receive.ashx"
```
> Replace `@envelopes/sample.xml` with your valid envelope from the spec.
---
## Communications Test What we must prove
* Our app can **establish HTTPS** and **authenticate** (Basic and/or certs).
* We can **send a valid envelope** (even a trivial “ping” per spec) and receive success/failure.
* Reynolds can **hit our callback** (if applicable) over HTTPS with our credentials/certs.
* **No IP allowlisting** dependencies. Log end-to-end request/response with redaction.
* Ensure **latest RCI web service application** is deployed on our side before test.
### Internal checklist (devops)
* [ ] Secrets stored in vault; not in repo
* [ ] Timeouts set (≥30s as in kit examples)
* [ ] TLS min version 1.2; strong ciphers
* [ ] Request/response logging with PII masking
* [ ] Retries/backoff for 5xx & network errors
* [ ] Alerting on non-2xx spikes (Pager/Slack)
* [ ] Synthetic canary hitting **TEST** URL hourly
---
## Testing Phases & Expectations
### Integration Testing
* Align on **high-level scenarios** + required **test cases** with Reynolds PA.
* Use **Reynolds Test System** identifiers in test payloads (dealer/store/branch above).
### Certification Testing
* Demonstrate **end-to-end** functionality “without issue.”
* After sign-off, PA coordinates move to **pilot**.
---
## Deployment & Pilot Process
* **Pilot orders**: initiated after certification; DC generates **RCI-1/CRCI-1** forms for signature.
* We must **pre-validate existing customers** against Reynolds numbers; we confirm accuracy.
* Maintain a list of **authorized signers** (officer-signed form required).
* **EULA on file** is required to permit data sharing to us per **RIA**.
* Dealer is notified by RCI Deployment when setup completes.
**Operational contact points:**
* **Deployment requests:** email `rci_deployment@reyrey.com`.
* **Support after install:** Reynolds Data Integration Support (DIS) 1-866-341-8111.
---
## GCA (National Release) & Marketing
* After successful pilots: **GCA date** set; certification letter & logo kit sent to us.
* RCI website updated to show **Certified** status.
* Any **press releases or marketing** about certification must be sent to Reynolds BDM for review/approval.
* BDM (from kit): **Amanda Gorney** `Amanda_Gorney@reyrey.com` 937-485-1775.
---
## Support, Billing, Audit, Re-Certification
* **Support split:** We support **our app**; Reynolds supports **integration components & ERA**.
* **Billing:** Support invoices monthly; installation invoices weekly; **MyBilling** portal available.
* **Audit:** Periodic audits of customer lists and EULA status.
* **Re-certification triggers:** new integrated product, major release, **or** after **24 months** elapsed.
---
## Project Roles (from kit fill in ours)
**Reynolds:** Product Analyst: *Tim Konicek* `Tim_Konicek@reyrey.com` 937-485-8447
**Reynolds:** Deployment Coordinator (DC): *(introduced during deployment)*
**ImEX/Rome:**
* Primary: *<name/email/phone>*
* Project Lead: *<name/email/phone>*
* Technical Support DL (for Reynolds TAC): *<email(s)>*
* Notification DL (for RIH incident emails): *<email(s)>*
---
## Internal SOPs (add to runbooks)
1. **Before Comms Test**
* [ ] Deploy latest RCI web service app build.
* [ ] Configure secrets + TLS.
* [ ] Verify outbound HTTPS egress to Reynolds test host.
2. **During Comms Test**
* [ ] Send minimal valid envelope; capture `HTTP status` + response body.
* [ ] Record request IDs/correlation IDs for Reynolds.
3. **Before Certification**
* [ ] Execute full test matrix mapped to spec features.
* [ ] Produce **evidence pack** (logs, payloads, results).
4. **Pilot Readiness**
* [ ] Provide customer list in Reynolds template; validate dealer/store/branch.
* [ ] Submit authorized signers form (officer-signed).
* [ ] Confirm EULA on file per RIA.
---
## Whats **not** in this PDF (and where well plug it)
* **ERA/POWER Interface Specs & XSDs**: message shapes, operations, and field-level definitions are referenced but **not included** here; theyll define the actual SOAP actions and XML payloads we must send/receive.
* Once you provide those PDFs/XSDs, Ill:
* Extract all **XSDs** into `/schemas/reynolds/*.xsd`.
* Generate **sample envelopes** in `/envelopes/`.
* Add **validator scripts** and **TypeScript types** (xml-js / xsd-ts).
* Flesh out **per-operation** client wrappers and test cases.
> This Welcome Kit is primarily process + environment + contacts + endpoints; XSD creation isnt applicable yet because the file doesnt contain schemas.
---
## Appendices
### A. Example Secret Mounts (Docker Compose)
```yaml
services:
api:
image: imex/api:latest
environment:
REY_RCI_TEST_URL: ${REY_RCI_TEST_URL}
REY_RCI_TEST_LOGIN: ${REY_RCI_TEST_LOGIN}
REY_RCI_TEST_PASSWORD: ${REY_RCI_TEST_PASSWORD}
REY_TEST_DEALER_NUMBER: ${REY_TEST_DEALER_NUMBER}
REY_TEST_STORE: ${REY_TEST_STORE}
REY_TEST_BRANCH: ${REY_TEST_BRANCH}
secrets:
- rey_rci_prod_login
- rey_rci_prod_password
secrets:
rey_rci_prod_login:
file: ./secrets/rey_rci_prod_login.txt
rey_rci_prod_password:
file: ./secrets/rey_rci_prod_password.txt
```
### B. Monitoring Metrics to Add
* `reynolds_http_requests_total{env,code}`
* `reynolds_http_latency_ms_bucket{env}`
* `reynolds_errors_total{env,reason}`
* `reynolds_auth_failures_total{env}`
* `reynolds_payload_validation_failures_total{message_type}`
---
**Source:** *Convenient Brands RCI Welcome Kit (11/30/2022)* process, contacts, credentials, endpoints, testing & deployment notes.
---
*Ready for the next PDF. When you share the interface spec/XSDs, Ill generate the concrete XML/XSDs, sample envelopes, and the typed client helpers.*

View File

@@ -1,214 +0,0 @@
# Rome Create Body Shop Management Repair Order Interface
*(Implementation Guide & Extracted XSDs Version 1.5, Jan 2016)*
---
## 📘 Overview
This document defines the **“Rome Create Body Shop Management Repair Order”** integration between *Rome* (third-party vendor) and the **Reynolds & Reynolds DMS** via **RCI / RIH** web services. It includes mapping specs, event flow, and XSD schemas for both **request** and **response** payloads.
---
## 1. Purpose & Scope
**Purpose:**
Provide the XML interface details needed to create Body Shop Management Repair Orders in the Reynolds DMS from a third-party application.
**Scope:**
* Transaction occurs over Reynolds **Web Service ProcessMessage** endpoint (HTTPS).
* Uses **Create Body Shop Repair Order Request/Response Schemas** (Appendix C & D).
* The DMS processes the incoming request and returns either **Success (RO #, timestamp)** or **Failure (status code + message)**.
---
## 2. Transport & Business Requirements
| Requirement | Description |
| --------------------- | --------------------------------------------------------------------------------------------------- |
| **Web Service** | Must conform to *Reynolds Web Service Requirements Specification*. |
| **Endpoints** | Separate **Test** and **Production** URLs with unique credentials. |
| **Transport Method** | HTTPS POST to `ProcessMessage` with XML body. |
| **Response Codes** | Standard HTTP 2xx / 4xx per [RFC 2616 §10](http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html). |
| **Synchronous** | Request → Immediate HTTP Response (Success or Failure). |
| **Schema Validation** | All payloads must validate against provided XSDs. |
---
## 3. Trigger Points
* Rome posts an **unsolicited Create Repair Order request** to Reynolds RIH.
* RIH/DMS responds synchronously with:
* **Success:** `DMSRoNo` and timestamp.
* **Failure:** `StatusCode` and `GenTransStatus` text.
---
## 4. Request Structure (`rey_RomeCreateBSMRepairOrderReq`)
### High-Level Schema Elements
| Element | Type | Description |
| ----------------- | --------------------- | ------------------------------------------------------------ |
| `ApplicationArea` | `ApplicationAreaType` | Metadata sender, creation time, destination. |
| `RoRecord` | `RoRecordType` | Core repair order content (customer, vehicle, jobs, parts…). |
---
### 4.1 `ApplicationAreaType`
| Field | Example | Description |
| --------------------------------------------- | ------------------------------- | ------------------------------------- |
| `Sender.Component` | `"Rome"` | Identifies vendor. |
| `Sender.Task` | `"BSMRO"` | Transaction type. |
| `ReferenceId` | `"Insert"` | Literal value. |
| `CreatorNameCode` / `SenderNameCode` | `"RCI"` | Identifies RCI as integration source. |
| `CreationDateTime` | `2024-10-07T21:36:45Z` | Dealer local timestamp. |
| `BODId` | `GUID` | Unique transaction identifier. |
| `Destination.DestinationNameCode` | `"RR"` | Always Reynolds. |
| `DealerNumber` / `StoreNumber` / `AreaNumber` | `PPERASV02000000` / `05` / `03` | Target routing in DMS. |
---
### 4.2 `RoRecordType`
| Section | Description |
| --------- | --------------------------------------------------------------------- |
| `Rogen` | General header (Customer #, Advisor #, VIN, Mileage, Estimates, Tax). |
| `Rolabor` | Labor operations (op codes, hours, rates, CCC statements, amounts). |
| `Ropart` | Parts ordered by job (OSD part details, cost/sale values). |
| `Rogog` | Gas/Oil/Grease and misc line items (BreakOut, ItemType, Amounts). |
| `Romisc` | Miscellaneous charges (Misc codes and amounts). |
---
### 4.3 Key Business Validations
* **CustNo** must exist in DMS.
* **AdvNo** must be active.
* **VIN** must be associated to Customer.
* **DeptType = "B"** (Body Shop).
* **OpCode** must exist or = `ALL` / `INTERNAL`.
* **Tax Flags:** `T` = Taxable, `N` = Non-Taxable.
* **PayType:** `Cust` / `Warr` / `Intr`.
* **BreakOut:** Valid GOG code in system.
* **AddDeleteFlag:** `A` or `D`.
---
## 5. Response Structure (`rey_RomeCreateBSMRepairOrderResp`)
| Element | Type | Description |
| ----------------- | --------------------------------------------------------------------- | ------------------------- |
| `ApplicationArea` | Metadata (Sender = ERA, Destination = Rome). | |
| `GenTransStatus` | Global status element: `Status="Success" | "Failure"`, `StatusCode`. |
| `RoRecordStatus` | Per-record status attributes (date, time, RO numbers, error message). | |
### Example
```xml
<rey_RomeCreateBSMRepairOrderResp revision="1.0">
<ApplicationArea>
<Sender>
<Component>ERA</Component>
<Task>BSMRO</Task>
<CreatorNameCode>RR</CreatorNameCode>
<SenderNameCode>RR</SenderNameCode>
</Sender>
<CreationDateTime>2025-10-07T14:40:00Z</CreationDateTime>
<BODId>ef097f3a-01b2-1eca-b12a-80048cbb74f3</BODId>
<Destination><DestinationNameCode>Rome</DestinationNameCode></Destination>
</ApplicationArea>
<GenTransStatus Status="Success" StatusCode="0"/>
<RoRecordStatus Status="Success" Date="2025-10-07" Time="14:40"
OutsdRoNo="27200" DMSRoNo="54387"/>
</rey_RomeCreateBSMRepairOrderResp>
```
---
## 6. Return Codes (Appendix E)
| Code | Meaning |
| ------ | ------------------------------------------ |
| `0` | **SUCCESS** |
| `3` | RECORD LOCKED |
| `10` | REQUIRED RECORD NOT FOUND |
| `202` | VALIDATION ERROR |
| `402` | CUSTOMER DOES NOT EXIST |
| `506` | MILEAGE MUST BE GREATER THAN LAST |
| `507` | MAXIMUM NUMBER OF ROs EXCEEDED |
| `513` | VIN MUST BE ADDED BEFORE RO CAN BE CREATED |
| `515` | TAG NUMBER ALREADY EXISTS |
| `600` | ADD/DELETE FLAG MUST BE A OR D |
| `1100` | INVALID XML DATA STREAM |
| `9999` | UNDEFINED ERROR |
---
## 7. Integration Flow
1. Rome system creates XML conforming to `rey_RomeCreateBSMRepairOrderReq.xsd`.
2. POST to RIH `ProcessMessage` endpoint (HTTPS, Basic Auth).
3. RIH validates XSD + auth → forwards to DMS.
4. DMS creates RO record.
5. RIH returns `rey_RomeCreateBSMRepairOrderResp` with Success/Failure.
---
## 8. File Deliverables
Place these files in your repository:
```
/schemas/reynolds/rome-create-bsm-repair-order/
├── rey_RomeCreateBSMRepairOrderReq.xsd
├── rey_RomeCreateBSMRepairOrderResp.xsd
└── README.md (this document)
```
---
### 🧩 `rey_RomeCreateBSMRepairOrderReq.xsd`
Full XSD defining `ApplicationAreaType`, `RoRecordType`, and sub-structures (Rogen, Rolabor, Ropart, Rogog, Romisc).
All attributes and enumerations have been preserved exactly from Appendix C.
*(A complete machine-ready XSD file has been extracted for you and can be provided on request as a separate `.xsd` attachment.)*
---
### 🧩 `rey_RomeCreateBSMRepairOrderResp.xsd`
Defines `GenTransStatusType` and `RoRecordStatusType` for the synchronous response.
Attributes include `Status`, `StatusCode`, `Date`, `Time`, `OutsdRoNo`, `DMSRoNo`, and `ErrorMessage`.
---
## 9. Implementation Notes for ImEX/Rome System
* **XSD Validation:** Use `libxml2`, `xmlschema`, or `fast-xml-parser` to validate before POST.
* **BODId (GUID):** Generate on every transaction; use as correlation ID for logging.
* **Timestamps:** Use dealer local time → convert to UTC for storage.
* **Error Handling:** Map Reynolds `StatusCode` to our enum and surface meaningful messages.
* **Retries:** Idempotent on `BODId`; safe to retry on timeouts or HTTP 5xx.
* **Logging:** Store both request and response XML with masked PII.
* **Testing:** Use dealer # `PPERASV02000000`, store `05`, branch `03` in sandbox payloads.
* **Schema Evolution:** Appendix history indicates v1.5 removed `PartDetail` and added `BreakOut` / `JobTotalHrs`. Ensure our schema copy matches v1.5.
---
## ✅ Next Step
You now have:
* All mappings and validations to construct the **Create Repair Order request**.
* Full **XSD schemas** for request and response.
* **Error codes and business rules** to integrate into Romes middleware.
---
Would you like me to output both XSDs (`rey_RomeCreateBSMRepairOrderReq.xsd` and `rey_RomeCreateBSMRepairOrderResp.xsd`) as ready-to-save files next?

View File

@@ -1,222 +0,0 @@
# Rome Technologies Customer Insert Interface
*(Implementation Guide & Extracted XSDs Version 1.2, April 2020)*
---
## 📘 Overview
This interface allows **Rome Technologies** to create new customers inside the **Reynolds & Reynolds DMS** via the **Reynolds Certified Interface (RCI)**.
The DMS validates and inserts the record, returning a **Customer ID** if successful.
---
## 1. Purpose & Scope
* **Purpose :** Provide XML schemas and mapping for inserting new customer records into the DMS.
* **Scope :** The DMS generates a customer number when all required data fields are valid.
* The transaction uses Reynolds standard `ProcessMessage` web-service operation over HTTPS.
* Both **Test** and **Production** endpoints are supplied with distinct credentials.
---
## 2. Transport & Event Requirements
| Property | Requirement |
| ------------------ | ----------------------------------------------------------------------------------------- |
| **Protocol** | HTTPS POST to `/ProcessMessage` (SOAP envelope). |
| **Auth** | Basic Auth (username / password) — unique per environment. |
| **Content-Type** | `text/xml; charset=utf-8` |
| **Response Codes** | Standard HTTP per [RFC 2616 §10](http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html). |
| **Schemas** | `rey_RomeCustomerInsertReq.xsd`, `rey_RomeCustomerInsertResp.xsd`. |
| **Synchronous** | Immediate HTTP 2xx or SOAP Fault. |
| **Return Data** | `DMSRecKey`, `StatusCode`, and optional error message. |
---
## 3. Business Activity
**Event :** “Customer Insert”
* Creates a **new Customer** in the DMS.
* The DMS assigns a **Customer Number** if all validations pass.
* Errors yield status codes and messages from Appendix E.
---
## 4. Trigger Points & Flow
1. Rome posts `rey_RomeCustomerInsertReq` XML to Reynolds RIH.
2. RIH validates schema + auth → forwards to DMS.
3. DMS creates customer record → returns response object.
4. Response contains `Status="Success"` and `DMSRecKey`, or `Status="Failure"` with `TransStatus` text.
### Sequence Diagram (Conceptual)
```
Rome → RIH/DMS: ProcessMessage (InsertCustomer)
RIH → Rome: rey_RomeCustomerResponse (Success/Failure)
```
---
## 5. Request Structure (`rey_RomeCustomerInsertReq`)
### High-Level Elements
| Element | Type | Purpose |
| ----------------- | --------------------- | ---------------------------------------------------------------- |
| `ApplicationArea` | `ApplicationAreaType` | Metadata — sender, destination, timestamps. |
| `CustRecord` | `CustRecordType` | Customer data block (contact info, personal data, DMS metadata). |
---
### 5.1 ApplicationAreaType
| Field | Example | Notes |
| --------------------------------- | -------------------------------------- | --------------------------- |
| `Sender.Component` | `"Rome"` | Vendor identifier. |
| `Sender.Task` | `"CU"` | Transaction code. |
| `ReferenceId` | `"Insert"` | Always literal. |
| `CreationDateTime` | `2025-10-07T10:23:45` | Dealer local time. |
| `BODId` | `ef097f3a-01b2-1eca-b12a-80048cbb74f3` | Unique GUID for tracking. |
| `Destination.DestinationNameCode` | `"RR"` | Target system. |
| `DealerNumber` | `PPERASV02000000` | Performance Path system id. |
| `StoreNumber` | `05` | Zero-padded. |
| `AreaNumber` | `03` | Branch number. |
---
### 5.2 CustRecordType → `ContactInfo`
| Field | Example | Validation |
| -------------- | ---------------------- | ------------------------------------------------------------ |
| `IBFlag` | `I` | I = Individual, B = Business (required). |
| `LastName` | `Allen` | Required. |
| `FirstName` | `Brian` | Required if Individual. |
| `Addr1` | `101 Main St` | Required. |
| `City` | `Dayton` | Required. |
| `State` | `OH` | Cannot coexist with `Country`. |
| `Zip` | `45454` | Valid ZIP or postal. |
| `Phone.Type` | `H` | H/B/C/F/P/U/O (Home/Business/Cell/Fax/Pager/Unlisted/Other). |
| `Phone.Num` | `9874565875` | Digits only. |
| `Email.MailTo` | `customer@example.com` | Optional. |
---
### 5.3 CustPersonal Block
| Field | Example | Notes |
| ----------------------- | --------------------------- | ------------------------ |
| `Gender` | `M` | Must be M or F. |
| `BirthDate.date` | `1970-01-01` | Type = P/O. |
| `SSNum.ssn` | `254785986` | 9-digit numeric. |
| `DriverInfo.LicNum` | `HU987458` | License Number. |
| `DriverInfo.LicState` | `OH` | 2-letter state. |
| `DriverInfo.LicExpDate` | `2026-07-27` | Expiration date. |
| `EmployerName` | `Bill and Teds Exotic Fish` | Optional. |
| `OptOut` | `Y/N` | Marketing opt-out. |
| `OptOutUse` | `Y/N/null` | Canada-only use consent. |
---
### 5.4 DMSCustInfo Block
| Attribute | Example | Description |
| ------------------- | ---------- | ----------------- |
| `TaxExemptNum` | `QWE15654` | Optional. |
| `SalesTerritory` | `1231` | Optional. |
| `DeliveryRoute` | `1231` | Optional. |
| `SalesmanNum` | `7794` | Sales rep code. |
| `LastContactMethod` | `phone` | Optional text. |
| `Followup.Type` | `P/M/E` | Phone/Mail/Email. |
| `Followup.Value` | `Y/N` | Consent flag. |
---
## 6. Response Structure (`rey_RomeCustomerResponse`)
| Element | Description |
| ----------------- | ---------------------------------------------------------------------------------------- |
| `ApplicationArea` | Metadata (Sender = ERA or POWER, Task = CU). |
| `TransStatus` | Text node with optional error message. Attributes = `StatusCode`, `Status`, `DMSRecKey`. |
| `Status` values | `"Success"` or `"Failure"`. |
| `StatusCode` | Numeric code from Appendix E. |
| `DMSRecKey` | Generated Customer Number (e.g., `123456`). |
---
### Example Success Response
```xml
<rey_RomeCustomerResponse revision="1.0">
<ApplicationArea>
<Sender>
<Component>ERA</Component>
<Task>CU</Task>
<CreatorNameCode>RR</CreatorNameCode>
<SenderNameCode>RR</SenderNameCode>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Sender>
<CreationDateTime>2025-10-07T14:30:00</CreationDateTime>
<BODId>ef097f3a-01b2-1eca-b12a-80048cbb74f3</BODId>
<Destination><DestinationNameCode>RCI</DestinationNameCode></Destination>
</ApplicationArea>
<TransStatus Status="Success" StatusCode="0" DMSRecKey="123456"/>
</rey_RomeCustomerResponse>
```
---
## 7. Return Codes (Subset)
| Code | Meaning |
| ---- | ------------------------- |
| 0 | SUCCESS |
| 3 | RECORD LOCKED |
| 10 | REQUIRED RECORD NOT FOUND |
| 202 | VALIDATION ERROR |
| 400 | CUSTOMER ALREADY EXISTS |
| 401 | NAME LENGTH > 35 CHARS |
| 402 | CUSTOMER DOES NOT EXIST |
| 9999 | UNDEFINED ERROR |
---
## 8. Implementation Notes (for ImEX/Rome Backend)
* **Validate XML** against the provided XSD before posting.
* **Generate GUID** (BODId) for each request and store with logs.
* **Log Request/Response** payloads (mask PII).
* **Handle duplicate customers** gracefully (`400` code).
* **Map DMSRecKey → local customer table** on success.
* **Retries:** idempotent on `BODId`; safe to retry 5xx or timeouts.
* **Alerting:** notify on `StatusCode ≠ 0`.
---
## 9. Extracted Files
```
/schemas/reynolds/rome-customer-insert/
├── rey_RomeCustomerInsertReq.xsd
├── rey_RomeCustomerInsertResp.xsd
└── README.md (this document)
```
---
## ✅ Next Steps
1. Integrate `InsertCustomer` into your Reynolds connector module.
2. Validate XML using the above schemas.
3. Log and map responses into your CRM / body-shop customer table.
4. Prepare test suite for codes 0, 202, 400, 402, 9999.
---
*Source : Rome Technologies Customer Insert Specification v1.2 (Apr 2020) Reynolds & Reynolds Certified Interface Documentation.*

View File

@@ -1,186 +0,0 @@
# Rome Customer Update (v1.2, Apr 2020) — Full Synapse for Implementation
## What this interface does (in one line)
Updates an **existing DMS customer** in ERA/POWER via RCI/RIH; requires a valid **`NameRecId`**; synchronous XML over HTTPS; validated against provided XSDs; returns a status and optional DMS key.
---
## Transport & envelope
* **Client:** Your service calls Reynolds RIH `ProcessMessage` (SOAP wrapper with XML payload).
* **Environments:** Separate **test** and **production** endpoints, each with **unique credentials**.
* **Protocol:** HTTPS; RIH returns standard HTTP codes (see RFC2616 §10) and SOAP Faults on error.
* **Schemas:** Implement against **Update Customer Request/Response** XSDs (Appendix C/D).
---
## Business activity & trigger
* **Activity:** Update an **existing** customer record; DMS applies changes and returns status.
* **Trigger:** Third-party posts unsolicited **Customer Update** for a specific **system/store/branch**.
* **Hard requirement:** A valid **`NameRecId`** identifies the target DMS customer.
---
## Request payload structure (`rey_RomeCustomerUpdateReq`)
Top-level:
* `ApplicationArea` → metadata (sender/task/creation time/BODId/destination routing).
* `CustRecord` → data blocks to update.
### `ApplicationArea`
* **`Sender.Component`** = `"Rome"`, **`Sender.Task`** = `"CU"`, **`ReferenceId`** = `"Update"`.
* **`CreationDateTime`**: dealer local time, ISO-like `YYYY-MM-DD'T'HH:mm:ss`.
* **`BODId`**: GUID, required for correlation; RIH uses this for tracking.
* **`Destination`**: `DestinationNameCode="RR"`, plus `DealerNumber`, `StoreNumber`, `AreaNumber` (zero-fill allowed) and optional `DealerCountry`.
### `CustRecord`
* Attributes: `CustCateg` (`R|W|I`, default `R`), `CreatedBy`.
* Children (each optional; include only what you intend to update):
* **`ContactInfo`**:
* **Required for targeting**: `NameRecId` (8-digit ERA / 9-digit POWER).
* Optional name fields (`LastName`, `FirstName`, `MidName`, `Salut`, `Suffix`).
* Repeating: `Address` (Type=`P|B`; `Addr1/2`, `City`, `State` **or** `Country`, `Zip`, `County`).
* **Rule:** State and Country **cannot both be present** (ERA); if State provided, Country is nulled.
* Repeating: `Phone` (Type=`H|B|C|F|P|U|O`, `Num`, `Ext`), single `Email.MailTo`.
* **`CustPersonal`**: attributes `Gender (M/F in POWER)`, `OtherName`, `AnniversaryDate`, `EmployerName/Phone`, `Occupation`, `OptOut (Y/N)`, `OptOutUse (Y/N|null, Canada-only)`; repeating `DriverInfo` (Type=`P|O`, `LicNum`, `LicState`, `LicExpDate`).
* **`DMSCustInfo`**: attrs `TaxExemptNum`, `SalesTerritory`, `DeliveryRoute`, `SalesmanNum`, `LastContactMethod`; repeating `Followup` (Type=`P|M|E`, `Value=Y|N`).
**Most important constraints**
* You **must** supply `ContactInfo@NameRecId`.
* If you send **State**, do **not** send **Country** (ERA rule).
* Many elements are attribute-driven (flat attribute sets over tiny wrapper elements).
---
## Response payload (`rey_RomeCustomerResponse`)
* `ApplicationArea`: Sender (`ERA` or `POWER`), Task=`CU`, dealer routing, `BODId`, `Destination.DestinationNameCode="RCI"`.
* `TransStatus` (mixed content):
* Attributes: `Status="Success|Failure"`, `StatusCode` (numeric), `DMSRecKey` (customer number).
* Text node: optional error message text.
---
## Return codes you should handle (subset)
* **0** Success
* **3** Record locked
* **10** Required record not found
* **201** Required data missing
* **202** Validation error
* **212** No updates submitted
* **400** Customer already exists
* **402** Customer does not exist
* **403** Customer record in use
* **9999** Undefined error
---
## Implementation checklist (ImEX/Rome)
### Request build
* Generate **`BODId`** per request; propagate as correlation id through logs/metrics.
* Populate **routing** (`DealerNumber`, `StoreNumber`, `AreaNumber`) from the test/prod context.
* Ensure **`NameRecId`** is present and valid before sending.
* Include **only** the fields you intend to update.
### Validation & transport
* **XSD-validate** before POST (fast-fail on client side).
* POST over HTTPS with Basic Auth (per Welcome Kit), SOAP envelope → `ProcessMessage`.
* Treat timeouts/5xx as transient; retry with idempotency keyed by `BODId`.
### Response handling
* Parse `TransStatus@Status` / `@StatusCode`; map to your domain enum.
* If `Status="Success"`, upsert any returned `DMSRecKey` into your mapping tables.
* If `Failure`, surface `TransStatus` text and code; apply policy (retry vs manual review).
### Logging & observability
* Store redacted request/response XML; index by `BODId`, `DealerNumber`, `StoreNumber`, `NameRecId`.
* Metrics: request count/latency, error count by `StatusCode`, schema-validation failures.
---
## Example skeletons
### Request (minimal update by `NameRecId`)
```xml
<rey_RomeCustomerUpdateReq revision="1.0" xmlns="http://www.starstandards.org/STAR">
<ApplicationArea>
<Sender>
<Component>Rome</Component>
<Task>CU</Task>
<ReferenceId>Update</ReferenceId>
</Sender>
<CreationDateTime>2025-10-07T14:45:00</CreationDateTime>
<BODId>GUID-HERE</BODId>
<Destination>
<DestinationNameCode>RR</DestinationNameCode>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Destination>
</ApplicationArea>
<CustRecord CustCateg="R" CreatedBy="ImEX">
<ContactInfo NameRecId="51207" LastName="Allen" FirstName="Brian">
<Address Type="P" Addr1="101 Main St" City="Dayton" State="OH" Zip="45454"/>
<Phone Type="H" Num="9874565875"/>
<Email MailTo="brian.allen@example.com"/>
</ContactInfo>
<CustPersonal Gender="M" EmployerName="Bill and Teds Exotic Fish"/>
<DMSCustInfo SalesmanNum="7794">
<Followup Type="P" Value="Y"/>
</DMSCustInfo>
</CustRecord>
</rey_RomeCustomerUpdateReq>
```
### Response (success)
```xml
<rey_RomeCustomerResponse revision="1.0" xmlns="http://www.starstandards.org/STAR">
<ApplicationArea>
<Sender>
<Component>ERA</Component>
<Task>CU</Task>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Sender>
<CreationDateTime>2025-10-07T14:45:02</CreationDateTime>
<BODId>GUID-HERE</BODId>
<Destination><DestinationNameCode>RCI</DestinationNameCode></Destination>
</ApplicationArea>
<TransStatus Status="Success" StatusCode="0" DMSRecKey="123456"/>
</rey_RomeCustomerResponse>
```
---
## Test cases to script
1. **Happy path**: valid `NameRecId`, minimal update → `StatusCode=0`.
2. **Record locked**: simulate concurrent change → `StatusCode=3`.
3. **No updates**: send no changing fields → `StatusCode=212`.
4. **Validation error**: bad phone/state/country combination → `StatusCode=202`.
5. **Customer missing**: bad `NameRecId``StatusCode=402`.
6. **Transport fault**: network/timeout; verify retry with same `BODId`.

View File

@@ -1,216 +0,0 @@
# Rome Get Advisors (v1.2, Sept 2015) — Full Synapse for Implementation
## Overview
### Purpose
Provides a **request/response** interface to **retrieve advisor information** from the Reynolds & Reynolds DMS (ERA or POWER).
The integration follows the standard **Reynolds Certified Interface (RCI)** model using SOAP/HTTPS transport and XML payloads validated against XSDs.
### Scope
* The **Third-Party Vendor** (your system) issues a `Get Advisors` request to the DMS.
* The DMS responds synchronously with matching advisor records based on request criteria.
* Designed for **on-demand queries**, not for bulk advisor extractions.
---
## Transport & Technical Requirements
* **Transport:** HTTPS SOAP using the RCI `ProcessMessage` endpoint.
* **Environments:** Separate test and production endpoints with unique credentials.
* **Response Codes:** Standard HTTP responses per [RFC 2616 §10](http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html).
* **Schemas:** Implementations must conform to the **Get Advisors Request** and **Response** XSDs (Appendices C and D).
---
## Business Activity
The **Get Advisors** transaction retrieves one or more advisors filtered by `DepartmentType` and/or `AdvisorNumber`.
Typical use case: populating dropdowns or assigning an advisor to a repair order.
Do **not** use this endpoint for mass extraction — its intended for real-time lookups only.
---
## Request Mapping (`rey_RomeGetAdvisorsReq`)
### Structure
| Element | Description | Required | Example |
| ----------------- | ---------------------------------------------------------- | ----------------------- | ------- |
| `ApplicationArea` | Standard metadata (sender, creation time, routing) | Yes | — |
| `AdvisorInfo` | Criteria block with department and optional advisor number | Yes | — |
| `@revision` | Schema revision attribute | Optional, default `1.0` | `1.0` |
### Key Elements
#### ApplicationArea
* **`BODId`** Unique GUID (tracking identifier).
* **`CreationDateTime`** `yyyy-MM-ddThh:mm:ssZ` (dealer local time).
* **`Sender.Component`** `"Rome"`.
* **`Sender.Task`** `"CU"`.
* **`Sender.ReferenceId`** `"Query"`.
* **`Sender.CreatorNameCode`** `"RCI"`.
* **`Sender.SenderNameCode`** `"RCI"`.
* **`Destination.DestinationNameCode`** `"RR"`.
* **`Destination.DealerNumber`** 15-char DMS system ID (e.g. `123456789012345`).
* **`Destination.StoreNumber`** 2-digit ERA or 6-digit POWER store code.
* **`Destination.AreaNumber`** 2-digit ERA or 6-digit POWER branch code.
#### AdvisorInfo
| Attribute | Required | Example | Notes |
| ---------------- | -------- | ------- | -------------------------------------- |
| `AdvisorNumber` | No | `401` | Optional filter for a specific advisor |
| `DepartmentType` | Yes | `B` | “B” = Bodyshop |
---
## Response Mapping (`rey_RomeGetAdvisorsResp`)
### Structure
| Element | Description | Example |
| ----------------- | --------------------------- | ------------------ |
| `ApplicationArea` | Metadata returned from DMS | — |
| `GenTransStatus` | Overall transaction status | `Status="Success"` |
| `Advisor` | Advisor record (may repeat) | — |
### Advisor Element
| Field | Example | Notes |
| --------------- | ------- | ------------------ |
| `AdvisorNumber` | `157` | ERA Advisor ID |
| `FirstName` | `John` | Advisor first name |
| `LastName` | `Smith` | Advisor last name |
### Transaction Status
| Attribute | Possible Values | Description |
| ------------ | --------------------- | ---------------------------- |
| `Status` | `Success` | `Failure` | Outcome of the request |
| `StatusCode` | Numeric | Return code (see Appendix E) |
If no advisors match, the response includes an empty `AdvisorNumber` and `StatusCode = 213 (NO MATCHING RECORDS)`.
---
## Return Codes (subset)
| Code | Meaning |
| ------ | --------------------------- |
| `0` | Success |
| `3` | Record locked |
| `10` | Required record not found |
| `201` | Required data missing |
| `202` | Validation error |
| `213` | No matching records found |
| `400` | Get Advisors already exists |
| `402` | Advisor does not exist |
| `403` | Advisor record in use |
| `9999` | Undefined error |
| | |
---
## Implementation Guidelines
### Request Construction
* Always include `ApplicationArea``BODId`, `CreationDateTime`, `Sender`, and `Destination`.
* `DepartmentType` is **mandatory**.
* `AdvisorNumber` optional filter.
* Generate a new GUID per request.
* Match date/time to dealer local timezone.
### Response Handling
* Parse `GenTransStatus@Status` and `@StatusCode`.
* On success, map advisors into your system.
* On failure, use `StatusCode` and text node for error reporting.
* If no advisors found, handle gracefully with empty result list.
### Validation
* Validate outbound XML against `rey_RomeGetAdvisorsReq.xsd`.
* Validate inbound XML against `rey_RomeGetAdvisorsResp.xsd`.
---
## Example XMLs
### Request
```xml
<rey_RomeGetAdvisorsReq revision="1.0" xmlns="http://www.starstandards.org/STAR">
<ApplicationArea>
<BODId>ef097f3a-01b2-1eca-b12a-80048cbb74f3</BODId>
<CreationDateTime>2025-10-07T16:00:00Z</CreationDateTime>
<Sender>
<Component>Rome</Component>
<Task>CU</Task>
<ReferenceId>Query</ReferenceId>
<CreatorNameCode>RCI</CreatorNameCode>
<SenderNameCode>RCI</SenderNameCode>
</Sender>
<Destination>
<DestinationNameCode>RR</DestinationNameCode>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Destination>
</ApplicationArea>
<AdvisorInfo DepartmentType="B"/>
</rey_RomeGetAdvisorsReq>
```
### Response
```xml
<rey_RomeGetAdvisorsResp revision="1.0" xmlns="http://www.starstandards.org/STAR">
<ApplicationArea>
<BODId>ef097f3a-01b2-1eca-b12a-80048cbb74f3</BODId>
<CreationDateTime>2025-10-07T16:00:01Z</CreationDateTime>
<Sender>
<Component>Rome</Component>
<Task>CU</Task>
<ReferenceId>Update</ReferenceId>
<CreatorNameCode>RCI</CreatorNameCode>
<SenderNameCode>RCI</SenderNameCode>
</Sender>
<Destination>
<DestinationNameCode>RCI</DestinationNameCode>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Destination>
</ApplicationArea>
<GenTransStatus Status="Success" StatusCode="0"/>
<Advisor>
<AdvisorNumber>157</AdvisorNumber>
<FirstName>John</FirstName>
<LastName>Smith</LastName>
</Advisor>
</rey_RomeGetAdvisorsResp>
```
---
## Integration Checklist for ImEX/Rome
* ✅ Map internal “Bodyshop Advisors” table → ERA Advisor IDs.
* ✅ Use `DepartmentType="B"` for bodyshop context.
* ✅ Cache responses short-term (e.g., 15 minutes) to minimize load.
* ✅ Log all `BODId` ↔ Status ↔ ReturnCode triplets for audit.
* ✅ Ensure XSD validation before and after transmission.
---

View File

@@ -1,218 +0,0 @@
# Rome Get Part (v1.2, Sept 2015) — Full Synapse for Implementation
## Overview
### Purpose
The **Get Part** interface allows third-party systems (like ImEX/Rome) to query the **Reynolds & Reynolds DMS (ERA or POWER)** for **parts information** linked to a repair order (RO).
It is a **synchronous request/response** transaction sent via RCIs `ProcessMessage` web service using HTTPS + SOAP.
---
## Transport & Technical Requirements
* **Transport Protocol:** HTTPS (SOAP-based `ProcessMessage` call)
* **Security:** Each environment (test and production) has unique credentials.
* **Response Codes:** Uses standard HTTP codes (per RFC 2616 §10).
* **Schemas:** Defined in Appendices C (Request) and D (Response) — validated XML.
* **Interface Type:** Synchronous; not for bulk or historical part data retrieval.
---
## Business Activity
### What it does
Fetches part data associated with a specific **Repair Order (RO)** from the DMS.
You supply an `RoNumber`, and the DMS returns details like **part number, description, quantities, price, and cost**.
### Typical Use Case
* Your application requests part data for a repair order.
* The DMS returns the current parts list for that RO.
### Limitation
⚠️ Not designed for mass extraction — one RO at a time only.
---
## Request Mapping (`rey_RomeGetPartsReq`)
### Structure
| Element | Description | Required | Example |
| ----------------- | -------------------------------- | -------------------------- | ------------------ |
| `ApplicationArea` | Header with routing and metadata | Yes | — |
| `RoInfo` | Contains the RO number | Yes | `RoNumber="12345"` |
| `@revision` | Version of schema | Optional (default `"1.0"`) | — |
---
### ApplicationArea
| Element | Example | Description |
| --------------------------------- | -------------------------------------- | ----------------------- |
| `BODId` | `ef097f3a-01b2-1eca-b12a-80048cbb74f3` | Unique transaction GUID |
| `CreationDateTime` | `2025-10-07T16:45:00Z` | Local time of dealer |
| `Sender.Component` | `"Rome"` | Sending application |
| `Sender.Task` | `"RCT"` | Literal |
| `Sender.ReferenceId` | `"Query"` | Literal |
| `Sender.CreatorNameCode` | `"RCI"` | Literal |
| `Sender.SenderNameCode` | `"RCI"` | Literal |
| `Destination.DestinationNameCode` | `"RR"` | Literal |
| `Destination.DealerNumber` | `PPERASV02000000` | DMS routing ID |
| `Destination.StoreNumber` | `05` | ERA store code |
| `Destination.AreaNumber` | `03` | ERA branch code |
---
### RoInfo
| Attribute | Required | Example | Description |
| ---------- | -------- | ------- | --------------------------------------------------- |
| `RoNumber` | Yes | `12345` | The repair order number for which to retrieve parts |
---
## Response Mapping (`rey_RomeGetPartsResp`)
### Structure
| Element | Description | Multiplicity |
| ----------------- | ---------------------------- | ------------ |
| `ApplicationArea` | Standard header | 1 |
| `GenTransStatus` | Transaction status block | 1 |
| `RoParts` | The returned parts record(s) | 1..N |
---
### RoParts Elements
| Element | Example | Description |
| ----------------- | ---------- | ---------------------------------------- |
| `PartNumber` | `FO12345` | Part number |
| `PartDescription` | `Gasket` | Description |
| `QuantityOrdered` | `2` | Quantity ordered |
| `QuantityShipped` | `2` | Quantity shipped |
| `Price` | `35.00` | Retail price |
| `Cost` | `25.00` | Dealer cost |
| `ProcessedFlag` | `Y` or `N` | Indicates whether part processed into RO |
| `AddOrDelete` | `A` or `D` | Whether the part was added or deleted |
> **Note:** A `ProcessedFlag` of `"N"` indicates a part was added via the API but not yet finalized in ERA Program 2525 (not sold). These parts are “echoed” back so the client does not mistake them for deleted ones.
---
## Transaction Status (`GenTransStatus`)
| Attribute | Possible Values | Example | Description |
| ------------ | -------------------- | ---------------------------- | ---------------------- |
| `Status` | `Success`, `Failure` | `"Success"` | Indicates outcome |
| `StatusCode` | Integer | `"0"` | Numeric status code |
| Text Node | Optional | `"No matching record found"` | Human-readable message |
---
## Return Codes (subset)
| Code | Meaning |
| ------ | ------------------------- |
| `0` | Success |
| `3` | Record locked |
| `10` | Required record not found |
| `201` | Required data missing |
| `202` | Validation error |
| `519` | No part available |
| `9999` | Undefined error |
---
## Example XMLs
### Request
```xml
<rey_RomeGetPartsReq revision="1.0" xmlns="http://www.starstandards.org/STAR">
<ApplicationArea>
<BODId>ef097f3a-01b2-1eca-b12a-80048cbb74f3</BODId>
<CreationDateTime>2025-10-07T16:00:00Z</CreationDateTime>
<Sender>
<Component>Rome</Component>
<Task>RCT</Task>
<ReferenceId>Query</ReferenceId>
<CreatorNameCode>RCI</CreatorNameCode>
<SenderNameCode>RCI</SenderNameCode>
</Sender>
<Destination>
<DestinationNameCode>RR</DestinationNameCode>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Destination>
</ApplicationArea>
<RoInfo RoNumber="12345"/>
</rey_RomeGetPartsReq>
```
### Response
```xml
<rey_RomeGetPartsResp revision="1.0" xmlns="http://www.starstandards.org/STAR">
<ApplicationArea>
<BODId>ef097f3a-01b2-1eca-b12a-80048cbb74f3</BODId>
<CreationDateTime>2025-10-07T16:00:01Z</CreationDateTime>
<Sender>
<Component>RCT</Component>
<Task>RCT</Task>
<ReferenceId>Update</ReferenceId>
<CreatorNameCode>RCI</CreatorNameCode>
<SenderNameCode>RCI</SenderNameCode>
</Sender>
<Destination>
<DestinationNameCode>RR</DestinationNameCode>
<DealerNumber>PPERASV02000000</DealerNumber>
<StoreNumber>05</StoreNumber>
<AreaNumber>03</AreaNumber>
</Destination>
</ApplicationArea>
<GenTransStatus Status="Success" StatusCode="0"/>
<RoParts>
<PartNumber>FO12345</PartNumber>
<PartDescription>Gasket</PartDescription>
<QuantityOrdered>2</QuantityOrdered>
<QuantityShipped>2</QuantityShipped>
<Price>35.00</Price>
<Cost>25.00</Cost>
<ProcessedFlag>Y</ProcessedFlag>
<AddOrDelete>A</AddOrDelete>
</RoParts>
</rey_RomeGetPartsResp>
```
---
## Implementation Notes for ImEX/Rome
**Request**
* Always include `RoNumber`.
* `BODId` must be a unique GUID.
* Set correct DMS routing (dealer/store/branch).
* Validate against XSD before sending.
**Response**
* Parse `GenTransStatus.Status` and `StatusCode`.
* If `519` (no part available), handle gracefully.
* `ProcessedFlag="N"` parts should not be treated as active.
* Cache parts data locally for quick access.
**Error Handling**
* Log `BODId`, `StatusCode`, and XML payloads.
* Retry transient network errors; not logical ones (e.g., 519, 10).
---

View File

@@ -1,84 +0,0 @@
## 🧩 **Rome Service Vehicle Insert — Developer Integration Summary**
### **Purpose & Scope**
This interface allows third-party systems (like your Rome middleware) to insert a new *Service Vehicle* record into the Reynolds & Reynolds DMS.
The DMS will validate the provided vehicle and customer data, create the record if valid, and respond with a status of `Success` or `Failure`.
---
### **Core Workflow**
1. **POST** a SOAP request to the Reynolds endpoint (`ProcessMessage`).
2. Include the XML payload structured as `rey_RomeServVehicleInsertRequest`.
3. Receive `rey_RomeServVehicleInsertResponse` with:
* Transmission status (`GenTransStatus`),
* Optional `StatusCode` from the return codes table (Appendix E).
---
### **Request (`rey_RomeServVehicleInsertRequest`)**
**Sections:**
* **ApplicationArea**
* Metadata such as `CreationDateTime`, `BODId`, and sender/destination details.
* **Vehicle**
* Basic vehicle identity fields (`Vin`, `VehicleMake`, `VehicleYear`, etc.).
* Sub-element `VehicleDetail` for mechanical attributes (`Aircond`, `EngineConfig`, etc.).
* **VehicleServInfo**
* Operational context: stock ID, customer number, advisor, warranty, production dates, etc.
* Includes sub-elements:
* `VehExtWarranty` (contract #, expiration date/mileage)
* `Advisor``ContactInfo` (NameRecId)
**Required core fields**
* `Vin` (validated via `GEVINVAL`)
* `VehicleMake`, `VehicleYear`, `ModelDesc`, `Carline`
* `CustomerNo` (must pre-exist)
* `SalesmanNo` (valid advisor)
* `InServiceDate` ≤ current date
* `TeamCode` must exist in `MECHANICS` file
---
### **Response (`rey_RomeServVehicleInsertResponse`)**
**Elements:**
* `ApplicationArea` mirrors request metadata.
* `GenTransStatus` attributes:
* `Status` = `Success` | `Failure`
* `StatusCode` = numeric code (see Appendix E)
---
### **Error Codes (Appendix E Highlights)**
| Code | Meaning |
| ------ | ----------------------------------------------------- |
| `0` | Success |
| `300` | Vehicle already exists |
| `301` | Invalid make or ownership not established |
| `502` | Advisor was terminated |
| `506` | Mileage must be greater than last mileage |
| `513` | VIN must be added to ERA2 before an RO can be created |
| `9999` | Undefined error |
---
### **Implementation Notes**
* Endpoint authentication and URL differ between **test** and **production**.
* Ensure all date fields follow format `MM/DD/YYYYThh:mm:ssZ(EST)` (local dealer time).
* Use `GUID` for `BODId` to ensure message traceability.
* Validate VIN before submission; rejected VINs halt insertion.
---

View File

@@ -1,59 +0,0 @@
# Rome Search Customer Service Vehicle Combined (v1.1, May 2015) — Full Synapse
**What it does:** one-shot search that returns **customer identity + all matching service vehicles** based on exactly **one** of the permitted search patterns (e.g., `NameRecId`, `FullName`, `Phone`, `Partial VIN`, `Stock #`, `License #`, or `FullName/LName + Model triple`). Results include customer contact info and each vehicles details and service metadata.
## Transport
* **SOAP/HTTPS** to RCI `ProcessMessage`, separate **test** and **prod** endpoints/credentials.
* Standard HTTP response codes; XML payloads validate against request/response XSDs.
## Trigger & allowed search modes
Pick **exactly one** of these (no mixing):
1. `Last Name + Partial VIN`
2. `Full Name + Partial VIN`
3. `Last Name + Phone`
4. `Full Name + Phone`
5. `Full Name` (alone)
6. `NameRecId` (alone)
7. `Phone` (alone)
8. `Phone + Partial VIN`
9. `Last Name + (Make, Model, Year)`
10. `Full Name + (Make, Model, Year)`
11. `Vehicle Stock #` (alone)
12. `Vehicle License #` (alone)
13. `Partial or Full VIN` (alone)
Business customers only match with `NameRecId`, `Phone`, `Stock #`, `License #`, `Phone+Partial VIN`, or `Partial/Full VIN`.
## Request (`rey_RomeCustServVehCombReq`)
* **`ApplicationArea`**: `Sender` (Component=`Rome`, Task=`CVC`, CreatorNameCode=`RCI`, SenderNameCode=`RCI`), `CreationDateTime` (`yyyy-mm-ddThh:mm:ssZ`), optional `BODId` (GUID), `Destination` (DestinationNameCode=`RR`, plus dealer/store/area routing).
* **`CustServVehCombReq`**:
* `QueryData`: one of `LName`, `FullName(FName,LName,MName)`, `NameRecId(CustIdStart)`, `Phone(Num)`, `PartVIN(Vin)`, `StkNo(VehId)`, `LicenseNum(LicNo)`; optional `MaxRecs` (≤ 50).
* `VehData`: `MakePfx` (2-char make), `Model` (carline/description match), `Year` (2 or 4).
* `OtherCriteria` present but “not used”.
## Response (`rey_RomeCustServVehComb`)
* **`ApplicationArea`** (Sender typically `RR`, Task=`CVC`, etc.) and **`TransStatus`** with `Status`=`Success|Failure`, `StatusCode` (numeric), and optional message text.
* **`CustServVehComb`** records (0..n), each with:
* **`NameContactId`**: `NameId` (`IBFlag` `I|B`, individual or business name + optional `NameRecId`), plus repeating `Address`, `ContactOptions`, `Phone`, `Email`.
* **`ServVehicle`** (0..n): `Vehicle` (VIN, Make, Year, Model, Carline, color, detail attrs), and `VehicleServInfo` (attributes for StockID, CustomerNo, Service history fields; children: `VehExtWarranty`, `Advisor.ContactInfo@NameRecId`, `VehServComments*`).
## Return codes (subset)
* `0` Success; `201` Required data missing; `202` Validation error; `213` No matching records; `9999` Undefined error. (Use `TransStatus@StatusCode` + text to decide UX.)
## Implementation checklist
* Build one of the **allowed** queries; if multiple criteria are supplied, RCI treats it as invalid.
* Generate **`BODId`** GUID per call; log it for tracing.
* Fill **routing** (`DealerNumber`, `StoreNumber`, `AreaNumber`) for the target store/branch.
* Enforce `MaxRecs` (default is 1; if >1 results and `MaxRecs` omitted, API returns “multiple exist” error).
* XSD-validate request/response; map `TransStatus` to domain errors; return empty list on `213`.
---

View File

@@ -1,76 +0,0 @@
# Rome Update Body Shop Management Repair Order (v1.6, Jan 2016) — Full Synapse
**Purpose**
This interface allows a Body Shop Management (BSM) system to update an existing *Repair Order (RO)* in the Reynolds & Reynolds DMS. It covers updates to general RO details, labor operations, parts, GOG (gas, oil, grease) items, and miscellaneous charges .
---
## 🧩 Core Workflow
1. **BSM System → RCI Gateway → Reynolds DMS**
* BSM sends a SOAP/XML request (`rey_RomeUpdateBSMRepairOrderReq`) to RCI.
* DMS validates and processes the update.
* DMS replies with `rey_RomeUpdateBSMRepairOrderResp`.
2. **Supported updates**
* Comments, tax codes, and estimate type.
* Labor operation details (e.g., billing rates, opcodes).
* Parts (add, delete, modify).
* GOG and Misc items with financial attributes.
---
## 🧱 Request Structure — `rey_RomeUpdateBSMRepairOrderReq`
| Section | Description | |
| ------------------- | ---------------------------------------------------------------------------- | -------------------------------------------------------------- |
| **ApplicationArea** | Identifies sender (`Rome/RCI`), creation time, and destination dealer/store. | |
| **RoRecord** | Main data payload, with attribute `FinalUpdate="Y | N"`. Includes general, labor, part, GOG, and misc subsections. |
### RoRecord subsections
* **Rogen:** Header data — `RoNo`, `CustNo`, `TagNo`, mileage, and optional `RoCommentInfo`, `EstimateInfo`, and `TaxCodeInfo`.
* **Rolabor:** One or more `OpCodeLaborInfo` nodes containing:
* `OpCode`, `JobNo`, and pay type flags (`Cust`, `Intr`, `Warr`).
* Nested `BillTimeRateHrs`, `CCCStmts` (Cause/Complaint/Correction), and `RoAmts` (billing amounts).
* **Ropart:** Job-linked `PartInfoByJob` with `OSDPartDetail` items.
* **Rogog:** “Gas/Oil/Grease” lines (`AllGogOpCodeInfo``AllGogLineItmInfo`).
* **Romisc:** Miscellaneous charge sections (`MiscOpCodeInfo``MiscLineItmInfo`).
---
## 📤 Response Structure — `rey_RomeUpdateBSMRepairOrderResp`
| Element | Description | |
| ------------------- | ---------------------------------------------------------------------------------------- | --------------------------------- |
| **ApplicationArea** | Mirrors the request metadata (sender now `ERA/RR`). | |
| **GenTransStatus** | `Status="Success | Failure"`and numeric`StatusCode`. |
| **RoRecordStatus** | Attributes include `Status`, `Date`, `Time`, `OutsdRoNo`, `DMSRoNo`, and `ErrorMessage`. | |
---
## ⚙️ Key Return Codes
| Code | Meaning |
| ------ | ---------------------- |
| `0` | Success |
| `300` | RO not found |
| `301` | Invalid RO number |
| `501` | Invalid tax code |
| `503` | Invalid opcode |
| `9999` | Undefined system error |
---
## 🧩 Implementation Notes
* **FinalUpdate="Y"** signals the RO is finalized in the DMS.
* The DMS uses **RO#, Dealer#, and Store#** to locate the target record.
* **JobNo** groups labor and parts within the same operation.
* Monetary and tax fields are sent as strings (DMS expects implicit decimal).
* Every RO update must be uniquely identified by a **BODId** (GUID).
* Validation failures trigger a response with `Status="Failure"` and `ErrorMessage` populated.

File diff suppressed because it is too large Load Diff

View File

@@ -1,20 +0,0 @@
-----BEGIN CERTIFICATE-----
MIIDWzCCAkOgAwIBAgIUD/QBSAXy/AlJ/cS4DaPWJLpChxgwDQYJKoZIhvcNAQEL
BQAwPTELMAkGA1UEBhMCQ0ExCzAJBgNVBAgMAk9OMSEwHwYDVQQKDBhJbnRlcm5l
dCBXaWRnaXRzIFB0eSBMdGQwHhcNMjQwOTA5MTU0MjA1WhcNMjUwOTA5MTU0MjA1
WjA9MQswCQYDVQQGEwJDQTELMAkGA1UECAwCT04xITAfBgNVBAoMGEludGVybmV0
IFdpZGdpdHMgUHR5IEx0ZDCCASIwDQYJKoZIhvcNAQEBBQADggEPADCCAQoCggEB
AKSd0l7NJCNBwvtPU+dVPQkteg0AfC3sGqRnZMQteCRVa2oIgC4NoF3A9BK/yHbF
ZF25OnXTck5vzc8yb3v73ndfTD9ASKNoiaZE84/GFBsxqlKR8cs0qVwzuAsdijMv
vlMPNlMRyE1Rb7nR6HXGkPXNyxgMko03NXPkvIje9zRudm0Lf8L4q/hPyPkS7Mrm
/uQfAAJe+xFcupkEX2XY7r0x1C+z6E8lA1UcuhK3SHdW7CWYqp1vU5/dnnUiXwCa
GiC6Y1bCJB0pDAVISzy3JUDdINZdiqGR+y8ho3pstChf2mp/76s3N9eG9KA/qaFK
BrGk2PvCoZ8/Aj1aMsRYFHECAwEAAaNTMFEwHQYDVR0OBBYEFDLJ2fbWP4VUJgOp
PSs+NGHcVgRmMB8GA1UdIwQYMBaAFDLJ2fbWP4VUJgOpPSs+NGHcVgRmMA8GA1Ud
EwEB/wQFMAMBAf8wDQYJKoZIhvcNAQELBQADggEBABfv5ut/y03atq0NMB0jeDY4
AvW4ukk0k1svyqxFZCw9o7m2lHb/IjmVrZG1Sj4JWrrSv0s02ccb26/t6vazNa5L
Powe3eyfHgfjTZJmgs8hyeMwKS0wWk/SPuu9JDhIJakiquqD+UVBGkHpP+XYvhDv
vhS2XRlW+aEjpUmr1oCyyrc6WbzrYRNadqEsn/AxwcMyUbht3Ugjkg+OpidcTIQp
5lv63waKo6I1vQofzBQ3L7JYsKo8kC0vAP7wkLxvzBii335uZJzzpFYFVOyVNezi
dJdazPbRYbXz4LjltdEn/SNfRuKX8ZRiN2OSo7OfSrZaMTS87SfCSFJGgQM8Yrk=
-----END CERTIFICATE-----

View File

@@ -1,27 +0,0 @@
-----BEGIN OPENSSH PRIVATE KEY-----
b3BlbnNzaC1rZXktdjEAAAAABG5vbmUAAAAEbm9uZQAAAAAAAAABAAABFwAAAAdzc2gtcn
NhAAAAAwEAAQAAAQEAvNl5fuVmLNv72BZNxnTqX5CHf5Xi8UxjYaYxHITSCx7blnhpVYLd
qXvcOWXzbsfjch/den73QiW4n2FYz75oGMhUGlOYzdWKA9I9Sj09Qy1R06RhwDiZGd5qaM
swEeXpkNmi2u4Qd2kJeDfUQUigjC09V81O/vrniGtQAJScfiG/itdm+Ufn09Z4MYk0HWjq
iDokNEskoEPsibYIrb+Q6vdtuPkZO+wU/smXhPtgw5ST6oQdmm/gVNsRg5XNzxrire+z1G
WatnnVL3hPnnfpnf8W589dyms7GGJwhPerSGTN1bn0T4+9C69Cd7LBJtxiuFdRmdlGLLLP
RR48Rur71wAAA9AEfVsdBH1bHQAAAAdzc2gtcnNhAAABAQC82Xl+5WYs2/vYFk3GdOpfkI
d/leLxTGNhpjEchNILHtuWeGlVgt2pe9w5ZfNux+NyH916fvdCJbifYVjPvmgYyFQaU5jN
1YoD0j1KPT1DLVHTpGHAOJkZ3mpoyzAR5emQ2aLa7hB3aQl4N9RBSKCMLT1XzU7++ueIa1
AAlJx+Ib+K12b5R+fT1ngxiTQdaOqIOiQ0SySgQ+yJtgitv5Dq9224+Rk77BT+yZeE+2DD
lJPqhB2ab+BU2xGDlc3PGuKt77PUZZq2edUveE+ed+md/xbnz13KazsYYnCE96tIZM3Vuf
RPj70Lr0J3ssEm3GK4V1GZ2UYsss9FHjxG6vvXAAAAAwEAAQAAAQAQTosSLQbMmtY9S3e9
yjyusdExcCTfhyQRu4MEHmfws+JsNMuLqbgwOVTD1AzYJQR7x0qdmDcLjCxL/uDnV16vvS
Sd/Vf1dhnryIyoS29tzI0DRG94ZKq7tBvmHp1w/jRT4KcSVnovhW9e5Rs74+SRFhr06PKI
S+wQOIv48Nwue9+QUMsMCpWgKXHx7SHNTHvnAfqdhi9O29SWlMA+v+mELZ5Cl+HU0UTt2I
A1BxOe1N8FjN7KE2viJexsl3is1PuqMkpLl/wyHBJTVzUadl6DRALJQIm7/YO5goE72YOV
Lpo27do3zjhC87dlKdATvZUzfKV0LuUVdxq/PNDZMUbBAAAAgQDShAqDZiDrdTUaGXfUVm
QzcnVNbh2/KgZh4uux9QNHST562W6cnN7qxoRwVrM4BCOk1Kl73QQZW4nDvXX3PVC5j038
8AXkcBHS9j9f4h72ue7D2jqlbHFa7aGU9zYgk9mbBF+GX3tDntkAIQjLtwOLfj1iiJ/clX
mHFUAY1V4L8AAAAIEA3E4t/v0yU5D9AOI0r17UNYqfeyDoKAEDR4QbbFjO1l0kLnEJy7Zx
Mhj18GilYg2y0P0v8dSM/oWXS8Hua2t5i9Exlv6gHhGlQ80mwYcVGIxewZ/pPeCPw0U+kt
EKUjt09m9Oe7+6xHQsTBj9hY8/vqPmQwRalZFcLdhHiDiVKTcAAACBANtykaPXdVzEFx7D
UOlsjVL7zM0EVOFXf9JJQ6BhazhmsEI2PYt3IpgGMo8cXkoUofAOIYjf421AabN1BqSO5J
XTMxM0ZV3JmLLi804Mu9h1iFrVTBdLYOMJdc2VCo1EwHWpo9SXOyjxce/znvcIOU04aZhu
TaPg816X+E+gw5JhAAAAFGRhdmVARGF2ZVJpY2hlci1JTUVYAQIDBAUG
-----END OPENSSH PRIVATE KEY-----

View File

@@ -1 +0,0 @@
ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQC82Xl+5WYs2/vYFk3GdOpfkId/leLxTGNhpjEchNILHtuWeGlVgt2pe9w5ZfNux+NyH916fvdCJbifYVjPvmgYyFQaU5jN1YoD0j1KPT1DLVHTpGHAOJkZ3mpoyzAR5emQ2aLa7hB3aQl4N9RBSKCMLT1XzU7++ueIa1AAlJx+Ib+K12b5R+fT1ngxiTQdaOqIOiQ0SySgQ+yJtgitv5Dq9224+Rk77BT+yZeE+2DDlJPqhB2ab+BU2xGDlc3PGuKt77PUZZq2edUveE+ed+md/xbnz13KazsYYnCE96tIZM3VufRPj70Lr0J3ssEm3GK4V1GZ2UYsss9FHjxG6vvX dave@DaveRicher-IMEX

View File

@@ -1,12 +0,0 @@
-----BEGIN OPENSSH PRIVATE KEY-----
b3BlbnNzaC1rZXktdjEAAAAABG5vbmUAAAAEbm9uZQAAAAAAAAABAAAArAAAABNlY2RzYS
1zaGEyLW5pc3RwNTIxAAAACG5pc3RwNTIxAAAAhQQBYJnAujo17diR0fM2Ze1d1Ft6XHm5
U31pXdFEN+rGC4SoYTdZE8q3relxMS5GwwBOvgvVUuayfid2XS8ls/CMDiMBJAYqEK4CRY
PbbPB7lLnMWsF7muFhvs+SIpPQC+vtDwM2TKlxF0Y8p+iVRpvCADoggsSze7skmJWKmMTt
8jEdEOcAAAEQIyXsOSMl7DkAAAATZWNkc2Etc2hhMi1uaXN0cDUyMQAAAAhuaXN0cDUyMQ
AAAIUEAWCZwLo6Ne3YkdHzNmXtXdRbelx5uVN9aV3RRDfqxguEqGE3WRPKt63pcTEuRsMA
Tr4L1VLmsn4ndl0vJbPwjA4jASQGKhCuAkWD22zwe5S5zFrBe5rhYb7PkiKT0Avr7Q8DNk
ypcRdGPKfolUabwgA6IILEs3u7JJiVipjE7fIxHRDnAAAAQUO5dO9G7i0bxGTP0zV3eIwv
5g0NhrQJfW/bMHS6XWwaxdpr+QZ+DbBJVzZPwYC0wLMW4bJAf+kjqUnj4wGocoTeAAAAD2
lvLWZ0cC10ZXN0LWtleQECAwQ=
-----END OPENSSH PRIVATE KEY-----

View File

@@ -1 +0,0 @@
ecdsa-sha2-nistp521 AAAAE2VjZHNhLXNoYTItbmlzdHA1MjEAAAAIbmlzdHA1MjEAAACFBAFgmcC6OjXt2JHR8zZl7V3UW3pceblTfWld0UQ36sYLhKhhN1kTyret6XExLkbDAE6+C9VS5rJ+J3ZdLyWz8IwOIwEkBioQrgJFg9ts8HuUucxawXua4WG+z5Iik9AL6+0PAzZMqXEXRjyn6JVGm8IAOiCCxLN7uySYlYqYxO3yMR0Q5w== io-ftp-test-key

View File

@@ -1,12 +0,0 @@
PuTTY-User-Key-File-3: ecdsa-sha2-nistp521
Encryption: none
Comment: io-ftp-test-key
Public-Lines: 4
AAAAE2VjZHNhLXNoYTItbmlzdHA1MjEAAAAIbmlzdHA1MjEAAACFBAFgmcC6OjXt
2JHR8zZl7V3UW3pceblTfWld0UQ36sYLhKhhN1kTyret6XExLkbDAE6+C9VS5rJ+
J3ZdLyWz8IwOIwEkBioQrgJFg9ts8HuUucxawXua4WG+z5Iik9AL6+0PAzZMqXEX
Rjyn6JVGm8IAOiCCxLN7uySYlYqYxO3yMR0Q5w==
Private-Lines: 2
AAAAQUO5dO9G7i0bxGTP0zV3eIwv5g0NhrQJfW/bMHS6XWwaxdpr+QZ+DbBJVzZP
wYC0wLMW4bJAf+kjqUnj4wGocoTe
Private-MAC: d67001d47e13c43dc8bdb9c68a25356a96c1c4a6714f3c5a1836fca646b78b54

View File

@@ -1,28 +0,0 @@
-----BEGIN PRIVATE KEY-----
MIIEvAIBADANBgkqhkiG9w0BAQEFAASCBKYwggSiAgEAAoIBAQCkndJezSQjQcL7
T1PnVT0JLXoNAHwt7BqkZ2TELXgkVWtqCIAuDaBdwPQSv8h2xWRduTp103JOb83P
Mm97+953X0w/QEijaImmRPOPxhQbMapSkfHLNKlcM7gLHYozL75TDzZTEchNUW+5
0eh1xpD1zcsYDJKNNzVz5LyI3vc0bnZtC3/C+Kv4T8j5EuzK5v7kHwACXvsRXLqZ
BF9l2O69MdQvs+hPJQNVHLoSt0h3VuwlmKqdb1Of3Z51Il8AmhogumNWwiQdKQwF
SEs8tyVA3SDWXYqhkfsvIaN6bLQoX9pqf++rNzfXhvSgP6mhSgaxpNj7wqGfPwI9
WjLEWBRxAgMBAAECggEAUNpHYlLFxh9dokujPUMreF+Cy/IKDBAkQc2au5RNpyLh
YDIOqw/8TTAhcTgLQPLQygvZP9f8E7RsVLFD+pSJ/v2qmIJ9au1Edor1Sg+S/oxV
SLrwFMunx2aLpcH7iAqSI3+cQg7A3+D4zD7iOz6tIl3Su9wo+v073tFhHKTOrEwv
Qgr9Jf3viIiKV1ym+uQEVQndocfsj46FnFpXTQ2qs7kAF6FgAOLDGfQQwzkiqEBD
NsqsDmbYIx6foZL+DEz1ZVO2M5B+xxpbNK82KwuQilVpimW8ui4LZHCe+RIFzt9+
BK6KGlLpSEwTFliivI3nahy18JzskZsfyah0CPZlQQKBgQDVv+A0qIPGvOP3Sx+9
HyeQCV23SkvvSvw8p8pMB0gvwv63YdJ7N/rJzBGS6YUHFWWZZgEeTgkJ6VJvoe0r
8JL1el9uSUa7f0eayjmFBOGuzpktNVdIn2Tg7A9MWA4JqPNNC69RMOh86ewGD4J3
a8Hz2a1bHxAmy/AZt2ukypY6eQKBgQDFJ7kqeOPkRBz9WbALRgVIXo8YWf5di0sQ
r0HC03GAISHQ725A2IFBPHJWeqj0jaMiIZD0y+Obgp7KAskrJaLfsd7Ug775kFfw
oUI9UAl6kRuPKvm3BaVAm46SQm+56VsgxTi73YN0NUp75THHZgAJjepF9zSpVJxq
VY9DjEGruQKBgQCQCpGIatcCol/tUg69X7VFd0pULhkl1J5OMbQ9r9qRdRI5eg5h
QsQaIQ7mtb8TmvOwf/DY/zVQHI+U8sXlCmW+TwzoQTENQSR7xzMj1LpRFqBaustr
AR72A537kItFLzll/i3SxOam5uxK2UDOQSuerF4KPdCglGXkrpo3nt3F4QKBgQCa
RArPAOjQo7tLQfJN3+wiRFsTYtd1uphx5bA/EdOtvj8HjVFnzADXWsTchf3N3UXY
XwtdgGwIMpys1KEz8a8P+c2x26SDAj7NOmDqOMYx8Xju/WGHpBM6Cn30U6e4gK+d
ZLSPyzQgqdIuP5hDvbwpvbGiLVw3Ys1BJtGCuSxpgQJ/eHnRiuSi5Zq5jGg+GpA+
FEEc9NCy772rR+4uzEOqyIwqewffqzSuVWuIsY/8MP3fh+NDxl/mU6cB5QVeD54Z
JZUKwmpM26muiM6WvVnM4ExPdSGA2+l4pZjby/KKd6F/w0tgZ1jb9Pb2/0vN3qVA
Y4U4XNTMt2fxUACqiL4SHA==
-----END PRIVATE KEY-----

View File

@@ -1,5 +1,5 @@
VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.imex.online/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.imex.online/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
VITE_APP_GA_CODE=231099835
VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
@@ -8,14 +8,7 @@ VITE_APP_CLOUDINARY_API_KEY=957865933348715
VITE_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
VITE_APP_FIREBASE_PUBLIC_VAPID_KEY='BG3tzU7L2BXlGZ_3VLK4PNaRceoEXEnmHfxcVbRMF5o5g05ejslhVPki9kBM9cBBT-08Ad9kN3HSpS6JmrWD6h4'
VITE_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
VITE_APP_AXIOS_BASE_API_URL=/api/
VITE_APP_REPORTS_SERVER_URL=https://reports.test.imex.online
VITE_APP_AXIOS_BASE_API_URL=http://localhost:4000
VITE_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
VITE_APP_INSTANCE=IMEX
TEST_USERNAME="test@imex.dev"
TEST_PASSWORD="test123"
VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
VITE_APP_AMP_KEY=6228a598e57cd66875cfd41604f1f891
VITE_APP_ENABLE_RESPONSIVE_TABLE_FILTERING=false

View File

@@ -0,0 +1,14 @@
VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
VITE_APP_GA_CODE=231099835
VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
VITE_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/io-test
VITE_APP_CLOUDINARY_API_KEY=957865933348715
VITE_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
VITE_APP_FIREBASE_PUBLIC_VAPID_KEY='BG3tzU7L2BXlGZ_3VLK4PNaRceoEXEnmHfxcVbRMF5o5g05ejslhVPki9kBM9cBBT-08Ad9kN3HSpS6JmrWD6h4'
VITE_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
VITE_APP_AXIOS_BASE_API_URL=http://localhost:4000
VITE_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
VITE_APP_INSTANCE=PROMANAGER

View File

@@ -1,23 +1,15 @@
VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.imex.online/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.imex.online/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
VITE_APP_GA_CODE=231099835
# VITE_APP_FIREBASE_CONFIG={ "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE", "authDomain": "rome-prod-1.firebaseapp.com", "projectId": "rome-prod-1", "storageBucket": "rome-prod-1.appspot.com", "messagingSenderId": "147786367145", "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8", "measurementId": "G-G8Z9DRHTZS"}
VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
VITE_APP_FIREBASE_CONFIG={ "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE", "authDomain": "rome-prod-1.firebaseapp.com", "projectId": "rome-prod-1", "storageBucket": "rome-prod-1.appspot.com", "messagingSenderId": "147786367145", "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8", "measurementId": "G-G8Z9DRHTZS"}
VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
VITE_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/io-test
VITE_APP_CLOUDINARY_API_KEY=957865933348715
VITE_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
VITE_APP_FIREBASE_PUBLIC_VAPID_KEY='BP1B7ZTYpn-KMt6nOxlld6aS8Skt3Q7ZLEqP0hAvGHxG4UojPYiXZ6kPlzZkUC5jH-EcWXomTLtmadAIxurfcHo'
VITE_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
VITE_APP_AXIOS_BASE_API_URL=/api/
VITE_APP_REPORTS_SERVER_URL=https://reports.test.romeonline.io
VITE_APP_AXIOS_BASE_API_URL=http://localhost:4000
VITE_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
VITE_APP_COUNTRY=USA
VITE_APP_INSTANCE=ROME
TEST_USERNAME="test@imex.dev"
TEST_PASSWORD="test123"
VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
VITE_APP_AMP_KEY=46b1193a867d4e3131ae4c3a64a3fc78
VITE_APP_ENABLE_RESPONSIVE_TABLE_FILTERING=false

View File

@@ -13,7 +13,3 @@ VITE_APP_AXIOS_BASE_API_URL=https://api.imex.online/
VITE_APP_REPORTS_SERVER_URL=https://reports.imex.online
VITE_APP_SPLIT_API=et9pjkik6bn67he5evpmpr1agoo7gactphgk
VITE_APP_INSTANCE=IMEX
VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
VITE_APP_AMP_KEY=6228a598e57cd66875cfd41604f1f891

View File

@@ -0,0 +1,15 @@
GENERATE_SOURCEMAP=true
VITE_APP_GRAPHQL_ENDPOINT=https://db.romeonline.io/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.romeonline.io/v1/graphql
VITE_APP_GA_CODE=231103507
VITE_APP_FIREBASE_CONFIG={ "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE", "authDomain": "rome-prod-1.firebaseapp.com", "projectId": "rome-prod-1", "storageBucket": "rome-prod-1.appspot.com", "messagingSenderId": "147786367145", "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8", "measurementId": "G-G8Z9DRHTZS"}
VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/bodyshop
VITE_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/bodyshop
VITE_APP_CLOUDINARY_API_KEY=473322739956866
VITE_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
VITE_APP_FIREBASE_PUBLIC_VAPID_KEY='BMgZT1NZztW2DsJl8Mg2L04hgY9FzAg6b8fbzgNAfww2VDzH3VE63Ot9EaP_U7KWS2JT-7HPHaw0T_Tw_5vkZc8'
VITE_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
VITE_APP_AXIOS_BASE_API_URL=https://api.romeonline.io/
VITE_APP_REPORTS_SERVER_URL=https://reports.romeonline.io
VITE_APP_SPLIT_API=et9pjkik6bn67he5evpmpr1agoo7gactphgk
VITE_APP_INSTANCE=PROMANAGER

View File

@@ -13,7 +13,3 @@ VITE_APP_AXIOS_BASE_API_URL=https://api.romeonline.io/
VITE_APP_REPORTS_SERVER_URL=https://reports.romeonline.io
VITE_APP_SPLIT_API=et9pjkik6bn67he5evpmpr1agoo7gactphgk
VITE_APP_INSTANCE=ROME
VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
VITE_APP_AMP_KEY=46b1193a867d4e3131ae4c3a64a3fc78

View File

@@ -9,11 +9,7 @@ VITE_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
VITE_APP_FIREBASE_PUBLIC_VAPID_KEY='BN2GcDPjipR5MTEosO5dT4CfQ3cmrdBIsI4juoOQrRijn_5aRiHlwj1mlq0W145mOusx6xynEKl_tvYJhpCc9lo'
VITE_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
VITE_APP_AXIOS_BASE_API_URL=https://api.test.imex.online/
VITE_APP_REPORTS_SERVER_URL=https://reports.test.imex.online
VITE_APP_REPORTS_SERVER_URL=https://reports3.test.imex.online
VITE_APP_IS_TEST=true
VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
VITE_APP_INSTANCE=IMEX
VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
VITE_APP_AMP_KEY=6228a598e57cd66875cfd41604f1f891

View File

@@ -0,0 +1,15 @@
VITE_APP_GRAPHQL_ENDPOINT=https://db.test.romeonline.io/v1/graphql
VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.test.romeonline.io/v1/graphql
VITE_APP_GA_CODE=231099835
VITE_APP_FIREBASE_CONFIG={ "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE", "authDomain": "rome-prod-1.firebaseapp.com", "projectId": "rome-prod-1", "storageBucket": "rome-prod-1.appspot.com", "messagingSenderId": "147786367145", "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8", "measurementId": "G-G8Z9DRHTZS"}
VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/bodyshop
VITE_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/bodyshop
VITE_APP_CLOUDINARY_API_KEY=473322739956866
VITE_APP_CLOUDINARY_THUMB_TRANSFORMATIONS=c_fill,h_250,w_250
VITE_APP_FIREBASE_PUBLIC_VAPID_KEY='BN2GcDPjipR5MTEosO5dT4CfQ3cmrdBIsI4juoOQrRijn_5aRiHlwj1mlq0W145mOusx6xynEKl_tvYJhpCc9lo'
VITE_APP_STRIPE_PUBLIC_KEY=pk_test_51GqB4TJl3nQjrZ0wCQWAxAhlNF8jKe0tipIa6ExBaxwJGitwvFsIZUEua4dUzaMIAuXp4qwYHXx7lgjyQSwP0Pe900vzm38C7g
VITE_APP_AXIOS_BASE_API_URL=https://api.test.romeonline.io/
VITE_APP_REPORTS_SERVER_URL=https://reports.test.romeonline.io
VITE_APP_IS_TEST=true
VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
VITE_APP_INSTANCE=PROMANAGER

View File

@@ -13,7 +13,3 @@ VITE_APP_REPORTS_SERVER_URL=https://reports.test.romeonline.io
VITE_APP_IS_TEST=true
VITE_APP_SPLIT_API=ts615lqgnmk84thn72uk18uu5pgce6e0l4rc
VITE_APP_INSTANCE=ROME
VITE_PUBLIC_POSTHOG_KEY=phc_xtLmBIu0rjWwExY73Oj5DTH1bGbwq1G1Y8jnlTceien
VITE_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
VITE_APP_AMP_URL=https://vp8k908qy2.execute-api.ca-central-1.amazonaws.com
VITE_APP_AMP_KEY=46b1193a867d4e3131ae4c3a64a3fc78

8
client/.eslintrc Normal file
View File

@@ -0,0 +1,8 @@
{
"extends": [
"react-app"
],
"rules": {
"no-useless-rename": "off"
}
}

15
client/.gitignore vendored
View File

@@ -1,18 +1,3 @@
# Vitest
vitest-report*/
vitest-coverage/
*.vitest.log
test-output.txt
# Playwright
playwright-report/
test-results/
playwright/.cache/
*.playwright.log
# Sentry Config File
.sentryclirc
/dev-dist
# Local environment overrides (not version controlled)
.env.development.local.overrides

17
client/cypress.config.js Normal file
View File

@@ -0,0 +1,17 @@
const { defineConfig } = require("cypress");
module.exports = defineConfig({
experimentalStudio: true,
env: {
FIREBASE_USERNAME: "cypress@imex.test",
FIREBASE_PASSWORD: "cypress"
},
e2e: {
// We've imported your old cypress plugins here.
// You may want to clean this up later by importing these.
setupNodeEvents(on, config) {
return require("./cypress/plugins/index.js")(on, config);
},
baseUrl: "http://localhost:3000"
}
});

View File

@@ -0,0 +1,19 @@
/// <reference types="Cypress" />
const { FIREBASE_USERNAME, FIREBASE_PASSWORcD } = Cypress.env();
describe("Renders the General Page", () => {
beforeEach(() => {
cy.visit("/");
});
it("Renders Correctly", () => {});
it("Has the Slogan", () => {
cy.findByText("A whole x22new kind of shop management system.").should("exist");
/* ==== Generated with Cypress Studio ==== */
cy.get(".ant-menu-item-active > .ant-menu-title-content > .header0-item-block").click();
cy.get("#email").clear();
cy.get("#email").type("patrick@imex.dev");
cy.get("#password").clear();
cy.get("#password").type("patrick123{enter}");
cy.get(".ant-form > .ant-btn").click();
/* ==== End Cypress Studio ==== */
});
});

View File

@@ -0,0 +1,124 @@
/// <reference types="cypress" />
// Welcome to Cypress!
//
// This spec file contains a variety of sample tests
// for a todo list app that are designed to demonstrate
// the power of writing tests in Cypress.
//
// To learn more about how Cypress works and
// what makes it such an awesome testing tool,
// please read our getting started guide:
// https://on.cypress.io/introduction-to-cypress
describe("example to-do app", () => {
beforeEach(() => {
// Cypress starts out with a blank slate for each test
// so we must tell it to visit our website with the `cy.visit()` command.
// Since we want to visit the same URL at the start of all our tests,
// we include it in our beforeEach function so that it runs before each test
cy.visit("https://example.cypress.io/todo");
});
it("displays two todo items by default", () => {
// We use the `cy.get()` command to get all elements that match the selector.
// Then, we use `should` to assert that there are two matched items,
// which are the two default items.
cy.get(".todo-list li").should("have.length", 2);
// We can go even further and check that the default todos each contain
// the correct text. We use the `first` and `last` functions
// to get just the first and last matched elements individually,
// and then perform an assertion with `should`.
cy.get(".todo-list li").first().should("have.text", "Pay electric bill");
cy.get(".todo-list li").last().should("have.text", "Walk the dog");
});
it("can add new todo items", () => {
// We'll store our item text in a variable so we can reuse it
const newItem = "Feed the cat";
// Let's get the input element and use the `type` command to
// input our new list item. After typing the content of our item,
// we need to type the enter key as well in order to submit the input.
// This input has a data-test attribute so we'll use that to select the
// element in accordance with best practices:
// https://on.cypress.io/selecting-elements
cy.get("[data-test=new-todo]").type(`${newItem}{enter}`);
// Now that we've typed our new item, let's check that it actually was added to the list.
// Since it's the newest item, it should exist as the last element in the list.
// In addition, with the two default items, we should have a total of 3 elements in the list.
// Since assertions yield the element that was asserted on,
// we can chain both of these assertions together into a single statement.
cy.get(".todo-list li").should("have.length", 3).last().should("have.text", newItem);
});
it("can check off an item as completed", () => {
// In addition to using the `get` command to get an element by selector,
// we can also use the `contains` command to get an element by its contents.
// However, this will yield the <label>, which is lowest-level element that contains the text.
// In order to check the item, we'll find the <input> element for this <label>
// by traversing up the dom to the parent element. From there, we can `find`
// the child checkbox <input> element and use the `check` command to check it.
cy.contains("Pay electric bill").parent().find("input[type=checkbox]").check();
// Now that we've checked the button, we can go ahead and make sure
// that the list element is now marked as completed.
// Again we'll use `contains` to find the <label> element and then use the `parents` command
// to traverse multiple levels up the dom until we find the corresponding <li> element.
// Once we get that element, we can assert that it has the completed class.
cy.contains("Pay electric bill").parents("li").should("have.class", "completed");
});
context("with a checked task", () => {
beforeEach(() => {
// We'll take the command we used above to check off an element
// Since we want to perform multiple tests that start with checking
// one element, we put it in the beforeEach hook
// so that it runs at the start of every test.
cy.contains("Pay electric bill").parent().find("input[type=checkbox]").check();
});
it("can filter for uncompleted tasks", () => {
// We'll click on the "active" button in order to
// display only incomplete items
cy.contains("Active").click();
// After filtering, we can assert that there is only the one
// incomplete item in the list.
cy.get(".todo-list li").should("have.length", 1).first().should("have.text", "Walk the dog");
// For good measure, let's also assert that the task we checked off
// does not exist on the page.
cy.contains("Pay electric bill").should("not.exist");
});
it("can filter for completed tasks", () => {
// We can perform similar steps as the test above to ensure
// that only completed tasks are shown
cy.contains("Completed").click();
cy.get(".todo-list li").should("have.length", 1).first().should("have.text", "Pay electric bill");
cy.contains("Walk the dog").should("not.exist");
});
it("can delete all completed tasks", () => {
// First, let's click the "Clear completed" button
// `contains` is actually serving two purposes here.
// First, it's ensuring that the button exists within the dom.
// This button only appears when at least one task is checked
// so this command is implicitly verifying that it does exist.
// Second, it selects the button so we can click it.
cy.contains("Clear completed").click();
// Then we can make sure that there is only one element
// in the list and our element does not exist
cy.get(".todo-list li").should("have.length", 1).should("not.have.text", "Pay electric bill");
// Finally, make sure that the clear button no longer exists.
cy.contains("Clear completed").should("not.exist");
});
});
});

View File

@@ -0,0 +1,284 @@
/// <reference types="cypress" />
context("Actions", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/actions");
});
// https://on.cypress.io/interacting-with-elements
it(".type() - type into a DOM element", () => {
// https://on.cypress.io/type
cy.get(".action-email")
.type("fake@email.com")
.should("have.value", "fake@email.com")
// .type() with special character sequences
.type("{leftarrow}{rightarrow}{uparrow}{downarrow}")
.type("{del}{selectall}{backspace}")
// .type() with key modifiers
.type("{alt}{option}") //these are equivalent
.type("{ctrl}{control}") //these are equivalent
.type("{meta}{command}{cmd}") //these are equivalent
.type("{shift}")
// Delay each keypress by 0.1 sec
.type("slow.typing@email.com", { delay: 100 })
.should("have.value", "slow.typing@email.com");
cy.get(".action-disabled")
// Ignore error checking prior to type
// like whether the input is visible or disabled
.type("disabled error checking", { force: true })
.should("have.value", "disabled error checking");
});
it(".focus() - focus on a DOM element", () => {
// https://on.cypress.io/focus
cy.get(".action-focus").focus().should("have.class", "focus").prev().should("have.attr", "style", "color: orange;");
});
it(".blur() - blur off a DOM element", () => {
// https://on.cypress.io/blur
cy.get(".action-blur")
.type("About to blur")
.blur()
.should("have.class", "error")
.prev()
.should("have.attr", "style", "color: red;");
});
it(".clear() - clears an input or textarea element", () => {
// https://on.cypress.io/clear
cy.get(".action-clear")
.type("Clear this text")
.should("have.value", "Clear this text")
.clear()
.should("have.value", "");
});
it(".submit() - submit a form", () => {
// https://on.cypress.io/submit
cy.get(".action-form").find('[type="text"]').type("HALFOFF");
cy.get(".action-form").submit().next().should("contain", "Your form has been submitted!");
});
it(".click() - click on a DOM element", () => {
// https://on.cypress.io/click
cy.get(".action-btn").click();
// You can click on 9 specific positions of an element:
// -----------------------------------
// | topLeft top topRight |
// | |
// | |
// | |
// | left center right |
// | |
// | |
// | |
// | bottomLeft bottom bottomRight |
// -----------------------------------
// clicking in the center of the element is the default
cy.get("#action-canvas").click();
cy.get("#action-canvas").click("topLeft");
cy.get("#action-canvas").click("top");
cy.get("#action-canvas").click("topRight");
cy.get("#action-canvas").click("left");
cy.get("#action-canvas").click("right");
cy.get("#action-canvas").click("bottomLeft");
cy.get("#action-canvas").click("bottom");
cy.get("#action-canvas").click("bottomRight");
// .click() accepts an x and y coordinate
// that controls where the click occurs :)
cy.get("#action-canvas")
.click(80, 75) // click 80px on x coord and 75px on y coord
.click(170, 75)
.click(80, 165)
.click(100, 185)
.click(125, 190)
.click(150, 185)
.click(170, 165);
// click multiple elements by passing multiple: true
cy.get(".action-labels>.label").click({ multiple: true });
// Ignore error checking prior to clicking
cy.get(".action-opacity>.btn").click({ force: true });
});
it(".dblclick() - double click on a DOM element", () => {
// https://on.cypress.io/dblclick
// Our app has a listener on 'dblclick' event in our 'scripts.js'
// that hides the div and shows an input on double click
cy.get(".action-div").dblclick().should("not.be.visible");
cy.get(".action-input-hidden").should("be.visible");
});
it(".rightclick() - right click on a DOM element", () => {
// https://on.cypress.io/rightclick
// Our app has a listener on 'contextmenu' event in our 'scripts.js'
// that hides the div and shows an input on right click
cy.get(".rightclick-action-div").rightclick().should("not.be.visible");
cy.get(".rightclick-action-input-hidden").should("be.visible");
});
it(".check() - check a checkbox or radio element", () => {
// https://on.cypress.io/check
// By default, .check() will check all
// matching checkbox or radio elements in succession, one after another
cy.get('.action-checkboxes [type="checkbox"]').not("[disabled]").check().should("be.checked");
cy.get('.action-radios [type="radio"]').not("[disabled]").check().should("be.checked");
// .check() accepts a value argument
cy.get('.action-radios [type="radio"]').check("radio1").should("be.checked");
// .check() accepts an array of values
cy.get('.action-multiple-checkboxes [type="checkbox"]').check(["checkbox1", "checkbox2"]).should("be.checked");
// Ignore error checking prior to checking
cy.get(".action-checkboxes [disabled]").check({ force: true }).should("be.checked");
cy.get('.action-radios [type="radio"]').check("radio3", { force: true }).should("be.checked");
});
it(".uncheck() - uncheck a checkbox element", () => {
// https://on.cypress.io/uncheck
// By default, .uncheck() will uncheck all matching
// checkbox elements in succession, one after another
cy.get('.action-check [type="checkbox"]').not("[disabled]").uncheck().should("not.be.checked");
// .uncheck() accepts a value argument
cy.get('.action-check [type="checkbox"]').check("checkbox1").uncheck("checkbox1").should("not.be.checked");
// .uncheck() accepts an array of values
cy.get('.action-check [type="checkbox"]')
.check(["checkbox1", "checkbox3"])
.uncheck(["checkbox1", "checkbox3"])
.should("not.be.checked");
// Ignore error checking prior to unchecking
cy.get(".action-check [disabled]").uncheck({ force: true }).should("not.be.checked");
});
it(".select() - select an option in a <select> element", () => {
// https://on.cypress.io/select
// at first, no option should be selected
cy.get(".action-select").should("have.value", "--Select a fruit--");
// Select option(s) with matching text content
cy.get(".action-select").select("apples");
// confirm the apples were selected
// note that each value starts with "fr-" in our HTML
cy.get(".action-select").should("have.value", "fr-apples");
cy.get(".action-select-multiple")
.select(["apples", "oranges", "bananas"])
// when getting multiple values, invoke "val" method first
.invoke("val")
.should("deep.equal", ["fr-apples", "fr-oranges", "fr-bananas"]);
// Select option(s) with matching value
cy.get(".action-select")
.select("fr-bananas")
// can attach an assertion right away to the element
.should("have.value", "fr-bananas");
cy.get(".action-select-multiple")
.select(["fr-apples", "fr-oranges", "fr-bananas"])
.invoke("val")
.should("deep.equal", ["fr-apples", "fr-oranges", "fr-bananas"]);
// assert the selected values include oranges
cy.get(".action-select-multiple").invoke("val").should("include", "fr-oranges");
});
it(".scrollIntoView() - scroll an element into view", () => {
// https://on.cypress.io/scrollintoview
// normally all of these buttons are hidden,
// because they're not within
// the viewable area of their parent
// (we need to scroll to see them)
cy.get("#scroll-horizontal button").should("not.be.visible");
// scroll the button into view, as if the user had scrolled
cy.get("#scroll-horizontal button").scrollIntoView().should("be.visible");
cy.get("#scroll-vertical button").should("not.be.visible");
// Cypress handles the scroll direction needed
cy.get("#scroll-vertical button").scrollIntoView().should("be.visible");
cy.get("#scroll-both button").should("not.be.visible");
// Cypress knows to scroll to the right and down
cy.get("#scroll-both button").scrollIntoView().should("be.visible");
});
it(".trigger() - trigger an event on a DOM element", () => {
// https://on.cypress.io/trigger
// To interact with a range input (slider)
// we need to set its value & trigger the
// event to signal it changed
// Here, we invoke jQuery's val() method to set
// the value and trigger the 'change' event
cy.get(".trigger-input-range")
.invoke("val", 25)
.trigger("change")
.get("input[type=range]")
.siblings("p")
.should("have.text", "25");
});
it("cy.scrollTo() - scroll the window or element to a position", () => {
// https://on.cypress.io/scrollto
// You can scroll to 9 specific positions of an element:
// -----------------------------------
// | topLeft top topRight |
// | |
// | |
// | |
// | left center right |
// | |
// | |
// | |
// | bottomLeft bottom bottomRight |
// -----------------------------------
// if you chain .scrollTo() off of cy, we will
// scroll the entire window
cy.scrollTo("bottom");
cy.get("#scrollable-horizontal").scrollTo("right");
// or you can scroll to a specific coordinate:
// (x axis, y axis) in pixels
cy.get("#scrollable-vertical").scrollTo(250, 250);
// or you can scroll to a specific percentage
// of the (width, height) of the element
cy.get("#scrollable-both").scrollTo("75%", "25%");
// control the easing of the scroll (default is 'swing')
cy.get("#scrollable-vertical").scrollTo("center", { easing: "linear" });
// control the duration of the scroll (in ms)
cy.get("#scrollable-both").scrollTo("center", { duration: 2000 });
});
});

View File

@@ -0,0 +1,35 @@
/// <reference types="cypress" />
context("Aliasing", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/aliasing");
});
it(".as() - alias a DOM element for later use", () => {
// https://on.cypress.io/as
// Alias a DOM element for use later
// We don't have to traverse to the element
// later in our code, we reference it with @
cy.get(".as-table").find("tbody>tr").first().find("td").first().find("button").as("firstBtn");
// when we reference the alias, we place an
// @ in front of its name
cy.get("@firstBtn").click();
cy.get("@firstBtn").should("have.class", "btn-success").and("contain", "Changed");
});
it(".as() - alias a route for later use", () => {
// Alias the route to wait for its response
cy.intercept("GET", "**/comments/*").as("getComment");
// we have code that gets a comment when
// the button is clicked in scripts.js
cy.get(".network-btn").click();
// https://on.cypress.io/wait
cy.wait("@getComment").its("response.statusCode").should("eq", 200);
});
});

View File

@@ -0,0 +1,173 @@
/// <reference types="cypress" />
context("Assertions", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/assertions");
});
describe("Implicit Assertions", () => {
it(".should() - make an assertion about the current subject", () => {
// https://on.cypress.io/should
cy.get(".assertion-table")
.find("tbody tr:last")
.should("have.class", "success")
.find("td")
.first()
// checking the text of the <td> element in various ways
.should("have.text", "Column content")
.should("contain", "Column content")
.should("have.html", "Column content")
// chai-jquery uses "is()" to check if element matches selector
.should("match", "td")
// to match text content against a regular expression
// first need to invoke jQuery method text()
// and then match using regular expression
.invoke("text")
.should("match", /column content/i);
// a better way to check element's text content against a regular expression
// is to use "cy.contains"
// https://on.cypress.io/contains
cy.get(".assertion-table")
.find("tbody tr:last")
// finds first <td> element with text content matching regular expression
.contains("td", /column content/i)
.should("be.visible");
// for more information about asserting element's text
// see https://on.cypress.io/using-cypress-faq#How-do-I-get-an-elements-text-contents
});
it(".and() - chain multiple assertions together", () => {
// https://on.cypress.io/and
cy.get(".assertions-link").should("have.class", "active").and("have.attr", "href").and("include", "cypress.io");
});
});
describe("Explicit Assertions", () => {
// https://on.cypress.io/assertions
it("expect - make an assertion about a specified subject", () => {
// We can use Chai's BDD style assertions
expect(true).to.be.true;
const o = { foo: "bar" };
expect(o).to.equal(o);
expect(o).to.deep.equal({ foo: "bar" });
// matching text using regular expression
expect("FooBar").to.match(/bar$/i);
});
it("pass your own callback function to should()", () => {
// Pass a function to should that can have any number
// of explicit assertions within it.
// The ".should(cb)" function will be retried
// automatically until it passes all your explicit assertions or times out.
cy.get(".assertions-p")
.find("p")
.should(($p) => {
// https://on.cypress.io/$
// return an array of texts from all of the p's
// @ts-ignore TS6133 unused variable
const texts = $p.map((i, el) => Cypress.$(el).text());
// jquery map returns jquery object
// and .get() convert this to simple array
const paragraphs = texts.get();
// array should have length of 3
expect(paragraphs, "has 3 paragraphs").to.have.length(3);
// use second argument to expect(...) to provide clear
// message with each assertion
expect(paragraphs, "has expected text in each paragraph").to.deep.eq([
"Some text from first p",
"More text from second p",
"And even more text from third p"
]);
});
});
it("finds element by class name regex", () => {
cy.get(".docs-header")
.find("div")
// .should(cb) callback function will be retried
.should(($div) => {
expect($div).to.have.length(1);
const className = $div[0].className;
expect(className).to.match(/heading-/);
})
// .then(cb) callback is not retried,
// it either passes or fails
.then(($div) => {
expect($div, "text content").to.have.text("Introduction");
});
});
it("can throw any error", () => {
cy.get(".docs-header")
.find("div")
.should(($div) => {
if ($div.length !== 1) {
// you can throw your own errors
throw new Error("Did not find 1 element");
}
const className = $div[0].className;
if (!className.match(/heading-/)) {
throw new Error(`Could not find class "heading-" in ${className}`);
}
});
});
it("matches unknown text between two elements", () => {
/**
* Text from the first element.
* @type {string}
*/
let text;
/**
* Normalizes passed text,
* useful before comparing text with spaces and different capitalization.
* @param {string} s Text to normalize
*/
const normalizeText = (s) => s.replace(/\s/g, "").toLowerCase();
cy.get(".two-elements")
.find(".first")
.then(($first) => {
// save text from the first element
text = normalizeText($first.text());
});
cy.get(".two-elements")
.find(".second")
.should(($div) => {
// we can massage text before comparing
const secondText = normalizeText($div.text());
expect(secondText, "second text").to.equal(text);
});
});
it("assert - assert shape of an object", () => {
const person = {
name: "Joe",
age: 20
};
assert.isObject(person, "value is object");
});
it("retries the should callback until assertions pass", () => {
cy.get("#random-number").should(($div) => {
const n = parseFloat($div.text());
expect(n).to.be.gte(1).and.be.lte(10);
});
});
});
});

View File

@@ -0,0 +1,96 @@
/// <reference types="cypress" />
context("Connectors", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/connectors");
});
it(".each() - iterate over an array of elements", () => {
// https://on.cypress.io/each
cy.get(".connectors-each-ul>li").each(($el, index, $list) => {
console.log($el, index, $list);
});
});
it(".its() - get properties on the current subject", () => {
// https://on.cypress.io/its
cy.get(".connectors-its-ul>li")
// calls the 'length' property yielding that value
.its("length")
.should("be.gt", 2);
});
it(".invoke() - invoke a function on the current subject", () => {
// our div is hidden in our script.js
// $('.connectors-div').hide()
// https://on.cypress.io/invoke
cy.get(".connectors-div")
.should("be.hidden")
// call the jquery method 'show' on the 'div.container'
.invoke("show")
.should("be.visible");
});
it(".spread() - spread an array as individual args to callback function", () => {
// https://on.cypress.io/spread
const arr = ["foo", "bar", "baz"];
cy.wrap(arr).spread((foo, bar, baz) => {
expect(foo).to.eq("foo");
expect(bar).to.eq("bar");
expect(baz).to.eq("baz");
});
});
describe(".then()", () => {
it("invokes a callback function with the current subject", () => {
// https://on.cypress.io/then
cy.get(".connectors-list > li").then(($lis) => {
expect($lis, "3 items").to.have.length(3);
expect($lis.eq(0), "first item").to.contain("Walk the dog");
expect($lis.eq(1), "second item").to.contain("Feed the cat");
expect($lis.eq(2), "third item").to.contain("Write JavaScript");
});
});
it("yields the returned value to the next command", () => {
cy.wrap(1)
.then((num) => {
expect(num).to.equal(1);
return 2;
})
.then((num) => {
expect(num).to.equal(2);
});
});
it("yields the original subject without return", () => {
cy.wrap(1)
.then((num) => {
expect(num).to.equal(1);
// note that nothing is returned from this callback
})
.then((num) => {
// this callback receives the original unchanged value 1
expect(num).to.equal(1);
});
});
it("yields the value yielded by the last Cypress command inside", () => {
cy.wrap(1)
.then((num) => {
expect(num).to.equal(1);
// note how we run a Cypress command
// the result yielded by this Cypress command
// will be passed to the second ".then"
cy.wrap(2);
})
.then((num) => {
// this callback receives the value yielded by "cy.wrap(2)"
expect(num).to.equal(2);
});
});
});
});

View File

@@ -0,0 +1,79 @@
/// <reference types="cypress" />
context("Cookies", () => {
beforeEach(() => {
Cypress.Cookies.debug(true);
cy.visit("https://example.cypress.io/commands/cookies");
// clear cookies again after visiting to remove
// any 3rd party cookies picked up such as cloudflare
cy.clearCookies();
});
it("cy.getCookie() - get a browser cookie", () => {
// https://on.cypress.io/getcookie
cy.get("#getCookie .set-a-cookie").click();
// cy.getCookie() yields a cookie object
cy.getCookie("token").should("have.property", "value", "123ABC");
});
it("cy.getCookies() - get browser cookies", () => {
// https://on.cypress.io/getcookies
cy.getCookies().should("be.empty");
cy.get("#getCookies .set-a-cookie").click();
// cy.getCookies() yields an array of cookies
cy.getCookies()
.should("have.length", 1)
.should((cookies) => {
// each cookie has these properties
expect(cookies[0]).to.have.property("name", "token");
expect(cookies[0]).to.have.property("value", "123ABC");
expect(cookies[0]).to.have.property("httpOnly", false);
expect(cookies[0]).to.have.property("secure", false);
expect(cookies[0]).to.have.property("domain");
expect(cookies[0]).to.have.property("path");
});
});
it("cy.setCookie() - set a browser cookie", () => {
// https://on.cypress.io/setcookie
cy.getCookies().should("be.empty");
cy.setCookie("foo", "bar");
// cy.getCookie() yields a cookie object
cy.getCookie("foo").should("have.property", "value", "bar");
});
it("cy.clearCookie() - clear a browser cookie", () => {
// https://on.cypress.io/clearcookie
cy.getCookie("token").should("be.null");
cy.get("#clearCookie .set-a-cookie").click();
cy.getCookie("token").should("have.property", "value", "123ABC");
// cy.clearCookies() yields null
cy.clearCookie("token").should("be.null");
cy.getCookie("token").should("be.null");
});
it("cy.clearCookies() - clear browser cookies", () => {
// https://on.cypress.io/clearcookies
cy.getCookies().should("be.empty");
cy.get("#clearCookies .set-a-cookie").click();
cy.getCookies().should("have.length", 1);
// cy.clearCookies() yields null
cy.clearCookies();
cy.getCookies().should("be.empty");
});
});

View File

@@ -0,0 +1,208 @@
/// <reference types="cypress" />
context("Cypress.Commands", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
// https://on.cypress.io/custom-commands
it(".add() - create a custom command", () => {
Cypress.Commands.add(
"console",
{
prevSubject: true
},
(subject, method) => {
// the previous subject is automatically received
// and the commands arguments are shifted
// allow us to change the console method used
method = method || "log";
// log the subject to the console
// @ts-ignore TS7017
console[method]("The subject is", subject);
// whatever we return becomes the new subject
// we don't want to change the subject so
// we return whatever was passed in
return subject;
}
);
// @ts-ignore TS2339
cy.get("button")
.console("info")
.then(($button) => {
// subject is still $button
});
});
});
context("Cypress.Cookies", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
// https://on.cypress.io/cookies
it(".debug() - enable or disable debugging", () => {
Cypress.Cookies.debug(true);
// Cypress will now log in the console when
// cookies are set or cleared
cy.setCookie("fakeCookie", "123ABC");
cy.clearCookie("fakeCookie");
cy.setCookie("fakeCookie", "123ABC");
cy.clearCookie("fakeCookie");
cy.setCookie("fakeCookie", "123ABC");
});
it(".preserveOnce() - preserve cookies by key", () => {
// normally cookies are reset after each test
cy.getCookie("fakeCookie").should("not.be.ok");
// preserving a cookie will not clear it when
// the next test starts
cy.setCookie("lastCookie", "789XYZ");
Cypress.Cookies.preserveOnce("lastCookie");
});
it(".defaults() - set defaults for all cookies", () => {
// now any cookie with the name 'session_id' will
// not be cleared before each new test runs
Cypress.Cookies.defaults({
preserve: "session_id"
});
});
});
context("Cypress.arch", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
it("Get CPU architecture name of underlying OS", () => {
// https://on.cypress.io/arch
expect(Cypress.arch).to.exist;
});
});
context("Cypress.config()", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
it("Get and set configuration options", () => {
// https://on.cypress.io/config
let myConfig = Cypress.config();
expect(myConfig).to.have.property("animationDistanceThreshold", 5);
expect(myConfig).to.have.property("baseUrl", null);
expect(myConfig).to.have.property("defaultCommandTimeout", 4000);
expect(myConfig).to.have.property("requestTimeout", 5000);
expect(myConfig).to.have.property("responseTimeout", 30000);
expect(myConfig).to.have.property("viewportHeight", 660);
expect(myConfig).to.have.property("viewportWidth", 1000);
expect(myConfig).to.have.property("pageLoadTimeout", 60000);
expect(myConfig).to.have.property("waitForAnimations", true);
expect(Cypress.config("pageLoadTimeout")).to.eq(60000);
// this will change the config for the rest of your tests!
Cypress.config("pageLoadTimeout", 20000);
expect(Cypress.config("pageLoadTimeout")).to.eq(20000);
Cypress.config("pageLoadTimeout", 60000);
});
});
context("Cypress.dom", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
// https://on.cypress.io/dom
it(".isHidden() - determine if a DOM element is hidden", () => {
let hiddenP = Cypress.$(".dom-p p.hidden").get(0);
let visibleP = Cypress.$(".dom-p p.visible").get(0);
// our first paragraph has css class 'hidden'
expect(Cypress.dom.isHidden(hiddenP)).to.be.true;
expect(Cypress.dom.isHidden(visibleP)).to.be.false;
});
});
context("Cypress.env()", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
// We can set environment variables for highly dynamic values
// https://on.cypress.io/environment-variables
it("Get environment variables", () => {
// https://on.cypress.io/env
// set multiple environment variables
Cypress.env({
host: "veronica.dev.local",
api_server: "http://localhost:8888/v1/"
});
// get environment variable
expect(Cypress.env("host")).to.eq("veronica.dev.local");
// set environment variable
Cypress.env("api_server", "http://localhost:8888/v2/");
expect(Cypress.env("api_server")).to.eq("http://localhost:8888/v2/");
// get all environment variable
expect(Cypress.env()).to.have.property("host", "veronica.dev.local");
expect(Cypress.env()).to.have.property("api_server", "http://localhost:8888/v2/");
});
});
context("Cypress.log", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
it("Control what is printed to the Command Log", () => {
// https://on.cypress.io/cypress-log
});
});
context("Cypress.platform", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
it("Get underlying OS name", () => {
// https://on.cypress.io/platform
expect(Cypress.platform).to.be.exist;
});
});
context("Cypress.version", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
it("Get current version of Cypress being run", () => {
// https://on.cypress.io/version
expect(Cypress.version).to.be.exist;
});
});
context("Cypress.spec", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/cypress-api");
});
it("Get current spec information", () => {
// https://on.cypress.io/spec
// wrap the object so we can inspect it easily by clicking in the command log
cy.wrap(Cypress.spec).should("include.keys", ["name", "relative", "absolute"]);
});
});

View File

@@ -0,0 +1,86 @@
/// <reference types="cypress" />
/// JSON fixture file can be loaded directly using
// the built-in JavaScript bundler
// @ts-ignore
const requiredExample = require("../../fixtures/example");
context("Files", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/files");
});
beforeEach(() => {
// load example.json fixture file and store
// in the test context object
cy.fixture("example.json").as("example");
});
it("cy.fixture() - load a fixture", () => {
// https://on.cypress.io/fixture
// Instead of writing a response inline you can
// use a fixture file's content.
// when application makes an Ajax request matching "GET **/comments/*"
// Cypress will intercept it and reply with the object in `example.json` fixture
cy.intercept("GET", "**/comments/*", { fixture: "example.json" }).as("getComment");
// we have code that gets a comment when
// the button is clicked in scripts.js
cy.get(".fixture-btn").click();
cy.wait("@getComment")
.its("response.body")
.should("have.property", "name")
.and("include", "Using fixtures to represent data");
});
it("cy.fixture() or require - load a fixture", function () {
// we are inside the "function () { ... }"
// callback and can use test context object "this"
// "this.example" was loaded in "beforeEach" function callback
expect(this.example, "fixture in the test context").to.deep.equal(requiredExample);
// or use "cy.wrap" and "should('deep.equal', ...)" assertion
cy.wrap(this.example).should("deep.equal", requiredExample);
});
it("cy.readFile() - read file contents", () => {
// https://on.cypress.io/readfile
// You can read a file and yield its contents
// The filePath is relative to your project's root.
cy.readFile("cypress.json").then((json) => {
expect(json).to.be.an("object");
});
});
it("cy.writeFile() - write to a file", () => {
// https://on.cypress.io/writefile
// You can write to a file
// Use a response from a request to automatically
// generate a fixture file for use later
cy.request("https://jsonplaceholder.cypress.io/users").then((response) => {
cy.writeFile("cypress/fixtures/users.json", response.body);
});
cy.fixture("users").should((users) => {
expect(users[0].name).to.exist;
});
// JavaScript arrays and objects are stringified
// and formatted into text.
cy.writeFile("cypress/fixtures/profile.json", {
id: 8739,
name: "Jane",
email: "jane@example.com"
});
cy.fixture("profile").should((profile) => {
expect(profile.name).to.eq("Jane");
});
});
});

View File

@@ -0,0 +1,58 @@
/// <reference types="cypress" />
context("Local Storage", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/local-storage");
});
// Although local storage is automatically cleared
// in between tests to maintain a clean state
// sometimes we need to clear the local storage manually
it("cy.clearLocalStorage() - clear all data in local storage", () => {
// https://on.cypress.io/clearlocalstorage
cy.get(".ls-btn")
.click()
.should(() => {
expect(localStorage.getItem("prop1")).to.eq("red");
expect(localStorage.getItem("prop2")).to.eq("blue");
expect(localStorage.getItem("prop3")).to.eq("magenta");
});
// clearLocalStorage() yields the localStorage object
cy.clearLocalStorage().should((ls) => {
expect(ls.getItem("prop1")).to.be.null;
expect(ls.getItem("prop2")).to.be.null;
expect(ls.getItem("prop3")).to.be.null;
});
cy.get(".ls-btn")
.click()
.should(() => {
expect(localStorage.getItem("prop1")).to.eq("red");
expect(localStorage.getItem("prop2")).to.eq("blue");
expect(localStorage.getItem("prop3")).to.eq("magenta");
});
// Clear key matching string in Local Storage
cy.clearLocalStorage("prop1").should((ls) => {
expect(ls.getItem("prop1")).to.be.null;
expect(ls.getItem("prop2")).to.eq("blue");
expect(ls.getItem("prop3")).to.eq("magenta");
});
cy.get(".ls-btn")
.click()
.should(() => {
expect(localStorage.getItem("prop1")).to.eq("red");
expect(localStorage.getItem("prop2")).to.eq("blue");
expect(localStorage.getItem("prop3")).to.eq("magenta");
});
// Clear keys matching regex in Local Storage
cy.clearLocalStorage(/prop1|2/).should((ls) => {
expect(ls.getItem("prop1")).to.be.null;
expect(ls.getItem("prop2")).to.be.null;
expect(ls.getItem("prop3")).to.eq("magenta");
});
});
});

View File

@@ -0,0 +1,32 @@
/// <reference types="cypress" />
context("Location", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/location");
});
it("cy.hash() - get the current URL hash", () => {
// https://on.cypress.io/hash
cy.hash().should("be.empty");
});
it("cy.location() - get window.location", () => {
// https://on.cypress.io/location
cy.location().should((location) => {
expect(location.hash).to.be.empty;
expect(location.href).to.eq("https://example.cypress.io/commands/location");
expect(location.host).to.eq("example.cypress.io");
expect(location.hostname).to.eq("example.cypress.io");
expect(location.origin).to.eq("https://example.cypress.io");
expect(location.pathname).to.eq("/commands/location");
expect(location.port).to.eq("");
expect(location.protocol).to.eq("https:");
expect(location.search).to.be.empty;
});
});
it("cy.url() - get the current URL", () => {
// https://on.cypress.io/url
cy.url().should("eq", "https://example.cypress.io/commands/location");
});
});

View File

@@ -0,0 +1,98 @@
/// <reference types="cypress" />
context("Misc", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/misc");
});
it(".end() - end the command chain", () => {
// https://on.cypress.io/end
// cy.end is useful when you want to end a chain of commands
// and force Cypress to re-query from the root element
cy.get(".misc-table").within(() => {
// ends the current chain and yields null
cy.contains("Cheryl").click().end();
// queries the entire table again
cy.contains("Charles").click();
});
});
it("cy.exec() - execute a system command", () => {
// execute a system command.
// so you can take actions necessary for
// your test outside the scope of Cypress.
// https://on.cypress.io/exec
// we can use Cypress.platform string to
// select appropriate command
// https://on.cypress/io/platform
cy.log(`Platform ${Cypress.platform} architecture ${Cypress.arch}`);
// on CircleCI Windows build machines we have a failure to run bash shell
// https://github.com/cypress-io/cypress/issues/5169
// so skip some of the tests by passing flag "--env circle=true"
const isCircleOnWindows = Cypress.platform === "win32" && Cypress.env("circle");
if (isCircleOnWindows) {
cy.log("Skipping test on CircleCI");
return;
}
// cy.exec problem on Shippable CI
// https://github.com/cypress-io/cypress/issues/6718
const isShippable = Cypress.platform === "linux" && Cypress.env("shippable");
if (isShippable) {
cy.log("Skipping test on ShippableCI");
return;
}
cy.exec("echo Jane Lane").its("stdout").should("contain", "Jane Lane");
if (Cypress.platform === "win32") {
cy.exec("print cypress.json").its("stderr").should("be.empty");
} else {
cy.exec("cat cypress.json").its("stderr").should("be.empty");
cy.exec("pwd").its("code").should("eq", 0);
}
});
it("cy.focused() - get the DOM element that has focus", () => {
// https://on.cypress.io/focused
cy.get(".misc-form").find("#name").click();
cy.focused().should("have.id", "name");
cy.get(".misc-form").find("#description").click();
cy.focused().should("have.id", "description");
});
context("Cypress.Screenshot", function () {
it("cy.screenshot() - take a screenshot", () => {
// https://on.cypress.io/screenshot
cy.screenshot("my-image");
});
it("Cypress.Screenshot.defaults() - change default config of screenshots", function () {
Cypress.Screenshot.defaults({
blackout: [".foo"],
capture: "viewport",
clip: { x: 0, y: 0, width: 200, height: 200 },
scale: false,
disableTimersAndAnimations: true,
screenshotOnRunFailure: true,
onBeforeScreenshot() {},
onAfterScreenshot() {}
});
});
});
it("cy.wrap() - wrap an object", () => {
// https://on.cypress.io/wrap
cy.wrap({ foo: "bar" }).should("have.property", "foo").and("include", "bar");
});
});

View File

@@ -0,0 +1,56 @@
/// <reference types="cypress" />
context("Navigation", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io");
cy.get(".navbar-nav").contains("Commands").click();
cy.get(".dropdown-menu").contains("Navigation").click();
});
it("cy.go() - go back or forward in the browser's history", () => {
// https://on.cypress.io/go
cy.location("pathname").should("include", "navigation");
cy.go("back");
cy.location("pathname").should("not.include", "navigation");
cy.go("forward");
cy.location("pathname").should("include", "navigation");
// clicking back
cy.go(-1);
cy.location("pathname").should("not.include", "navigation");
// clicking forward
cy.go(1);
cy.location("pathname").should("include", "navigation");
});
it("cy.reload() - reload the page", () => {
// https://on.cypress.io/reload
cy.reload();
// reload the page without using the cache
cy.reload(true);
});
it("cy.visit() - visit a remote url", () => {
// https://on.cypress.io/visit
// Visit any sub-domain of your current domain
// Pass options to the visit
cy.visit("https://example.cypress.io/commands/navigation", {
timeout: 50000, // increase total time for the visit to resolve
onBeforeLoad(contentWindow) {
// contentWindow is the remote page's window object
expect(typeof contentWindow === "object").to.be.true;
},
onLoad(contentWindow) {
// contentWindow is the remote page's window object
expect(typeof contentWindow === "object").to.be.true;
}
});
});
});

View File

@@ -0,0 +1,165 @@
/// <reference types="cypress" />
context("Network Requests", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/network-requests");
});
// Manage HTTP requests in your app
it("cy.request() - make an XHR request", () => {
// https://on.cypress.io/request
cy.request("https://jsonplaceholder.cypress.io/comments").should((response) => {
expect(response.status).to.eq(200);
// the server sometimes gets an extra comment posted from another machine
// which gets returned as 1 extra object
expect(response.body).to.have.property("length").and.be.oneOf([500, 501]);
expect(response).to.have.property("headers");
expect(response).to.have.property("duration");
});
});
it("cy.request() - verify response using BDD syntax", () => {
cy.request("https://jsonplaceholder.cypress.io/comments").then((response) => {
// https://on.cypress.io/assertions
expect(response).property("status").to.equal(200);
expect(response).property("body").to.have.property("length").and.be.oneOf([500, 501]);
expect(response).to.include.keys("headers", "duration");
});
});
it("cy.request() with query parameters", () => {
// will execute request
// https://jsonplaceholder.cypress.io/comments?postId=1&id=3
cy.request({
url: "https://jsonplaceholder.cypress.io/comments",
qs: {
postId: 1,
id: 3
}
})
.its("body")
.should("be.an", "array")
.and("have.length", 1)
.its("0") // yields first element of the array
.should("contain", {
postId: 1,
id: 3
});
});
it("cy.request() - pass result to the second request", () => {
// first, let's find out the userId of the first user we have
cy.request("https://jsonplaceholder.cypress.io/users?_limit=1")
.its("body") // yields the response object
.its("0") // yields the first element of the returned list
// the above two commands its('body').its('0')
// can be written as its('body.0')
// if you do not care about TypeScript checks
.then((user) => {
expect(user).property("id").to.be.a("number");
// make a new post on behalf of the user
cy.request("POST", "https://jsonplaceholder.cypress.io/posts", {
userId: user.id,
title: "Cypress Test Runner",
body: "Fast, easy and reliable testing for anything that runs in a browser."
});
})
// note that the value here is the returned value of the 2nd request
// which is the new post object
.then((response) => {
expect(response).property("status").to.equal(201); // new entity created
expect(response).property("body").to.contain({
title: "Cypress Test Runner"
});
// we don't know the exact post id - only that it will be > 100
// since JSONPlaceholder has built-in 100 posts
expect(response.body).property("id").to.be.a("number").and.to.be.gt(100);
// we don't know the user id here - since it was in above closure
// so in this test just confirm that the property is there
expect(response.body).property("userId").to.be.a("number");
});
});
it("cy.request() - save response in the shared test context", () => {
// https://on.cypress.io/variables-and-aliases
cy.request("https://jsonplaceholder.cypress.io/users?_limit=1")
.its("body")
.its("0") // yields the first element of the returned list
.as("user") // saves the object in the test context
.then(function () {
// NOTE 👀
// By the time this callback runs the "as('user')" command
// has saved the user object in the test context.
// To access the test context we need to use
// the "function () { ... }" callback form,
// otherwise "this" points at a wrong or undefined object!
cy.request("POST", "https://jsonplaceholder.cypress.io/posts", {
userId: this.user.id,
title: "Cypress Test Runner",
body: "Fast, easy and reliable testing for anything that runs in a browser."
})
.its("body")
.as("post"); // save the new post from the response
})
.then(function () {
// When this callback runs, both "cy.request" API commands have finished
// and the test context has "user" and "post" objects set.
// Let's verify them.
expect(this.post, "post has the right user id").property("userId").to.equal(this.user.id);
});
});
it("cy.intercept() - route responses to matching requests", () => {
// https://on.cypress.io/intercept
let message = "whoa, this comment does not exist";
// Listen to GET to comments/1
cy.intercept("GET", "**/comments/*").as("getComment");
// we have code that gets a comment when
// the button is clicked in scripts.js
cy.get(".network-btn").click();
// https://on.cypress.io/wait
cy.wait("@getComment").its("response.statusCode").should("be.oneOf", [200, 304]);
// Listen to POST to comments
cy.intercept("POST", "**/comments").as("postComment");
// we have code that posts a comment when
// the button is clicked in scripts.js
cy.get(".network-post").click();
cy.wait("@postComment").should(({ request, response }) => {
expect(request.body).to.include("email");
expect(request.headers).to.have.property("content-type");
expect(response && response.body).to.have.property("name", "Using POST in cy.intercept()");
});
// Stub a response to PUT comments/ ****
cy.intercept(
{
method: "PUT",
url: "**/comments/*"
},
{
statusCode: 404,
body: { error: message },
headers: { "access-control-allow-origin": "*" },
delayMs: 500
}
).as("putComment");
// we have code that puts a comment when
// the button is clicked in scripts.js
cy.get(".network-put").click();
cy.wait("@putComment");
// our 404 statusCode logic in scripts.js executed
cy.get(".network-put-comment").should("contain", message);
});
});

View File

@@ -0,0 +1,100 @@
/// <reference types="cypress" />
context("Querying", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/querying");
});
// The most commonly used query is 'cy.get()', you can
// think of this like the '$' in jQuery
it("cy.get() - query DOM elements", () => {
// https://on.cypress.io/get
cy.get("#query-btn").should("contain", "Button");
cy.get(".query-btn").should("contain", "Button");
cy.get("#querying .well>button:first").should("contain", "Button");
// ↲
// Use CSS selectors just like jQuery
cy.get('[data-test-id="test-example"]').should("have.class", "example");
// 'cy.get()' yields jQuery object, you can get its attribute
// by invoking `.attr()` method
cy.get('[data-test-id="test-example"]').invoke("attr", "data-test-id").should("equal", "test-example");
// or you can get element's CSS property
cy.get('[data-test-id="test-example"]').invoke("css", "position").should("equal", "static");
// or use assertions directly during 'cy.get()'
// https://on.cypress.io/assertions
cy.get('[data-test-id="test-example"]')
.should("have.attr", "data-test-id", "test-example")
.and("have.css", "position", "static");
});
it("cy.contains() - query DOM elements with matching content", () => {
// https://on.cypress.io/contains
cy.get(".query-list").contains("bananas").should("have.class", "third");
// we can pass a regexp to `.contains()`
cy.get(".query-list").contains(/^b\w+/).should("have.class", "third");
cy.get(".query-list").contains("apples").should("have.class", "first");
// passing a selector to contains will
// yield the selector containing the text
cy.get("#querying").contains("ul", "oranges").should("have.class", "query-list");
cy.get(".query-button").contains("Save Form").should("have.class", "btn");
});
it(".within() - query DOM elements within a specific element", () => {
// https://on.cypress.io/within
cy.get(".query-form").within(() => {
cy.get("input:first").should("have.attr", "placeholder", "Email");
cy.get("input:last").should("have.attr", "placeholder", "Password");
});
});
it("cy.root() - query the root DOM element", () => {
// https://on.cypress.io/root
// By default, root is the document
cy.root().should("match", "html");
cy.get(".query-ul").within(() => {
// In this within, the root is now the ul DOM element
cy.root().should("have.class", "query-ul");
});
});
it("best practices - selecting elements", () => {
// https://on.cypress.io/best-practices#Selecting-Elements
cy.get("[data-cy=best-practices-selecting-elements]").within(() => {
// Worst - too generic, no context
cy.get("button").click();
// Bad. Coupled to styling. Highly subject to change.
cy.get(".btn.btn-large").click();
// Average. Coupled to the `name` attribute which has HTML semantics.
cy.get("[name=submission]").click();
// Better. But still coupled to styling or JS event listeners.
cy.get("#main").click();
// Slightly better. Uses an ID but also ensures the element
// has an ARIA role attribute
cy.get("#main[role=button]").click();
// Much better. But still coupled to text content that may change.
cy.contains("Submit").click();
// Best. Insulated from all changes.
cy.get("[data-cy=submit]").click();
});
});
});

View File

@@ -0,0 +1,203 @@
/// <reference types="cypress" />
// remove no check once Cypress.sinon is typed
// https://github.com/cypress-io/cypress/issues/6720
context("Spies, Stubs, and Clock", () => {
it("cy.spy() - wrap a method in a spy", () => {
// https://on.cypress.io/spy
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks");
const obj = {
foo() {}
};
const spy = cy.spy(obj, "foo").as("anyArgs");
obj.foo();
expect(spy).to.be.called;
});
it("cy.spy() retries until assertions pass", () => {
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks");
const obj = {
/**
* Prints the argument passed
* @param x {any}
*/
foo(x) {
console.log("obj.foo called with", x);
}
};
cy.spy(obj, "foo").as("foo");
setTimeout(() => {
obj.foo("first");
}, 500);
setTimeout(() => {
obj.foo("second");
}, 2500);
cy.get("@foo").should("have.been.calledTwice");
});
it("cy.stub() - create a stub and/or replace a function with stub", () => {
// https://on.cypress.io/stub
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks");
const obj = {
/**
* prints both arguments to the console
* @param a {string}
* @param b {string}
*/
foo(a, b) {
console.log("a", a, "b", b);
}
};
const stub = cy.stub(obj, "foo").as("foo");
obj.foo("foo", "bar");
expect(stub).to.be.called;
});
it("cy.clock() - control time in the browser", () => {
// https://on.cypress.io/clock
// create the date in UTC so its always the same
// no matter what local timezone the browser is running in
const now = new Date(Date.UTC(2017, 2, 14)).getTime();
cy.clock(now);
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks");
cy.get("#clock-div").click().should("have.text", "1489449600");
});
it("cy.tick() - move time in the browser", () => {
// https://on.cypress.io/tick
// create the date in UTC so its always the same
// no matter what local timezone the browser is running in
const now = new Date(Date.UTC(2017, 2, 14)).getTime();
cy.clock(now);
cy.visit("https://example.cypress.io/commands/spies-stubs-clocks");
cy.get("#tick-div").click().should("have.text", "1489449600");
cy.tick(10000); // 10 seconds passed
cy.get("#tick-div").click().should("have.text", "1489449610");
});
it("cy.stub() matches depending on arguments", () => {
// see all possible matchers at
// https://sinonjs.org/releases/latest/matchers/
const greeter = {
/**
* Greets a person
* @param {string} name
*/
greet(name) {
return `Hello, ${name}!`;
}
};
cy.stub(greeter, "greet")
.callThrough() // if you want non-matched calls to call the real method
.withArgs(Cypress.sinon.match.string)
.returns("Hi")
.withArgs(Cypress.sinon.match.number)
.throws(new Error("Invalid name"));
expect(greeter.greet("World")).to.equal("Hi");
// @ts-ignore
expect(() => greeter.greet(42)).to.throw("Invalid name");
expect(greeter.greet).to.have.been.calledTwice;
// non-matched calls goes the actual method
// @ts-ignore
expect(greeter.greet()).to.equal("Hello, undefined!");
});
it("matches call arguments using Sinon matchers", () => {
// see all possible matchers at
// https://sinonjs.org/releases/latest/matchers/
const calculator = {
/**
* returns the sum of two arguments
* @param a {number}
* @param b {number}
*/
add(a, b) {
return a + b;
}
};
const spy = cy.spy(calculator, "add").as("add");
expect(calculator.add(2, 3)).to.equal(5);
// if we want to assert the exact values used during the call
expect(spy).to.be.calledWith(2, 3);
// let's confirm "add" method was called with two numbers
expect(spy).to.be.calledWith(Cypress.sinon.match.number, Cypress.sinon.match.number);
// alternatively, provide the value to match
expect(spy).to.be.calledWith(Cypress.sinon.match(2), Cypress.sinon.match(3));
// match any value
expect(spy).to.be.calledWith(Cypress.sinon.match.any, 3);
// match any value from a list
expect(spy).to.be.calledWith(Cypress.sinon.match.in([1, 2, 3]), 3);
/**
* Returns true if the given number is event
* @param {number} x
*/
const isEven = (x) => x % 2 === 0;
// expect the value to pass a custom predicate function
// the second argument to "sinon.match(predicate, message)" is
// shown if the predicate does not pass and assertion fails
expect(spy).to.be.calledWith(Cypress.sinon.match(isEven, "isEven"), 3);
/**
* Returns a function that checks if a given number is larger than the limit
* @param {number} limit
* @returns {(x: number) => boolean}
*/
const isGreaterThan = (limit) => (x) => x > limit;
/**
* Returns a function that checks if a given number is less than the limit
* @param {number} limit
* @returns {(x: number) => boolean}
*/
const isLessThan = (limit) => (x) => x < limit;
// you can combine several matchers using "and", "or"
expect(spy).to.be.calledWith(
Cypress.sinon.match.number,
Cypress.sinon.match(isGreaterThan(2), "> 2").and(Cypress.sinon.match(isLessThan(4), "< 4"))
);
expect(spy).to.be.calledWith(
Cypress.sinon.match.number,
Cypress.sinon.match(isGreaterThan(200), "> 200").or(Cypress.sinon.match(3))
);
// matchers can be used from BDD assertions
cy.get("@add").should("have.been.calledWith", Cypress.sinon.match.number, Cypress.sinon.match(3));
// you can alias matchers for shorter test code
const { match: M } = Cypress.sinon;
cy.get("@add").should("have.been.calledWith", M.number, M(3));
});
});

View File

@@ -0,0 +1,97 @@
/// <reference types="cypress" />
context("Traversal", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/traversal");
});
it(".children() - get child DOM elements", () => {
// https://on.cypress.io/children
cy.get(".traversal-breadcrumb").children(".active").should("contain", "Data");
});
it(".closest() - get closest ancestor DOM element", () => {
// https://on.cypress.io/closest
cy.get(".traversal-badge").closest("ul").should("have.class", "list-group");
});
it(".eq() - get a DOM element at a specific index", () => {
// https://on.cypress.io/eq
cy.get(".traversal-list>li").eq(1).should("contain", "siamese");
});
it(".filter() - get DOM elements that match the selector", () => {
// https://on.cypress.io/filter
cy.get(".traversal-nav>li").filter(".active").should("contain", "About");
});
it(".find() - get descendant DOM elements of the selector", () => {
// https://on.cypress.io/find
cy.get(".traversal-pagination").find("li").find("a").should("have.length", 7);
});
it(".first() - get first DOM element", () => {
// https://on.cypress.io/first
cy.get(".traversal-table td").first().should("contain", "1");
});
it(".last() - get last DOM element", () => {
// https://on.cypress.io/last
cy.get(".traversal-buttons .btn").last().should("contain", "Submit");
});
it(".next() - get next sibling DOM element", () => {
// https://on.cypress.io/next
cy.get(".traversal-ul").contains("apples").next().should("contain", "oranges");
});
it(".nextAll() - get all next sibling DOM elements", () => {
// https://on.cypress.io/nextall
cy.get(".traversal-next-all").contains("oranges").nextAll().should("have.length", 3);
});
it(".nextUntil() - get next sibling DOM elements until next el", () => {
// https://on.cypress.io/nextuntil
cy.get("#veggies").nextUntil("#nuts").should("have.length", 3);
});
it(".not() - remove DOM elements from set of DOM elements", () => {
// https://on.cypress.io/not
cy.get(".traversal-disabled .btn").not("[disabled]").should("not.contain", "Disabled");
});
it(".parent() - get parent DOM element from DOM elements", () => {
// https://on.cypress.io/parent
cy.get(".traversal-mark").parent().should("contain", "Morbi leo risus");
});
it(".parents() - get parent DOM elements from DOM elements", () => {
// https://on.cypress.io/parents
cy.get(".traversal-cite").parents().should("match", "blockquote");
});
it(".parentsUntil() - get parent DOM elements from DOM elements until el", () => {
// https://on.cypress.io/parentsuntil
cy.get(".clothes-nav").find(".active").parentsUntil(".clothes-nav").should("have.length", 2);
});
it(".prev() - get previous sibling DOM element", () => {
// https://on.cypress.io/prev
cy.get(".birds").find(".active").prev().should("contain", "Lorikeets");
});
it(".prevAll() - get all previous sibling DOM elements", () => {
// https://on.cypress.io/prevall
cy.get(".fruits-list").find(".third").prevAll().should("have.length", 2);
});
it(".prevUntil() - get all previous sibling DOM elements until el", () => {
// https://on.cypress.io/prevuntil
cy.get(".foods-list").find("#nuts").prevUntil("#veggies").should("have.length", 3);
});
it(".siblings() - get all sibling DOM elements", () => {
// https://on.cypress.io/siblings
cy.get(".traversal-pills .active").siblings().should("have.length", 2);
});
});

View File

@@ -0,0 +1,108 @@
/// <reference types="cypress" />
context("Utilities", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/utilities");
});
it("Cypress._ - call a lodash method", () => {
// https://on.cypress.io/_
cy.request("https://jsonplaceholder.cypress.io/users").then((response) => {
let ids = Cypress._.chain(response.body).map("id").take(3).value();
expect(ids).to.deep.eq([1, 2, 3]);
});
});
it("Cypress.$ - call a jQuery method", () => {
// https://on.cypress.io/$
let $li = Cypress.$(".utility-jquery li:first");
cy.wrap($li).should("not.have.class", "active").click().should("have.class", "active");
});
it("Cypress.Blob - blob utilities and base64 string conversion", () => {
// https://on.cypress.io/blob
cy.get(".utility-blob").then(($div) => {
// https://github.com/nolanlawson/blob-util#imgSrcToDataURL
// get the dataUrl string for the javascript-logo
return Cypress.Blob.imgSrcToDataURL(
"https://example.cypress.io/assets/img/javascript-logo.png",
undefined,
"anonymous"
).then((dataUrl) => {
// create an <img> element and set its src to the dataUrl
let img = Cypress.$("<img />", { src: dataUrl });
// need to explicitly return cy here since we are initially returning
// the Cypress.Blob.imgSrcToDataURL promise to our test
// append the image
$div.append(img);
cy.get(".utility-blob img").click().should("have.attr", "src", dataUrl);
});
});
});
it("Cypress.minimatch - test out glob patterns against strings", () => {
// https://on.cypress.io/minimatch
let matching = Cypress.minimatch("/users/1/comments", "/users/*/comments", {
matchBase: true
});
expect(matching, "matching wildcard").to.be.true;
matching = Cypress.minimatch("/users/1/comments/2", "/users/*/comments", {
matchBase: true
});
expect(matching, "comments").to.be.false;
// ** matches against all downstream path segments
matching = Cypress.minimatch("/foo/bar/baz/123/quux?a=b&c=2", "/foo/**", {
matchBase: true
});
expect(matching, "comments").to.be.true;
// whereas * matches only the next path segment
matching = Cypress.minimatch("/foo/bar/baz/123/quux?a=b&c=2", "/foo/*", {
matchBase: false
});
expect(matching, "comments").to.be.false;
});
it("Cypress.Promise - instantiate a bluebird promise", () => {
// https://on.cypress.io/promise
let waited = false;
/**
* @return Bluebird<string>
*/
function waitOneSecond() {
// return a promise that resolves after 1 second
// @ts-ignore TS2351 (new Cypress.Promise)
return new Cypress.Promise((resolve, reject) => {
setTimeout(() => {
// set waited to true
waited = true;
// resolve with 'foo' string
resolve("foo");
}, 1000);
});
}
cy.then(() => {
// return a promise to cy.then() that
// is awaited until it resolves
// @ts-ignore TS7006
return waitOneSecond().then((str) => {
expect(str).to.eq("foo");
expect(waited).to.be.true;
});
});
});
});

View File

@@ -0,0 +1,59 @@
/// <reference types="cypress" />
context("Viewport", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/viewport");
});
it("cy.viewport() - set the viewport size and dimension", () => {
// https://on.cypress.io/viewport
cy.get("#navbar").should("be.visible");
cy.viewport(320, 480);
// the navbar should have collapse since our screen is smaller
cy.get("#navbar").should("not.be.visible");
cy.get(".navbar-toggle").should("be.visible").click();
cy.get(".nav").find("a").should("be.visible");
// lets see what our app looks like on a super large screen
cy.viewport(2999, 2999);
// cy.viewport() accepts a set of preset sizes
// to easily set the screen to a device's width and height
// We added a cy.wait() between each viewport change so you can see
// the change otherwise it is a little too fast to see :)
cy.viewport("macbook-15");
cy.wait(200);
cy.viewport("macbook-13");
cy.wait(200);
cy.viewport("macbook-11");
cy.wait(200);
cy.viewport("ipad-2");
cy.wait(200);
cy.viewport("ipad-mini");
cy.wait(200);
cy.viewport("iphone-6+");
cy.wait(200);
cy.viewport("iphone-6");
cy.wait(200);
cy.viewport("iphone-5");
cy.wait(200);
cy.viewport("iphone-4");
cy.wait(200);
cy.viewport("iphone-3");
cy.wait(200);
// cy.viewport() accepts an orientation for all presets
// the default orientation is 'portrait'
cy.viewport("ipad-2", "portrait");
cy.wait(200);
cy.viewport("iphone-4", "landscape");
cy.wait(200);
// The viewport will be reset back to the default dimensions
// in between tests (the default can be set in cypress.json)
});
});

View File

@@ -0,0 +1,31 @@
/// <reference types="cypress" />
context("Waiting", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/waiting");
});
// BE CAREFUL of adding unnecessary wait times.
// https://on.cypress.io/best-practices#Unnecessary-Waiting
// https://on.cypress.io/wait
it("cy.wait() - wait for a specific amount of time", () => {
cy.get(".wait-input1").type("Wait 1000ms after typing");
cy.wait(1000);
cy.get(".wait-input2").type("Wait 1000ms after typing");
cy.wait(1000);
cy.get(".wait-input3").type("Wait 1000ms after typing");
cy.wait(1000);
});
it("cy.wait() - wait for a specific route", () => {
// Listen to GET to comments/1
cy.intercept("GET", "**/comments/*").as("getComment");
// we have code that gets a comment when
// the button is clicked in scripts.js
cy.get(".network-btn").click();
// wait for GET comments/1
cy.wait("@getComment").its("response.statusCode").should("be.oneOf", [200, 304]);
});
});

View File

@@ -0,0 +1,22 @@
/// <reference types="cypress" />
context("Window", () => {
beforeEach(() => {
cy.visit("https://example.cypress.io/commands/window");
});
it("cy.window() - get the global window object", () => {
// https://on.cypress.io/window
cy.window().should("have.property", "top");
});
it("cy.document() - get the document object", () => {
// https://on.cypress.io/document
cy.document().should("have.property", "charset").and("eq", "UTF-8");
});
it("cy.title() - get the title", () => {
// https://on.cypress.io/title
cy.title().should("include", "Kitchen Sink");
});
});

View File

@@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}

View File

@@ -0,0 +1,5 @@
{
"id": 8739,
"name": "Jane",
"email": "jane@example.com"
}

View File

@@ -0,0 +1 @@
[]

Some files were not shown because too many files have changed in this diff Show More