add env var

openspec/changes/archive/2026-03-28-integrate-shadcn-library/design.md

@@ -0,0 +1,25 @@
+## Context
+
+The frontend is currently built with custom React components and CSS. This has led to a fragmented and inconsistent user interface. The goal is to standardize the UI by adopting `shadcn/ui`.
+
+## Goals / Non-Goals
+
+**Goals:**
+- Successfully integrate `shadcn/ui` into the Create React App project.
+- Replace the `Dropdown` and `FilterBox` components with `shadcn/ui` components.
+- Establish a pattern for using `shadcn/ui` for all future components.
+
+**Non-Goals:**
+- We will not be ejecting from Create React App. We will work within its constraints.
+- We will not build a complete design system, but rather use `shadcn/ui` as our component foundation.
+
+## Decisions
+
+- **Installation:** We will follow the official `shadcn/ui` documentation for installation, which involves using `npx`.
+- **Component Replacement:** We will replace components one by one, starting with `Dropdown` and `FilterBox`.
+- **Styling:** `shadcn/ui` uses Tailwind CSS. We will need to install and configure Tailwind CSS in our project.
+
+## Risks / Trade-offs
+
+- **[Risk]** Integrating Tailwind CSS into a Create React App project can be complex. → **Mitigation:** We will follow the official guides for both Tailwind CSS and Create React App.
+- **[Trade-off]** `shadcn/ui` is a relatively new library. → **Mitigation:** It has a strong and growing community, and it is backed by Vercel.