feat(quick-2): initialize v2 project from sample_interface

- Copy React app structure from sample_interface/src/
- Copy package.json, vite.config.ts, postcss.config.mjs
- Copy guidelines/ design system

v2/src/app/components/views/ADCSettingView.tsx

@@ -0,0 +1,83 @@
+import { Card, CardContent, CardHeader, CardTitle } from "../ui/card";
+import { Input } from "../ui/input";
+import { Button } from "../ui/button";
+import { Label } from "../ui/label";
+import { Activity } from "lucide-react";
+
+export function ADCSettingView() {
+  const adcChannels = [
+    { channel: 1, name: "Water Level", value: "2.45V", raw: "2048" },
+    { channel: 2, name: "Temperature", value: "1.23V", raw: "1024" },
+    { channel: 3, name: "Pressure", value: "3.12V", raw: "2600" },
+    { channel: 4, name: "Flow Rate", value: "0.98V", raw: "817" },
+  ];
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center gap-3">
+        <Activity className="w-6 h-6 text-blue-400" />
+        <h1 className="text-2xl font-bold text-white">ADC Setting</h1>
+      </div>
+
+      <Card className="bg-gray-900 border-gray-700">
+        <CardHeader>
+          <CardTitle className="text-white">ADC Channel Readings</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <div className="space-y-3">
+            {adcChannels.map((adc) => (
+              <div key={adc.channel} className="p-3 bg-gray-800 rounded">
+                <div className="flex justify-between items-center mb-2">
+                  <span className="text-sm text-gray-400">Channel {adc.channel}</span>
+                  <span className="text-sm text-blue-400 font-semibold">{adc.name}</span>
+                </div>
+                <div className="grid grid-cols-2 gap-2 text-xs">
+                  <div>
+                    <span className="text-gray-500">Voltage: </span>
+                    <span className="text-green-400">{adc.value}</span>
+                  </div>
+                  <div>
+                    <span className="text-gray-500">Raw: </span>
+                    <span className="text-yellow-400">{adc.raw}</span>
+                  </div>
+                </div>
+              </div>
+            ))}
+          </div>
+        </CardContent>
+      </Card>
+
+      <Card className="bg-gray-900 border-gray-700">
+        <CardHeader>
+          <CardTitle className="text-white">Calibration</CardTitle>
+        </CardHeader>
+        <CardContent className="space-y-4">
+          <div className="grid grid-cols-2 gap-4">
+            <div className="space-y-2">
+              <Label htmlFor="offset" className="text-gray-300">Offset</Label>
+              <Input 
+                id="offset"
+                type="number"
+                defaultValue="0"
+                className="bg-gray-800 border-gray-700 text-white"
+              />
+            </div>
+            <div className="space-y-2">
+              <Label htmlFor="gain" className="text-gray-300">Gain</Label>
+              <Input 
+                id="gain"
+                type="number"
+                defaultValue="1"
+                step="0.01"
+                className="bg-gray-800 border-gray-700 text-white"
+              />
+            </div>
+          </div>
+          <Button className="w-full bg-blue-600 hover:bg-blue-700">
+            Apply Calibration
+          </Button>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}