Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Update Demo for Explore. #76

Closed
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
69 commits
Select commit Hold shift + click to select a range
eeacfd6
Typescript fixes
Aug 26, 2024
0885d7a
add tas config
Aug 27, 2024
9dbe541
[#188115649] App team can lean on Journey Testing for Quality Assurance.
Aug 27, 2024
e77636a
[#188115649] - Add simple Assistant chat AI cypress test.
pivot-carlos-poon Aug 27, 2024
4337b71
Address rebase where we removed spring-react-app earlier
pivot-carlos-poon Aug 29, 2024
8e36ecf
[#188180076] - Introduce logout for React-UI
pivot-carlos-poon Aug 30, 2024
6c8e0dd
[#188193919] - Fix ES Lint
Aug 26, 2024
40056a0
[#188214243] Address issues viewing the React UI app in mobile
Sep 3, 2024
3f27ecd
Replaced UI with react app
Sep 4, 2024
07a791a
Synced app name from manifest.yml & removed dist folder in deprecated…
Sep 5, 2024
81b2407
Fix theme typescript errors
Sep 5, 2024
df9c5d8
Update Readme and include frontend-routes.json.
pivot-carlos-poon Sep 11, 2024
02b5a93
basic scaffolding for form injection
Sep 12, 2024
ae45b8c
Completed basic scaffolding for bike recommendation flow
Sep 12, 2024
2e7f741
Updated styling for forms
Sep 12, 2024
45e3e1b
update communication model for chat
Sep 13, 2024
9d58c19
Refactoring for WebSocket API over socket.io
Sep 13, 2024
427e35d
Update image paths for build path for Static built version.
pivot-carlos-poon Sep 16, 2024
68e5667
update bike recommendation flow images
Sep 16, 2024
47578e5
Add fake recommendation (hardcoded response)
Sep 17, 2024
8d22ca8
Updated styling and UX for FitAssist chat UI flow
Sep 18, 2024
ae4c0d8
ParseAndBuildLink Fix
Sep 18, 2024
3c60097
ParseAndBuildLink Fix
Sep 18, 2024
9d5879a
chore: move assets to /public
willsather Sep 18, 2024
36c860b
chore: small local setup improvements
willsather Sep 18, 2024
a024857
chore: improve product page responsiveness
willsather Sep 18, 2024
cc7d9f0
fix: differing fonts in footer
willsather Sep 18, 2024
eb6cdca
chore: improve footer styling
willsather Sep 18, 2024
08d162c
chore: improve home and contact styling
willsather Sep 18, 2024
215c02c
fix: catalog carousel responsiveness
willsather Sep 18, 2024
5a7bffd
chore: improve credit card icons
willsather Sep 18, 2024
7d53819
chore: Remove carousel outline. Fix Cart layout. Update product pag…
Sep 23, 2024
ab5a22f
deploy(#188391097): `acme-catalog` to tanzu platform for k8s (#6)
willsather Oct 8, 2024
b8c8a3c
fix: router dom links
willsather Oct 8, 2024
52a41f3
feat(#188391109): add new home page and base tailwind
willsather Oct 8, 2024
a64cfa3
chore: improve footer styling
willsather Oct 9, 2024
76887e7
fix(#188391098): tpk8s catalog postgres binding
willsather Oct 9, 2024
b0f47a5
[#188391102] - Update acme-assist to talk to tpK8s catalog.
pivot-carlos-poon Oct 9, 2024
fa2cc79
chore: improve nav bar styling
willsather Oct 9, 2024
3c27f92
[#188391235] - Refactor summarize cart to not be required on send cha…
pivot-carlos-poon Oct 9, 2024
e1df9ba
chore: improve chat modal trigger styles
willsather Oct 9, 2024
510fd1e
chore: improve chat modal styles
willsather Oct 9, 2024
7e6963f
fix: react router static urls
willsather Oct 9, 2024
04a5a32
fix: cart user info race condition
willsather Oct 9, 2024
a6d2bb9
feat: improve bikes and accessory pages
willsather Oct 10, 2024
12e1dc6
chore: improve sign in button styles
willsather Oct 10, 2024
f1c3133
chore: improve product page styles
willsather Oct 10, 2024
9a62a7a
fix: add basic faq page
willsather Oct 10, 2024
9e9ea39
chore: add basic resources pages
willsather Oct 10, 2024
3638b07
chore: improve cart page styling
willsather Oct 10, 2024
5cafc3f
chore: add serif font
willsather Oct 10, 2024
d9b3afa
chore: update hero image
willsather Oct 10, 2024
81ab425
fix: product card image fit
willsather Oct 10, 2024
e4cdec2
fix: broken chat modal with cart
willsather Oct 10, 2024
6c5a266
fix: chat modal message styles
willsather Oct 11, 2024
18fe0d0
chore(#188391109): update checkout flow styling
willsather Oct 11, 2024
8217e9b
fix: increase number of products displayed at larger breakpoints
Oct 11, 2024
5fc7786
WIP - Update Chat Modal via pairing
pivot-carlos-poon Oct 11, 2024
b32404f
fix: home cta url
willsather Oct 14, 2024
ef43789
feat(#188398505): finish chat modal styling
willsather Oct 14, 2024
2d65175
feat(#188398505): chat modal container styles
willsather Oct 14, 2024
3762b6a
feat(#188415825): refactor terrain form styles
willsather Oct 14, 2024
55ea77f
feat(#188415825): refactor riding position form styles
willsather Oct 14, 2024
5d45702
wip: height selector
willsather Oct 14, 2024
e5e8180
fix: height form and fake recommendation ui
willsather Oct 14, 2024
b9f8b8f
fix: add magic icon
willsather Oct 14, 2024
77852bc
chore: remove unused styled components
willsather Oct 14, 2024
2fe3bed
feature - load a default catalog if there is an error
Oct 16, 2024
64945a4
Update cypress test for new UI
Nov 18, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -63,3 +63,6 @@ hello-world/
# Cypress
**/cypress/downloads
**/cypress/screenshots

# tanzu
build-output
99 changes: 73 additions & 26 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,51 +1,57 @@
# ACME Fitness Store

ACME Fitness store is a fictional online retailer selling sporting goods. This repo contains the source code and deployment scripts for the ACME Fitness store application.
ACME Fitness store is a fictional, online sporting goods retail store. This repository contains the source code and
deployment resources for the ACME Fitness store application.

## Architecture

## High Level Architecture
![An image showing the services involved in the ACME Fitness Store. It depicts the applications and their dependencies](media/acme-fitness-store-architecture.png)

This application is composed of several services:

* 4 Java Spring Boot applications:
* A catalog service for fetching available products.
* A payment service for processing and approving payments for users' orders
* An identity service for referencing the authenticated user
* An assist service for infusing AI into fitness store
- A catalog service for fetching available products.
- A payment service for processing and approving payments for users' orders
- An identity service for referencing the authenticated user
- An assist service for infusing AI into fitness store

* 1 Python application:
* A cart service for managing a users' items that have been selected for purchase
- A cart service for managing a users' items that have been selected for purchase

* 1 ASP.NET Core applications:
* An order service for placing orders to buy products that are in the users' carts
- An order service for placing orders to buy products that are in the users' carts

* 1 NodeJS and static HTML Application
* A frontend shopping application
* 1 Node.js and static HTML Application
- A frontend shopping application

The sample can be deployed to Azure Spring Apps Enterprise or Tanzu Application Platform.
The sample can be deployed to Azure Spring Apps Enterprise or Tanzu Platform.

## Repo Organization

| Directory | Purpose |
| ---------------------------------------------------------------- | ------------- |
| [apps/](./apps) | source code for the services |
| Directory | Purpose |
|-------------------------------------------|-----------------------------------------------------------------------------|
| [apps/](./apps) | source code for the services |
| [e2e/](./e2e) | end to end frontend tests |
| [local-development/](./local-development) | local docker configuration ([documentation](./local-development/README.md)) |

## Deployment

================================================================
## Deploy on Tanzu Platform for Cloud Foundry (TPCF aka TAS)
### Tanzu Platform for Cloud Foundry (tPCF aka TAS)

Assumption that the proper Cloud Foundry CLI has been installed.

#### Create Services

```bash
cf create-service p.redis on-demand-cache acme-redis
cf create-service postgres on-demand-postgres-db acme-postgres
cf create-service postgres on-demand-postgres-db acme-assist-postgres
cf create-service postgres on-demand-postgres-db acme-order-postgres

# This sets up your TAS/TPCF config server. It assumes that your config files are located at <this-repository-url> in the branch config (label) under the directory config (searchPaths). You can checkout the branch to see the structure if you like.
# This sets up your TAS/tPCF config server. It assumes that your config files are located at <this-repository-url> in the branch config (label) under the directory config (searchPaths). You can checkout the branch to see the structure if you like.
cf create-service p.config-server standard acme-config -c '{ "git": { "uri": "<this-repository-url>", "label": "config", "searchPaths": "config" } }'

# This assumes Tanzu Single Sign on for TAS/TPCF is installed and configured against UAA. You can also use other identity providers if you change the plan and binding below.
# This assumes Tanzu Single Sign on for TAS/tPCF is installed and configured against UAA. You can also use other identity providers if you change the plan and binding below.
cf create-service p-identity uaa acme-sso
cf create-service p.service-registry standard acme-registry
cf create-service p.gateway standard acme-gateway -c '{"sso": { "plan": "uaa", "scopes": ["openid", "profile", "email"] }, "host": "acme-fitness" ,"cors": { "allowed-origins": [ "*" ] }}'
Expand All @@ -56,6 +62,7 @@ cf create-service genai <EMBED MODEL PLAN> acme-genai-embed
```

#### Identity Service

```bash
cd acme-identity
./gradlew assemble
Expand All @@ -75,7 +82,9 @@ cf bind-service acme-identity acme-gateway -c identity-routes.json
cf start acme-identity

```

#### Cart Service

```bash
cd ../acme-cart
cf push --no-start
Expand All @@ -84,6 +93,7 @@ cf start acme-cart
```

#### Payment Service

```bash
cd ../acme-payment
./gradlew assemble
Expand All @@ -93,6 +103,7 @@ cf start acme-payment
```

#### Catalog Service

```bash
cd ../acme-catalog
./gradlew clean assemble
Expand All @@ -102,6 +113,7 @@ cf start acme-catalog
```

#### Acme Assist

```bash
cd ../acme-assist
./gradlew clean assemble
Expand All @@ -114,6 +126,7 @@ cf start acme-assist
```

#### Order Service

```bash
cd ../acme-order
dotnet publish -r linux-x64
Expand All @@ -124,24 +137,58 @@ cf start acme-order
```

#### Shopping Service

```bash
cd ../acme-shopping-react
npm install
npm run build
cf push --no-start
cf bind-service acme-shopping acme-gateway -c frontend-routes.json
cf start acme-shopping
```
=================================================

Note: ensure that the environment variable for TAS has
`SPRING_MVC_STATIC_PATH_PATTERN: /static/images/**` set. Currently have an issue with the value taken from config server being overwritten.

## Local Development setup
- [Local Development guide](local-development/README.md)
> [!NOTE]
> Ensure that the environment variable for TAS has `SPRING_MVC_STATIC_PATH_PATTERN: /static/images/**` set. Currently,
> there is an issue with the value taken from config server being overwritten.

## TAS Development Tricks
#### tPCF Development Tricks

### Connecting to Database
##### Connecting to Database

https://docs.cloudfoundry.org/devguide/deploy-apps/ssh-services.html

`cf ssh -L 65432:{host-of-database-on-TAS}:5432 {application-name}`

## Deploy on Tanzu Platform for Kubernetes (tPk8s)

Assume Tanzu Platform has been configured with a project, space, and clusters.

> [!NOTE]
> These steps are only relevant for deploying `acme-catalog`

1. Install Tanzu CLI ([documentation](https://docs.vmware.com/en/VMware-Tanzu-CLI/1.4/tanzu-cli/index.html))
```bash
brew update
brew install vmware-tanzu/tanzu/tanzu-cli
```

2. Install the Tanzu Platform plugin
group ([documentation](https://docs.vmware.com/en/VMware-Tanzu-CLI/1.4/tanzu-cli/tanzu-plugin.html#tanzu-plugin-install-8))
```bash
tanzu plugin install --group vmware-tanzu/app-developer
```

3. Login to Tanzu Platform and set project / space scope
```bash
tanzu login
tanzu project use
tanzu space use
```

> [!TIP]
> This can be verified using `tanzu context current`

4. Build the application using buildpacks and deploy.
```bash
tanzu deploy
```
2 changes: 1 addition & 1 deletion apps/acme-assist/manifest.yml
Original file line number Diff line number Diff line change
Expand Up @@ -14,5 +14,5 @@ applications:
- route: acme-assist.apps.internal
env:
JBP_CONFIG_SPRING_AUTO_RECONFIGURATION: '{enabled: false}'
SPRING_PROFILES_ACTIVE: http2,cloud
SPRING_PROFILES_ACTIVE: http2,cloud,k8s
JBP_CONFIG_OPEN_JDK_JRE: '{ jre: { version: 21.+ } }'
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
import org.apache.logging.log4j.util.Strings;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.cloud.client.ServiceInstance;
import org.springframework.cloud.client.discovery.DiscoveryClient;
import org.springframework.http.ResponseEntity;
Expand All @@ -20,6 +21,9 @@
@Repository
public class ProductRepository {

@Value("${app.catalog.url:default}")
private String catalogUrl;

private static final Logger log = LoggerFactory.getLogger(ProductRepository.class);
private static List<Product> products;
private final RestTemplate restTemplate = new RestTemplate();
Expand All @@ -28,7 +32,10 @@ public class ProductRepository {
public ProductRepository(DiscoveryClient discoveryClient) {
this.discoveryClient = discoveryClient;
}
private String getCatalogService() {
private String getCatalogServiceUrl() {
if ( catalogUrl != null && !catalogUrl.equals("default")) {
return catalogUrl;
}
List<ServiceInstance> services = discoveryClient.getInstances("acme-catalog");
if (services.size() > 0)
return services.get(0).getUri().toString();
Expand All @@ -43,7 +50,7 @@ public Product getProductById(String id) {
return null;
}
try {
String catalogService = getCatalogService();
String catalogService = getCatalogServiceUrl();
if (catalogService == null)
return null;

Expand All @@ -57,7 +64,7 @@ public Product getProductById(String id) {
}

public void refreshProductList() {
String catalogService = getCatalogService();
String catalogService = getCatalogServiceUrl();
if (catalogService == null)
return;
ResponseEntity<CatalogProductListResponse> response = this.restTemplate
Expand All @@ -68,7 +75,7 @@ public void refreshProductList() {
@PostConstruct
public List<Product> getProductList() {
if (products == null) {
String catalogService = getCatalogService();
String catalogService = getCatalogServiceUrl();
if (catalogService == null)
return new ArrayList<Product>();

Expand Down
3 changes: 3 additions & 0 deletions apps/acme-assist/src/main/resources/application-k8s.yaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
app:
catalog:
url: http://acme-fitness-catalog.vmtanzu.net
3 changes: 3 additions & 0 deletions apps/acme-catalog/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -35,3 +35,6 @@ out/

### VS Code ###
.vscode/

### TANZU ###
build-output
23 changes: 23 additions & 0 deletions apps/acme-catalog/.tanzu/config/acme-catalog.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
apiVersion: apps.tanzu.vmware.com/v1
kind: ContainerApp
metadata:
creationTimestamp: null
name: acme-catalog
spec:
build:
buildpacks: {}
nonSecretEnv:
- name: BP_JVM_VERSION
value: "21"
path: ../..
nonSecretEnv:
- name: SPRING_PROFILES_ACTIVE
value: k8s
ports:
- name: main
port: 8080

acceptedServiceBindings:
- name: db
types:
- postgresql
28 changes: 28 additions & 0 deletions apps/acme-catalog/.tanzu/config/http-route.yaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
apiVersion: gateway.networking.k8s.io/v1beta1
kind: HTTPRoute
metadata:
name: acme-catalog
annotations:
healthcheck.gslb.tanzu.vmware.com/service: acme-catalog
healthcheck.gslb.tanzu.vmware.com/path: /
healthcheck.gslb.tanzu.vmware.com/port: "8080"
spec:
parentRefs:
- group: gateway.networking.k8s.io
kind: Gateway
name: default-gateway
sectionName: http-acme-fitness-catalog
rules:
- backendRefs:
- group: ""
kind: Service
name: acme-catalog
port: 8080
weight: 1
matches:
- path:
type: PathPrefix
value: /products
- path:
type: PathPrefix
value: /static
Loading