ステータスバーを追加 by 0suu · Pull Request #48 · 0suu/SwitchBotController

0suu · 2026-04-13T11:45:15Z

No description provided.

0suu · 2026-04-13T11:45:31Z

cloudflare-workers-and-pages · 2026-04-13T11:46:12Z

Deploying switchbotcontroller with Cloudflare Pages

Latest commit:	`a4358f0`
Status:	⚡️ Build in progress...

View logs

gemini-code-assist

Code Review

This pull request introduces an EnvironmentStatusBar component to display real-time environmental data in the application header. Key changes include moving device fetching to the App level, adding a persistent pinnedEnvironmentDeviceId setting to the Redux store, and updating the UI to allow sensor selection. The review feedback focuses on performance optimizations within the new component, specifically recommending the use of useMemo and useCallback to memoize device filtering, device lookup, and value formatting logic.

gemini-code-assist · 2026-04-13T11:47:04Z

@@ -0,0 +1,176 @@
+import React, { useState } from "react";


パフォーマンス最適化のために useMemo と useCallback を使用するため、これらをインポートに追加してください。

Suggested change

import React, { useState } from "react";

import React, { useState, useMemo, useCallback } from "react";

gemini-code-assist · 2026-04-13T11:47:04Z

+  const envDevices = devices.filter((device) => {
+    const def = findDeviceDefinition(device.deviceType);
+    return def && ENVIRONMENT_DEVICE_KEYS.has(def.key);
+  });


devices 配列のフィルタリング処理は計算コストがかかる可能性があり、また devices は Redux の状態更新（ポーリング等）により頻繁に更新されるため、useMemo を使用して最適化することをお勧めします。

Suggested change

const envDevices = devices.filter((device) => {

const def = findDeviceDefinition(device.deviceType);

return def && ENVIRONMENT_DEVICE_KEYS.has(def.key);

});

const envDevices = useMemo(() => {

return devices.filter((device) => {

const def = findDeviceDefinition(device.deviceType);

return def && ENVIRONMENT_DEVICE_KEYS.has(def.key);

});

}, [devices]);

gemini-code-assist · 2026-04-13T11:47:04Z

+  // Nothing to show if no environment-capable devices exist
+  if (envDevices.length === 0) return null;
+
+  const pinnedDevice = pinnedId ? envDevices.find((d) => d.deviceId === pinnedId) : undefined;


pinnedDevice の検索結果を useMemo でメモ化することで、レンダリングごとの不要な再計算を抑制できます。

const pinnedDevice = useMemo(() => pinnedId ? envDevices.find((d) => d.deviceId === pinnedId) : undefined , [envDevices, pinnedId]);

gemini-code-assist · 2026-04-13T11:47:04Z

+  const getFormattedValue = (deviceId: string, fieldKey: string): string | undefined => {
+    const device = devices.find((d) => d.deviceId === deviceId);
+    if (!device) return undefined;
+    const statusFields = getStatusFieldsForDevice(device.deviceType);
+    const field = statusFields.find((f: any) => f.key === fieldKey);
+    if (!field) return undefined;
+    const status = statusMap[deviceId];
+    const raw = status ? (status as any)[field.key] : undefined;
+    if (raw === undefined || raw === null) return undefined;
+    return field.formatter ? String(field.formatter(raw, status)) : String(raw);
+  };


getFormattedValue 関数はレンダリングのたびに再生成されています。また、この関数は Menu 内のループでも呼び出されるため、useCallback でラップしてメモ化することをお勧めします。併せて、statusFields.find の引数における不要な : any 型指定も削除しています。

Suggested change

const getFormattedValue = (deviceId: string, fieldKey: string): string | undefined => {

const device = devices.find((d) => d.deviceId === deviceId);

if (!device) return undefined;

const statusFields = getStatusFieldsForDevice(device.deviceType);

const field = statusFields.find((f: any) => f.key === fieldKey);

if (!field) return undefined;

const status = statusMap[deviceId];

const raw = status ? (status as any)[field.key] : undefined;

if (raw === undefined || raw === null) return undefined;

return field.formatter ? String(field.formatter(raw, status)) : String(raw);

};

