snowballtools-base-mirror/packages/frontend
Vivian Phung 9a1c0e8338
feat(domains): DomainCard and WebhookCard styling start (#225)
### TL;DR

Refactored the `DomainCard`, `EditDomainDialog`, and `WebhookCard` components to improve code readability and enhance UI using new shared components like `Tag`, `Heading`, `Button`, and `CustomIcon`.

### What changed?

- `DomainCard` component:
  - Replaced `Chip` with `Tag` component.
  - Used `Heading`, `Button`, and `CustomIcon` components.
  - Updated refresh icon to show `LoadingIcon` when checking.
- `EditDomainDialog` component:
  - Used `useToast` hook for toast messages.
- `WebhookCard` component:
  - Used `Input`, `Button`, and `CustomIcon` components for better UI.
- Added Storybook stories for the updated components.

### How to test?

1. Go to the project settings page.
2. Verify the `DomainCard` UI updates.
3. Edit a domain and check the toasts.
4. Verify the `WebhookCard` UI and functionality.
5. Run Storybook and inspect the added stories for the components.

### Why make this change?

To improve the consistency and user experience of the project settings UI, and to make the components more maintainable by using shared components.

---
2024-06-24 19:22:20 -04:00
..
.storybook chore(storybook): icons to correct folder (#216) 2024-06-22 17:27:37 -04:00
public format prettier 2024-05-09 16:18:52 -04:00
src feat(domains): DomainCard and WebhookCard styling start (#225) 2024-06-24 19:22:20 -04:00
.env.example chore(storybook): icons to correct folder (#216) 2024-06-22 17:27:37 -04:00
.eslintrc.cjs storybook 2024-05-09 16:22:03 -04:00
.gitignore storybook 2024-05-09 16:22:03 -04:00
.node-version Switch from cra to vite 2024-04-11 21:48:58 -05:00
.prettierignore Add dist/ to .prettierignore (#195) 2024-05-22 14:50:37 -04:00
.prettierrc.json Create react app with tailwind, typescript, eslint and prettier (#4) 2023-12-08 10:50:55 +05:30
chromatic.config.json storybook 2024-05-09 16:22:03 -04:00
index.html Lint using tsc; fix type errors 2024-04-11 21:49:14 -05:00
package.json [1/n][Storybook] Settings (#72) 2024-05-16 20:33:33 -04:00
postcss.config.js Lint using tsc; fix type errors 2024-04-11 21:49:14 -05:00
README.md fix(readme) 2024-06-24 15:00:45 -04:00
reload-dev.sh Fix dev script 2024-05-02 15:47:23 -05:00
tailwind.config.js fix duplicate styling (#67) 2024-05-16 20:16:31 -04:00
tsconfig.json resolve aliases 2024-05-14 13:27:23 -04:00
tsconfig.node.json Switch from cra to vite 2024-04-11 21:48:58 -05:00
vite.config.ts Log commit hash 2024-06-04 15:56:52 -05:00

frontend

This is a vite react nextjs project in a yarn workspace.

Getting Started

Install dependencies

In the root of the project, run:

yarn

Build backend

yarn build --ignore frontend

Environment variables

Local

Copy the .env.example file to .env:

cp .env.example .env

Staging environment variables

Change in deployer/deploy-frontend.staging.sh

Production environment variables

Change in deployer/deploy-frontend.sh

Run development server

yarn dev

Deployment

From the root of the project, run:

Staging

cd packages/deployer && ./deploy-frontend.staging.sh

Production

cd packages/deployer && ./deploy-frontend.sh

Deployment status

Check the status of the deployment here