Site: add smart feed-in disable (aka zero feed-in)

AGENTS.md

@@ -129,6 +129,13 @@ This file provides guidance to AI coding agents when working with code in this r
 - Use early returns for readability
 - Use configured Axios instance for HTTP communication
 
+### Code Comments
+
+- Keep code comments as brief as possible
+- Start comments with lowercase letters
+- Avoid JSDoc comments - prefer clear code and TypeScript types
+- Use inline comments sparingly, only when the code intent isn't clear from context
+
 ### State Management
 
 - Use `reactive()` from Vue for simple global state
@@ -167,6 +174,25 @@ This file provides guidance to AI coding agents when working with code in this r
 - Use semantic selectors (roles, labels, button text); `data-testid` only when necessary
 - Test error states and loading states
 
+### JavaScript Unit Testing (Vitest)
+
+- **Concrete Assertions**: Use specific expected values instead of calculations in tests
+  - Good: `expect(values.slice(0, 3)).toEqual([-0.05, -0.045, -0.04])`
+  - Bad: `expect(values).toContain(Math.min(...inputValues) - stepSize)`
+- **Minimal Logic**: Avoid complex logic in tests; verify exact outputs
+  - Use helper functions for test setup, not for expected value calculations
+  - Check actual function output against known correct values
+- **Test Naming**: Use descriptive names that reflect the feature being tested
+  - Pattern: `featureName: describes what is being tested`
+  - Examples: `extraLow: extends range below minimum`, `formatValue: converts euro to cents`
+- **Edge Cases**: Always test boundary conditions
+  - Empty inputs, single values, extreme ranges
+  - Different step sizes, negative values, zero handling
+- **Programmatic Execution**:
+  - Run all tests: `npm run test` (watch mode) or `npx vitest run` (single run)
+  - Run specific test file: `npx vitest run filename`
+  - Run tests matching pattern: `npx vitest run --grep "pattern"`
+
 ## Playwright Integration Testing
 
 ### Test Organization
@@ -208,7 +234,18 @@ This file provides guidance to AI coding agents when working with code in this r
 - Use `expectModalVisible()` and `expectModalHidden()` helpers
 - Test configuration persistence across application restarts
 - Standard structure: import `{ start, stop, baseUrl }` from `./evcc`, use `test.afterEach(stop)`
-- Never use fixed timeouts, use existance of elements or wait for network idle
+- **NEVER use fixed timeouts like `waitForTimeout()`** - Playwright's auto-waiting handles synchronization
+- Use Playwright's built-in waiting mechanisms: `expect()` assertions automatically wait for conditions
+- For dynamic content, rely on element visibility/text content assertions rather than arbitrary delays
+- **Comments**: Keep test comments very concise, lowercase, only where needed to clarify intent
+- **No step numbering**: Avoid numbered steps or excessive structure in comments
+- Combine related test scenarios into single comprehensive flows to reduce redundant setup
+- **Be compact**: Don't check visibility before interacting - Playwright handles this automatically
+- **Use concrete values**: In controlled test environments with mocked data, assert exact expected values
+- **Avoid regex in assertions**: Use `toContainText("exact string")` not `toContainText(/regex/)`
+- **Custom select boxes**: Use `selectOption({ label: "exact label" })` to verify option formatting
+- **Minimize variables**: Use inline selectors unless reused multiple times
+- **Descriptive test names**: Be brief but specific about what the test covers (e.g., "configure feed-in limit and verify production reduced indicator")
 
 ## Device Integration & Configuration
 

api/api.go

@@ -180,6 +180,11 @@ type SocLimiter interface {
 	GetLimitSoc() (int64, error)
 }
 
