("");
+ const onSuccessRef = useRef(onSuccess);
+ onSuccessRef.current = onSuccess;
const organization = useOrganization();
const project = useProject();
const isLoading = fetcher.state !== "idle";
@@ -66,11 +68,11 @@ export function AIGeneratedCronField({ onSuccess }: AIGeneratedCronFieldProps) {
useEffect(() => {
if (resultData?.cron !== undefined) {
- onSuccess(resultData.cron);
+ onSuccessRef.current(resultData.cron);
}
}, [resultData?.cron]);
- const submit = useCallback(async (value: string) => {
+ const submit = (value: string) => {
fetcher.submit(
{ message: value },
{
@@ -79,7 +81,7 @@ export function AIGeneratedCronField({ onSuccess }: AIGeneratedCronFieldProps) {
encType: "application/json",
}
);
- }, []);
+ };
return (
diff --git a/apps/webapp/app/routes/resources.platform-changelogs.tsx b/apps/webapp/app/routes/resources.platform-changelogs.tsx
index ed62de3c1..aa8ed9fc9 100644
--- a/apps/webapp/app/routes/resources.platform-changelogs.tsx
+++ b/apps/webapp/app/routes/resources.platform-changelogs.tsx
@@ -42,6 +42,7 @@ const POLL_INTERVAL_MS = 60_000;
export function useRecentChangelogs(organizationId?: string, projectId?: string) {
const fetcher = useFetcher();
+ const { load, state } = fetcher;
const lastLoadedUrl = useRef(null);
useEffect(() => {
@@ -51,19 +52,19 @@ export function useRecentChangelogs(organizationId?: string, projectId?: string)
const qs = params.toString();
const url = `/resources/platform-changelogs${qs ? `?${qs}` : ""}`;
- if (lastLoadedUrl.current !== url && fetcher.state === "idle") {
+ if (lastLoadedUrl.current !== url && state === "idle") {
lastLoadedUrl.current = url;
- fetcher.load(url);
+ load(url);
}
const interval = setInterval(() => {
- if (fetcher.state === "idle") {
- fetcher.load(url);
+ if (state === "idle") {
+ load(url);
}
}, POLL_INTERVAL_MS);
return () => clearInterval(interval);
- }, [organizationId, projectId]);
+ }, [organizationId, projectId, load, state]);
return {
changelogs: fetcher.data?.changelogs ?? [],
diff --git a/apps/webapp/app/routes/resources.platform-notifications.tsx b/apps/webapp/app/routes/resources.platform-notifications.tsx
index bf3dfe41e..56fc5bd75 100644
--- a/apps/webapp/app/routes/resources.platform-notifications.tsx
+++ b/apps/webapp/app/routes/resources.platform-notifications.tsx
@@ -41,24 +41,25 @@ const POLL_INTERVAL_MS = 60000; // 1 minute
export function usePlatformNotifications(organizationId: string, projectId: string) {
const fetcher = useFetcher();
+ const { load, state } = fetcher;
const lastLoadedUrl = useRef(null);
useEffect(() => {
const url = `/resources/platform-notifications?organizationId=${encodeURIComponent(organizationId)}&projectId=${encodeURIComponent(projectId)}`;
- if (lastLoadedUrl.current !== url && fetcher.state === "idle") {
+ if (lastLoadedUrl.current !== url && state === "idle") {
lastLoadedUrl.current = url;
- fetcher.load(url);
+ load(url);
}
const interval = setInterval(() => {
- if (fetcher.state === "idle") {
- fetcher.load(url);
+ if (state === "idle") {
+ load(url);
}
}, POLL_INTERVAL_MS);
return () => clearInterval(interval);
- }, [organizationId, projectId]);
+ }, [organizationId, projectId, load, state]);
return {
notifications: fetcher.data?.notifications ?? [],
diff --git a/apps/webapp/app/routes/storybook.ai-agent/route.tsx b/apps/webapp/app/routes/storybook.ai-agent/route.tsx
index f69a43c57..6220aec54 100644
--- a/apps/webapp/app/routes/storybook.ai-agent/route.tsx
+++ b/apps/webapp/app/routes/storybook.ai-agent/route.tsx
@@ -795,7 +795,6 @@ function AgentOrb({
colors = AGENT_ORB_PALETTE,
restColor = "#ffffff",
colored = true,
- restShape = "triangle",
dotCount = 21,
orbitCount = 3,
particlesPerOrbit = 3,
@@ -824,7 +823,7 @@ function AgentOrb({
() => buildDotSpecs(effDotCount, orbitCount, effParticles),
[effDotCount, orbitCount, effParticles]
);
- const restPoints = useMemo(() => triangleOutline(effDotCount), [restShape, effDotCount]);
+ const restPoints = useMemo(() => triangleOutline(effDotCount), [effDotCount]);
useEffect(() => {
activeRef.current = active;
@@ -846,7 +845,7 @@ function AgentOrb({
restPoints,
dotSpecs,
orbitGeoms,
- paletteRgb: colors.map(hexToRgb),
+ paletteRgb: colorsKey.split(",").map(hexToRgb),
restRgb: hexToRgb(restColor),
colored,
radiusScale,
@@ -1129,7 +1128,7 @@ function AgentLogoMorph({
outline: logoOutlinePoints(dotCount),
dotSpecs: buildDotSpecs(dotCount, orbitCount, particlesPerOrbit),
orbitGeoms: buildOrbitGeoms(orbitCount),
- paletteRgb: colors.map(hexToRgb),
+ paletteRgb: colorsKey.split(",").map(hexToRgb),
logoRgb: hexToRgb(logoColor),
};
diff --git a/apps/webapp/app/routes/storybook.filter/route.tsx b/apps/webapp/app/routes/storybook.filter/route.tsx
index ed5b65ed0..6658ae695 100644
--- a/apps/webapp/app/routes/storybook.filter/route.tsx
+++ b/apps/webapp/app/routes/storybook.filter/route.tsx
@@ -149,10 +149,13 @@ const statuses = allTaskRunStatuses.map((status) => ({
function Statuses({ trigger, clearSearchValue, shortcut, searchValue, setFilterType }: MenuProps) {
const { values, replace } = useSearchParams();
- const handleChange = useCallback((values: string[]) => {
- clearSearchValue();
- replace({ status: values });
- }, []);
+ const handleChange = useCallback(
+ (values: string[]) => {
+ clearSearchValue();
+ replace({ status: values });
+ },
+ [clearSearchValue, replace]
+ );
const filtered = useMemo(() => {
return statuses.filter((item) => item.title.toLowerCase().includes(searchValue.toLowerCase()));
@@ -205,10 +208,13 @@ function Environments({
}: MenuProps) {
const { values, replace } = useSearchParams();
- const handleChange = useCallback((values: string[]) => {
- clearSearchValue();
- replace({ environment: values });
- }, []);
+ const handleChange = useCallback(
+ (values: string[]) => {
+ clearSearchValue();
+ replace({ environment: values });
+ },
+ [clearSearchValue, replace]
+ );
const filtered = useMemo(() => {
return environments.filter((item) =>
diff --git a/apps/webapp/app/routes/storybook.select/route.tsx b/apps/webapp/app/routes/storybook.select/route.tsx
index c9ce1495c..605abca5a 100644
--- a/apps/webapp/app/routes/storybook.select/route.tsx
+++ b/apps/webapp/app/routes/storybook.select/route.tsx
@@ -1,6 +1,5 @@
import { CircleStackIcon } from "@heroicons/react/20/solid";
import { Form, useNavigate } from "@remix-run/react";
-import { useCallback } from "react";
import { LogoIcon } from "~/components/LogoIcon";
import { Button } from "~/components/primitives/Buttons";
import {
@@ -141,13 +140,13 @@ function Statuses() {
const location = useOptimisticLocation();
const search = new URLSearchParams(location.search);
- const handleChange = useCallback((values: string[]) => {
+ const handleChange = (values: string[]) => {
search.delete("status");
for (const value of values) {
search.append("status", value);
}
navigate(`${location.pathname}?${search.toString()}`, { replace: true });
- }, []);
+ };
return (