const getFormattedValue = useCallback((deviceId: string, fieldKey: string): string | undefined => {

const device = devices.find((d) => d.deviceId === deviceId);

if (!device) return undefined;

const statusFields = getStatusFieldsForDevice(device.deviceType);

const field = statusFields.find((f) => f.key === fieldKey);

if (!field) return undefined;

const status = statusMap[deviceId];

const raw = status ? (status as any)[field.key] : undefined;

if (raw === undefined || raw === null) return undefined;

return field.formatter ? String(field.formatter(raw, status)) : String(raw);

}, [devices, statusMap]);

gemini-code-assist · 2026-04-13T11:47:04Z

+  const temp = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "temperature") : undefined;
+  const hum = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "humidity") : undefined;
+  const co2 = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "CO2") : undefined;


ステータスバーに表示する主要な環境数値（温度・湿度・CO2）は、依存関係が変更されたときのみ再計算されるように useMemo でメモ化することをお勧めします。

Suggested change

const temp = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "temperature") : undefined;

const hum = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "humidity") : undefined;

const co2 = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "CO2") : undefined;

const { temp, hum, co2 } = useMemo(() => ({

temp: pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "temperature") : undefined,

hum: pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "humidity") : undefined,

co2: pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "CO2") : undefined,

}), [pinnedDevice, getFormattedValue]);

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 242f71628b

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-04-13T11:48:16Z

+    if (isTokenValid && storedToken) {
+      dispatch(fetchDevices());
+    }


Clear cached devices when auth is no longer valid

This effect fetches devices after validation succeeds but has no corresponding branch to clear previously loaded devices when credentials are removed or become invalid. In that scenario, devices/deviceStatuses stay populated and the new global EnvironmentStatusBar can continue showing stale sensor data from the prior authenticated session until another successful fetch occurs. Add a cleanup path (for example dispatching clearDevices() when !isTokenValid or token is missing) so UI state matches auth state.

Useful? React with 👍 / 👎.

ステータスバーを追加

242f716

0suu linked an issue Apr 13, 2026 that may be closed by this pull request

温湿度表示を分かりやすくする #32

Closed

gemini-code-assist Bot reviewed Apr 13, 2026

View reviewed changes

chatgpt-codex-connector Bot reviewed Apr 13, 2026

View reviewed changes

レビュー対応

a4358f0

0suu merged commit 7f09217 into main Apr 13, 2026
1 of 2 checks passed

0suu deleted the 32-温湿度表示を分かりやすくする branch April 13, 2026 12:01

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ステータスバーを追加#48

Hidden character warning

ステータスバーを追加#48
0suu merged 2 commits into
mainfrom
32-温湿度表示を分かりやすくする

0suu commented Apr 13, 2026

Uh oh!

0suu commented Apr 13, 2026

Uh oh!

cloudflare-workers-and-pages Bot commented Apr 13, 2026 •

edited

Loading

Uh oh!

gemini-code-assist Bot left a comment

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Uh oh!

chatgpt-codex-connector Bot Apr 13, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

	import React, { useState } from "react";
	import React, { useState, useMemo, useCallback } from "react";

-  const temp = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "temperature") : undefined;
-  const hum = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "humidity") : undefined;
-  const co2 = pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "CO2") : undefined;
+  const { temp, hum, co2 } = useMemo(() => ({
+    temp: pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "temperature") : undefined,
+    hum: pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "humidity") : undefined,
+    co2: pinnedDevice ? getFormattedValue(pinnedDevice.deviceId, "CO2") : undefined,
+  }), [pinnedDevice, getFormattedValue]);

Hidden character warning

Conversation

0suu commented Apr 13, 2026

Uh oh!

0suu commented Apr 13, 2026

Uh oh!

cloudflare-workers-and-pages Bot commented Apr 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying switchbotcontroller with Cloudflare Pages

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist Bot Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector Bot Apr 13, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

cloudflare-workers-and-pages Bot commented Apr 13, 2026 •

edited

Loading