+// FeedInDisableController allows disabling grid feed-in, i.e. setting limit to 0W
+type FeedInDisableController interface {
+	FeedInDisableLimitEnable(bool) error
+}
+
 // ChargeController allows to start/stop the charging session on the vehicle side
 type ChargeController interface {
 	ChargeEnable(bool) error

assets/css/app.css

@@ -29,7 +29,7 @@
 	--evcc-darkest-green: #076f20ff;
 	--evcc-darkest-green-rgb: 7, 111, 32;
 	--evcc-yellow: #faf000;
-	--evcc-dark-yellow: #bbb400;
+	--evcc-dark-yellow: #e6b800;
 	--evcc-orange: #ff9000;
 	--evcc-orange-rgb: 255, 144, 0;
 	--evcc-red: #fc440f;
@@ -46,7 +46,8 @@
 	--evcc-self: var(--evcc-dark-green);
 	--evcc-pv: var(--evcc-dark-green);
 	--evcc-battery: var(--evcc-darker-green);
-	--evcc-export: var(--evcc-yellow);
+	--evcc-export: var(--evcc-dark-yellow);
+	--evcc-export-bg: var(--evcc-yellow);
 	--evcc-price: #ff912fff;
 	--evcc-co2: #00916eff;
 	--evcc-background: var(--bs-gray-bright);
@@ -92,6 +93,7 @@
 
 :root.dark {
 	--evcc-grid: var(--bs-gray-medium);
+	--evcc-export: var(--evcc-yellow);
 	--evcc-background: var(--bs-gray-deep);
 	--evcc-box: var(--bs-gray-dark);
 	--evcc-box-border: var(--bs-gray-darker);
@@ -172,6 +174,10 @@ h5 {
 	color: var(--evcc-price) !important;
 }
 
+.text-export {
+	color: var(--evcc-export) !important;
+}
+
 .text-co2 {
 	color: var(--evcc-co2) !important;
 }
@@ -682,3 +688,7 @@ input::-webkit-date-and-time-value {
 		text-overflow: ellipsis;
 	}
 }
+
+.custom-select-inline {
+	display: inline-block !important;
+}

assets/js/colors.ts

@@ -17,6 +17,7 @@ const colors: {
   pricePerKWh: string | null;
   price: string | null;
   co2: string | null;
+  export: string | null;
   background: string | null;
   light: string | null;
   selfPalette: string[];
@@ -31,6 +32,7 @@ const colors: {
   pricePerKWh: null,
   price: null,
   co2: null,
+  export: null,
   background: null,
   light: null,
   selfPalette: ["#0FDE41FF", "#FFBD2FFF", "#FD6158FF", "#03C1EFFF", "#0F662DFF", "#FF922EFF"],
@@ -62,6 +64,53 @@ export const fullColor = (color: string | null) => {
   return color?.toLowerCase().replace(/20$/, "ff");
 };
 
+export const createFeedInDisabledPattern = (
+  ctx: CanvasRenderingContext2D,
+  color: string,
+  opacity = 0.5
+): CanvasPattern | null => {
+  const patternCanvas = document.createElement("canvas");
+  const patternContext = patternCanvas.getContext("2d");
+  if (!patternContext) return null;
+
+  // Set pattern size
+  patternCanvas.width = 10;
+  patternCanvas.height = 10;
+
+  // Create diagonal stripes with more saturation
+  patternContext.strokeStyle = color;
+  patternContext.globalAlpha = opacity;
+  patternContext.lineWidth = 3;
+
+  // Draw diagonal lines
+  patternContext.beginPath();
+  patternContext.moveTo(0, 10);
+  patternContext.lineTo(10, 0);
+  patternContext.stroke();
+
+  patternContext.beginPath();
+  patternContext.moveTo(-2, 2);
+  patternContext.lineTo(2, -2);
+  patternContext.stroke();
+
+  patternContext.beginPath();
+  patternContext.moveTo(8, 12);
+  patternContext.lineTo(12, 8);
+  patternContext.stroke();
+
+  return ctx.createPattern(patternCanvas, "repeat");
+};
+
+export const feedInDisabledPattern = (color: string): string => {
+  return `repeating-linear-gradient(
+    -45deg,
+    transparent,
+    transparent 3px,
+    ${color} 3px,
+    ${color} 5px
+  )`;
+};
+
 function updateCssColors() {
   const style = window.getComputedStyle(document.documentElement);
   colors.text = style.getPropertyValue("--evcc-default-text");
@@ -71,6 +120,7 @@ function updateCssColors() {
   colors.grid = style.getPropertyValue("--evcc-grid");
   colors.price = style.getPropertyValue("--evcc-price");
   colors.co2 = style.getPropertyValue("--evcc-co2");
+  colors.export = style.getPropertyValue("--evcc-export");
   colors.background = style.getPropertyValue("--evcc-background");
   colors.pricePerKWh = style.getPropertyValue("--bs-gray-medium");
   colors.co2PerKWh = style.getPropertyValue("--bs-gray-medium");

assets/js/components/Battery/BatterySettingsModal.vue

@@ -602,7 +602,4 @@ export default defineComponent({
 	z-index: 1;
 	border-radius: 0.5rem;
 }
-.custom-select-inline {
-	display: inline-block !important;
-}
 </style>

assets/js/components/Energyflow/Energyflow.vue

@@ -79,7 +79,7 @@
 					<div>
 						<EnergyflowEntry
 							v-if="pvPossible"
-							:name="$t('main.energyflow.pvProduction')"
+							:name="pvTitle"
 							icon="sun"
 							:power="pvProduction"
 							:details="solarForecastRemainingToday"
@@ -334,6 +334,7 @@ export default defineComponent({
 		bufferSoc: { type: Number },
 		bufferStartSoc: { type: Number },
 		forecast: { type: Object as PropType<Forecast>, default: () => ({}) },
+		smartFeedInDisableActive: { type: Boolean },
 	},
 	data: () => {
 		return { detailsOpen: false, detailsCompleteHeight: null as number | null, ready: false };
@@ -342,6 +343,13 @@ export default defineComponent({
 		gridImport() {
 			return Math.max(0, this.gridPower);
 		},
+		pvTitle() {
+			let title = this.$t("main.energyflow.pvProduction");
+			if (this.smartFeedInDisableActive) {
+				title += ` (${this.$t("main.energyflow.pvProductionLimited")})`;
+			}
+			return title;
+		},
 		pvProduction() {
 			return Math.abs(this.pvPower);
 		},
@@ -607,13 +615,13 @@ export default defineComponent({
 	color: var(--evcc-grid);
 }
 .color-export {
-	color: var(--evcc-export);
+	color: var(--evcc-export-bg);
 }
 .legend-grid {
 	color: var(--evcc-grid);
 }
 .legend-export {
-	color: var(--evcc-export);
+	color: var(--evcc-export-bg);
 }
 .legend-pv {
 	color: var(--evcc-pv);

assets/js/components/Energyflow/Visualization.vue

@@ -294,7 +294,7 @@ html.dark .grid-import {
 	color: var(--bs-dark);
 }
 .pv-export {
-	background-color: var(--evcc-export);
+	background-color: var(--evcc-export-bg);
 	color: var(--bs-dark);
 }
 .unknown-power {