@osdk/react-devtools 0.10.0 → 0.10.1-main-66005661366c2595515962d5dadf1375080d15a2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +10 -0
- package/build/esm/DevToolsContext.js.map +1 -1
- package/build/esm/components/ActionMetrics.js +2 -2
- package/build/esm/components/ActionMetrics.js.map +1 -1
- package/build/esm/components/BubbleChart.js +1 -1
- package/build/esm/components/BubbleChart.js.map +1 -1
- package/build/esm/components/CacheInspectorTab.js +1 -1
- package/build/esm/components/CacheInspectorTab.js.map +1 -1
- package/build/esm/components/CacheMetrics.js +1 -1
- package/build/esm/components/CacheMetrics.js.map +1 -1
- package/build/esm/components/ComponentCard.js +1 -1
- package/build/esm/components/ComponentCard.js.map +1 -1
- package/build/esm/components/ComputeTab.js +6 -6
- package/build/esm/components/ComputeTab.js.map +1 -1
- package/build/esm/components/CopyableCodeBlock.js.map +1 -1
- package/build/esm/components/DebuggingTab.js +2 -2
- package/build/esm/components/DebuggingTab.js.map +1 -1
- package/build/esm/components/HookRow.js.map +1 -1
- package/build/esm/components/ImprovementsTab.js.map +1 -1
- package/build/esm/components/InspectorSelectionHeader.js.map +1 -1
- package/build/esm/components/InterceptTab.js +5 -5
- package/build/esm/components/InterceptTab.js.map +1 -1
- package/build/esm/components/IssueCard.js.map +1 -1
- package/build/esm/components/LogEntryCard.js.map +1 -1
- package/build/esm/components/MockEditor.js.map +1 -1
- package/build/esm/components/MonitorErrorBoundary.js.map +1 -1
- package/build/esm/components/MonitoringPanel.js +1 -1
- package/build/esm/components/MonitoringPanel.js.map +1 -1
- package/build/esm/components/ObjectLoadingMetrics.js.map +1 -1
- package/build/esm/components/OsdkAppErrorBoundary.js.map +1 -1
- package/build/esm/components/OsdkDevTools.js.map +1 -1
- package/build/esm/components/OverrideEditor.js.map +1 -1
- package/build/esm/components/PerformanceTab.js +8 -8
- package/build/esm/components/PerformanceTab.js.map +1 -1
- package/build/esm/components/PrimitiveSelectionPanel.js +1 -1
- package/build/esm/components/PrimitiveSelectionPanel.js.map +1 -1
- package/build/esm/components/resolveComponentName.js +2 -2
- package/build/esm/components/resolveComponentName.js.map +1 -1
- package/build/esm/components/testHelpers.js.map +1 -1
- package/build/esm/fiber/DegradationNotice.js +2 -2
- package/build/esm/fiber/DegradationNotice.js.map +1 -1
- package/build/esm/fiber/DevtoolsHook.js +4 -4
- package/build/esm/fiber/DevtoolsHook.js.map +1 -1
- package/build/esm/fiber/FiberAccess.js.map +1 -1
- package/build/esm/fiber/FiberInspection.js.map +1 -1
- package/build/esm/fiber/FiberTags.js.map +1 -1
- package/build/esm/fiber/HookStateInspector.js.map +1 -1
- package/build/esm/fiber/SafeFiberOperation.js.map +1 -1
- package/build/esm/fiber/capabilities.js.map +1 -1
- package/build/esm/fiber/traverseFiber.js.map +1 -1
- package/build/esm/fiber/types.js.map +1 -1
- package/build/esm/fiber/validation.js +1 -1
- package/build/esm/fiber/validation.js.map +1 -1
- package/build/esm/hooks/createPollingStore.js.map +1 -1
- package/build/esm/hooks/useActiveComponents.js.map +1 -1
- package/build/esm/hooks/useComponentRegistry.js.map +1 -1
- package/build/esm/hooks/useComputeSelectors.js.map +1 -1
- package/build/esm/hooks/useConsoleLogs.js.map +1 -1
- package/build/esm/hooks/useInspectorSelection.js.map +1 -1
- package/build/esm/hooks/useMetrics.js.map +1 -1
- package/build/esm/hooks/usePersistedState.js.map +1 -1
- package/build/esm/hooks/useRecommendations.js +1 -1
- package/build/esm/hooks/useRecommendations.js.map +1 -1
- package/build/esm/hooks/useSharedTick.js.map +1 -1
- package/build/esm/hooks/useTimeElapsed.js.map +1 -1
- package/build/esm/hooks/useTrackerSubscription.js.map +1 -1
- package/build/esm/hooks/useUnusedFieldAnalysis.js.map +1 -1
- package/build/esm/inspector/ClickToInspectSystem.js.map +1 -1
- package/build/esm/inspector/components/ComponentLabel.js.map +1 -1
- package/build/esm/inspector/components/InspectorBanner.js.map +1 -1
- package/build/esm/inspector/components/InspectorOverlay.js.map +1 -1
- package/build/esm/inspector/components/SelectionHighlight.js.map +1 -1
- package/build/esm/inspector/createClickToInspect.js.map +1 -1
- package/build/esm/inspector/hooks/useAnimatedBounds.js.map +1 -1
- package/build/esm/inspector/inspectorController.js.map +1 -1
- package/build/esm/inspector/utils/elementBounds.js.map +1 -1
- package/build/esm/inspector/utils/interpolation.js.map +1 -1
- package/build/esm/inspector/utils/labelPositioning.js.map +1 -1
- package/build/esm/mocking/MockCacheKeyGenerator.js +3 -3
- package/build/esm/mocking/MockCacheKeyGenerator.js.map +1 -1
- package/build/esm/mocking/MockManager.js +4 -4
- package/build/esm/mocking/MockManager.js.map +1 -1
- package/build/esm/prototyping/PrototypeOverrideStore.js +1 -1
- package/build/esm/prototyping/PrototypeOverrideStore.js.map +1 -1
- package/build/esm/register.js.map +1 -1
- package/build/esm/store/ComputeStore.js.map +1 -1
- package/build/esm/store/ConsoleLogStore.js +2 -2
- package/build/esm/store/ConsoleLogStore.js.map +1 -1
- package/build/esm/store/MetricsStore.js.map +1 -1
- package/build/esm/store/MonitorStore.js.map +1 -1
- package/build/esm/store/WindowErrorStore.js.map +1 -1
- package/build/esm/styles.js.map +1 -1
- package/build/esm/types/compute.js.map +1 -1
- package/build/esm/utils/ActionLifecycleTracker.js.map +1 -1
- package/build/esm/utils/CacheEfficiencyAnalyzer.js.map +1 -1
- package/build/esm/utils/ComponentContextCapture.js +10 -10
- package/build/esm/utils/ComponentContextCapture.js.map +1 -1
- package/build/esm/utils/ComponentPrimitiveDiscovery.js.map +1 -1
- package/build/esm/utils/ComponentQueryRegistry.js +8 -8
- package/build/esm/utils/ComponentQueryRegistry.js.map +1 -1
- package/build/esm/utils/ComputeMonitor.js +2 -2
- package/build/esm/utils/ComputeMonitor.js.map +1 -1
- package/build/esm/utils/EventTimeline.js.map +1 -1
- package/build/esm/utils/LinkTraversalTracker.js +2 -2
- package/build/esm/utils/LinkTraversalTracker.js.map +1 -1
- package/build/esm/utils/MockDataGenerator.js +4 -4
- package/build/esm/utils/MockDataGenerator.js.map +1 -1
- package/build/esm/utils/ObservableClientMonitor.js +2 -2
- package/build/esm/utils/ObservableClientMonitor.js.map +1 -1
- package/build/esm/utils/PerformanceRecommendationEngine.js +1 -1
- package/build/esm/utils/PerformanceRecommendationEngine.js.map +1 -1
- package/build/esm/utils/PropertyAccessTracker.js +3 -3
- package/build/esm/utils/PropertyAccessTracker.js.map +1 -1
- package/build/esm/utils/RecommendationMatcher.js.map +1 -1
- package/build/esm/utils/SubscriptionTracker.js +1 -1
- package/build/esm/utils/SubscriptionTracker.js.map +1 -1
- package/build/esm/utils/UnusedFieldAnalyzer.js +6 -7
- package/build/esm/utils/UnusedFieldAnalyzer.js.map +1 -1
- package/build/esm/utils/WaterfallDetector.js.map +1 -1
- package/build/esm/utils/computePayload.js +2 -2
- package/build/esm/utils/computePayload.js.map +1 -1
- package/build/esm/utils/computeRequest.js.map +1 -1
- package/build/esm/utils/format.js.map +1 -1
- package/build/esm/vite/hookInstaller.js.map +1 -1
- package/build/esm/vite/index.js +2 -3
- package/build/esm/vite/index.js.map +1 -1
- package/build/types/DevToolsContext.d.ts.map +1 -1
- package/build/types/components/ActionMetrics.d.ts.map +1 -1
- package/build/types/components/BubbleChart.d.ts.map +1 -1
- package/build/types/components/CacheInspectorTab.d.ts.map +1 -1
- package/build/types/components/CacheMetrics.d.ts.map +1 -1
- package/build/types/components/ComponentCard.d.ts.map +1 -1
- package/build/types/components/ComputeTab.d.ts.map +1 -1
- package/build/types/components/CopyableCodeBlock.d.ts.map +1 -1
- package/build/types/components/DebuggingTab.d.ts.map +1 -1
- package/build/types/components/HookRow.d.ts.map +1 -1
- package/build/types/components/ImprovementsTab.d.ts.map +1 -1
- package/build/types/components/InspectorSelectionHeader.d.ts.map +1 -1
- package/build/types/components/InterceptTab.d.ts.map +1 -1
- package/build/types/components/IssueCard.d.ts.map +1 -1
- package/build/types/components/LogEntryCard.d.ts.map +1 -1
- package/build/types/components/MockEditor.d.ts.map +1 -1
- package/build/types/components/MonitorErrorBoundary.d.ts.map +1 -1
- package/build/types/components/MonitoringPanel.d.ts.map +1 -1
- package/build/types/components/ObjectLoadingMetrics.d.ts.map +1 -1
- package/build/types/components/OsdkAppErrorBoundary.d.ts.map +1 -1
- package/build/types/components/OsdkDevTools.d.ts.map +1 -1
- package/build/types/components/OverrideEditor.d.ts.map +1 -1
- package/build/types/components/PerformanceTab.d.ts.map +1 -1
- package/build/types/components/PrimitiveSelectionPanel.d.ts.map +1 -1
- package/build/types/components/resolveComponentName.d.ts.map +1 -1
- package/build/types/components/testHelpers.d.ts.map +1 -1
- package/build/types/fiber/DegradationNotice.d.ts.map +1 -1
- package/build/types/fiber/DevtoolsHook.d.ts.map +1 -1
- package/build/types/fiber/FiberInspection.d.ts.map +1 -1
- package/build/types/fiber/HookStateInspector.d.ts.map +1 -1
- package/build/types/fiber/capabilities.d.ts.map +1 -1
- package/build/types/fiber/traverseFiber.d.ts.map +1 -1
- package/build/types/fiber/types.d.ts.map +1 -1
- package/build/types/hooks/useActiveComponents.d.ts.map +1 -1
- package/build/types/hooks/useComponentRegistry.d.ts.map +1 -1
- package/build/types/hooks/useComputeSelectors.d.ts.map +1 -1
- package/build/types/hooks/useConsoleLogs.d.ts.map +1 -1
- package/build/types/hooks/useInspectorSelection.d.ts.map +1 -1
- package/build/types/hooks/useMetrics.d.ts.map +1 -1
- package/build/types/hooks/useRecommendations.d.ts.map +1 -1
- package/build/types/hooks/useUnusedFieldAnalysis.d.ts.map +1 -1
- package/build/types/inspector/ClickToInspectSystem.d.ts.map +1 -1
- package/build/types/inspector/components/ComponentLabel.d.ts.map +1 -1
- package/build/types/inspector/components/InspectorOverlay.d.ts.map +1 -1
- package/build/types/inspector/components/SelectionHighlight.d.ts.map +1 -1
- package/build/types/inspector/hooks/useAnimatedBounds.d.ts.map +1 -1
- package/build/types/mocking/MockManager.d.ts.map +1 -1
- package/build/types/store/ComputeStore.d.ts.map +1 -1
- package/build/types/store/ConsoleLogStore.d.ts.map +1 -1
- package/build/types/store/MetricsStore.d.ts.map +1 -1
- package/build/types/store/MonitorStore.d.ts.map +1 -1
- package/build/types/store/WindowErrorStore.d.ts.map +1 -1
- package/build/types/styles.d.ts +0 -1
- package/build/types/styles.d.ts.map +1 -1
- package/build/types/types/compute.d.ts.map +1 -1
- package/build/types/utils/ActionLifecycleTracker.d.ts.map +1 -1
- package/build/types/utils/CacheEfficiencyAnalyzer.d.ts.map +1 -1
- package/build/types/utils/ComponentContextCapture.d.ts.map +1 -1
- package/build/types/utils/ComponentPrimitiveDiscovery.d.ts.map +1 -1
- package/build/types/utils/ComponentQueryRegistry.d.ts.map +1 -1
- package/build/types/utils/ComputeMonitor.d.ts.map +1 -1
- package/build/types/utils/EventTimeline.d.ts.map +1 -1
- package/build/types/utils/LinkTraversalTracker.d.ts.map +1 -1
- package/build/types/utils/MockDataGenerator.d.ts.map +1 -1
- package/build/types/utils/ObservableClientMonitor.d.ts.map +1 -1
- package/build/types/utils/PerformanceRecommendationEngine.d.ts.map +1 -1
- package/build/types/utils/PropertyAccessTracker.d.ts.map +1 -1
- package/build/types/utils/SubscriptionTracker.d.ts.map +1 -1
- package/build/types/utils/UnusedFieldAnalyzer.d.ts.map +1 -1
- package/build/types/utils/WaterfallDetector.d.ts.map +1 -1
- package/build/types/utils/computeRequest.d.ts.map +1 -1
- package/build/types/vite/index.d.ts.map +1 -1
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @osdk/react-devtools
|
|
2
2
|
|
|
3
|
+
## 0.10.1-main-66005661366c2595515962d5dadf1375080d15a2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 6600566: Migrate @osdk/react, @osdk/react-devtools, and @osdk/react-components-storybook to lint with oxlint and format with oxfmt (configured via Ultracite) instead of ESLint and dprint (sixth increment of the repo-wide oxc migration; the React family ahead of @osdk/react-components)
|
|
8
|
+
- Updated dependencies [6600566]
|
|
9
|
+
- @osdk/react@2.41.1-main-66005661366c2595515962d5dadf1375080d15a2
|
|
10
|
+
- @osdk/api@2.41.1-main-66005661366c2595515962d5dadf1375080d15a2
|
|
11
|
+
- @osdk/client@2.41.1-main-66005661366c2595515962d5dadf1375080d15a2
|
|
12
|
+
|
|
3
13
|
## 0.10.0
|
|
4
14
|
|
|
5
15
|
### Minor Changes
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DevToolsContext.js","names":["createContext","DevToolsContext"],"sources":["DevToolsContext.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { Context } from \"react\";\nimport { createContext } from \"react\";\nimport type { MonitorStore } from \"./store/MonitorStore.js\";\n\nexport const DevToolsContext: Context<MonitorStore | null>
|
|
1
|
+
{"version":3,"file":"DevToolsContext.js","names":["createContext","DevToolsContext"],"sources":["DevToolsContext.ts"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { Context } from \"react\";\nimport { createContext } from \"react\";\n\nimport type { MonitorStore } from \"./store/MonitorStore.js\";\n\nexport const DevToolsContext: Context<MonitorStore | null> =\n createContext<MonitorStore | null>(null);\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA,SAASA,aAAa,QAAQ,OAAO;AAIrC,OAAO,MAAMC,eAA6C,gBACxDD,aAAa,CAAsB,IAAI,CAAC","ignoreList":[]}
|
|
@@ -68,7 +68,7 @@ export const ActionMetrics = ({
|
|
|
68
68
|
className: styles.metricValue
|
|
69
69
|
}, formatTime(avgServerLatency)), /*#__PURE__*/React.createElement("span", {
|
|
70
70
|
className: styles.metricSubtext
|
|
71
|
-
}, "Optimistic ", observedOptimisticActions > 0 ? formatTime(avgOptimisticLatency) : "\u2014")), /*#__PURE__*/React.createElement("div", {
|
|
71
|
+
}, "Optimistic", " ", observedOptimisticActions > 0 ? formatTime(avgOptimisticLatency) : "\u2014")), /*#__PURE__*/React.createElement("div", {
|
|
72
72
|
className: styles.metric
|
|
73
73
|
}, /*#__PURE__*/React.createElement("span", {
|
|
74
74
|
className: styles.metricLabel
|
|
@@ -84,6 +84,6 @@ export const ActionMetrics = ({
|
|
|
84
84
|
className: styles.metricValue
|
|
85
85
|
}, validations > 0 ? formatTime(avgValidationTime) : "\u2014"), /*#__PURE__*/React.createElement("span", {
|
|
86
86
|
className: styles.metricSubtext
|
|
87
|
-
}, validations > 0 ? `${formatNumber(validations)} validations \
|
|
87
|
+
}, validations > 0 ? `${formatNumber(validations)} validations \u00B7 saved ${formatTime(validationSavings)}` : "No validations run")));
|
|
88
88
|
};
|
|
89
89
|
//# sourceMappingURL=ActionMetrics.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionMetrics.js","names":["classNames","React","formatNumber","formatTime","styles","ROLLBACK_EXCELLENT","ROLLBACK_ACCEPTABLE","ActionMetrics","metrics","totalActions","aggregates","actionCount","configuredActions","configuredOptimisticActionCount","observedOptimisticActions","optimisticActionCount","totalTimeSaved","totalPerceivedSpeedup","avgTimeSaved","adoptionRate","rates","configuredOptimisticActionRate","effectiveness","avgServerLatency","averageServerRoundTripTime","avgOptimisticLatency","averageOptimisticRenderTime","rollbackRate","validations","validationCount","avgValidationTime","averageValidationTime","validationSavings","validationTimeSaved","createElement","Fragment","className","metric","metricLabel","metricValue","metricSubtext","toFixed","success","warning","danger","rollbackActionCount"],"sources":["ActionMetrics.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classNames from \"classnames\";\nimport React from \"react\";\nimport type { MetricsSnapshot } from \"../types/index.js\";\nimport { formatNumber, formatTime } from \"../utils/format.js\";\nimport styles from \"./MonitoringPanel.module.scss\";\n\nconst ROLLBACK_EXCELLENT = 0.1;\nconst ROLLBACK_ACCEPTABLE = 0.25;\n\nexport interface ActionMetricsProps {\n metrics: MetricsSnapshot;\n}\n\nexport const ActionMetrics: React.FC<ActionMetricsProps> = ({ metrics }) => {\n const totalActions = metrics.aggregates.actionCount;\n const configuredActions = metrics.aggregates.configuredOptimisticActionCount;\n const observedOptimisticActions = metrics.aggregates.optimisticActionCount;\n const totalTimeSaved = metrics.aggregates.totalPerceivedSpeedup;\n const avgTimeSaved = observedOptimisticActions > 0\n ? totalTimeSaved / observedOptimisticActions\n : 0;\n const adoptionRate = metrics.rates.configuredOptimisticActionRate;\n const effectiveness = configuredActions > 0\n ? observedOptimisticActions / configuredActions\n : 0;\n const avgServerLatency = metrics.rates.averageServerRoundTripTime;\n const avgOptimisticLatency = metrics.rates.averageOptimisticRenderTime;\n const rollbackRate = metrics.rates.rollbackRate;\n const validations = metrics.aggregates.validationCount;\n const avgValidationTime = metrics.rates.averageValidationTime;\n const validationSavings = metrics.rates.validationTimeSaved;\n const waitingForOptimism = configuredActions > 0\n && observedOptimisticActions === 0;\n\n return (\n <>\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Time Saved (Optimistic)</span>\n <span className={styles.metricValue}>\n {observedOptimisticActions > 0\n ? formatTime(avgTimeSaved)\n : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {observedOptimisticActions > 0\n ? `Total ${formatTime(totalTimeSaved)} across ${\n formatNumber(observedOptimisticActions)\n } actions`\n : waitingForOptimism\n ? \"Optimistic handlers have not emitted yet\"\n : \"No optimistic handlers observed\"}\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Optimistic Adoption</span>\n <span className={styles.metricValue}>\n {totalActions > 0 ? `${(adoptionRate * 100).toFixed(0)}%` : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {formatNumber(configuredActions)} / {formatNumber(totalActions)}{\" \"}\n actions\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Optimistic Effectiveness</span>\n <span className={styles.metricValue}>\n {configuredActions > 0\n ? `${(effectiveness * 100).toFixed(0)}%`\n : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {configuredActions > 0\n ? `${formatNumber(observedOptimisticActions)} emitted`\n : \"No optimistic handlers\"}\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Server Latency</span>\n <span className={styles.metricValue}>\n {formatTime(avgServerLatency)}\n </span>\n <span className={styles.metricSubtext}>\n Optimistic {observedOptimisticActions > 0\n ? formatTime(avgOptimisticLatency)\n : \"\\u2014\"}\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Rollback Rate</span>\n <span\n className={classNames(\n styles.metricValue,\n rollbackRate <= ROLLBACK_EXCELLENT\n ? styles.success\n : rollbackRate <= ROLLBACK_ACCEPTABLE\n ? styles.warning\n : styles.danger,\n )}\n >\n {totalActions > 0\n ? `${(rollbackRate * 100).toFixed(0)}%`\n : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {formatNumber(metrics.aggregates.rollbackActionCount)} rollbacks\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Validation</span>\n <span className={styles.metricValue}>\n {validations > 0 ? formatTime(avgValidationTime) : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {validations > 0\n ? `${formatNumber(validations)} validations \\u00b7 saved ${\n formatTime(validationSavings)\n }`\n : \"No validations run\"}\n </span>\n </div>\n </>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ActionMetrics.js","names":["classNames","React","formatNumber","formatTime","styles","ROLLBACK_EXCELLENT","ROLLBACK_ACCEPTABLE","ActionMetrics","metrics","totalActions","aggregates","actionCount","configuredActions","configuredOptimisticActionCount","observedOptimisticActions","optimisticActionCount","totalTimeSaved","totalPerceivedSpeedup","avgTimeSaved","adoptionRate","rates","configuredOptimisticActionRate","effectiveness","avgServerLatency","averageServerRoundTripTime","avgOptimisticLatency","averageOptimisticRenderTime","rollbackRate","validations","validationCount","avgValidationTime","averageValidationTime","validationSavings","validationTimeSaved","createElement","Fragment","className","metric","metricLabel","metricValue","metricSubtext","toFixed","success","warning","danger","rollbackActionCount"],"sources":["ActionMetrics.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classNames from \"classnames\";\nimport React from \"react\";\n\nimport type { MetricsSnapshot } from \"../types/index.js\";\nimport { formatNumber, formatTime } from \"../utils/format.js\";\n\nimport styles from \"./MonitoringPanel.module.scss\";\n\nconst ROLLBACK_EXCELLENT = 0.1;\nconst ROLLBACK_ACCEPTABLE = 0.25;\n\nexport interface ActionMetricsProps {\n metrics: MetricsSnapshot;\n}\n\nexport const ActionMetrics: React.FC<ActionMetricsProps> = ({ metrics }) => {\n const totalActions = metrics.aggregates.actionCount;\n const configuredActions = metrics.aggregates.configuredOptimisticActionCount;\n const observedOptimisticActions = metrics.aggregates.optimisticActionCount;\n const totalTimeSaved = metrics.aggregates.totalPerceivedSpeedup;\n const avgTimeSaved =\n observedOptimisticActions > 0\n ? totalTimeSaved / observedOptimisticActions\n : 0;\n const adoptionRate = metrics.rates.configuredOptimisticActionRate;\n const effectiveness =\n configuredActions > 0 ? observedOptimisticActions / configuredActions : 0;\n const avgServerLatency = metrics.rates.averageServerRoundTripTime;\n const avgOptimisticLatency = metrics.rates.averageOptimisticRenderTime;\n const rollbackRate = metrics.rates.rollbackRate;\n const validations = metrics.aggregates.validationCount;\n const avgValidationTime = metrics.rates.averageValidationTime;\n const validationSavings = metrics.rates.validationTimeSaved;\n const waitingForOptimism =\n configuredActions > 0 && observedOptimisticActions === 0;\n\n return (\n <>\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Time Saved (Optimistic)</span>\n <span className={styles.metricValue}>\n {observedOptimisticActions > 0 ? formatTime(avgTimeSaved) : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {observedOptimisticActions > 0\n ? `Total ${formatTime(totalTimeSaved)} across ${formatNumber(\n observedOptimisticActions\n )} actions`\n : waitingForOptimism\n ? \"Optimistic handlers have not emitted yet\"\n : \"No optimistic handlers observed\"}\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Optimistic Adoption</span>\n <span className={styles.metricValue}>\n {totalActions > 0 ? `${(adoptionRate * 100).toFixed(0)}%` : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {formatNumber(configuredActions)} / {formatNumber(totalActions)}{\" \"}\n actions\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Optimistic Effectiveness</span>\n <span className={styles.metricValue}>\n {configuredActions > 0\n ? `${(effectiveness * 100).toFixed(0)}%`\n : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {configuredActions > 0\n ? `${formatNumber(observedOptimisticActions)} emitted`\n : \"No optimistic handlers\"}\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Server Latency</span>\n <span className={styles.metricValue}>\n {formatTime(avgServerLatency)}\n </span>\n <span className={styles.metricSubtext}>\n Optimistic{\" \"}\n {observedOptimisticActions > 0\n ? formatTime(avgOptimisticLatency)\n : \"\\u2014\"}\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Rollback Rate</span>\n <span\n className={classNames(\n styles.metricValue,\n rollbackRate <= ROLLBACK_EXCELLENT\n ? styles.success\n : rollbackRate <= ROLLBACK_ACCEPTABLE\n ? styles.warning\n : styles.danger\n )}\n >\n {totalActions > 0 ? `${(rollbackRate * 100).toFixed(0)}%` : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {formatNumber(metrics.aggregates.rollbackActionCount)} rollbacks\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Validation</span>\n <span className={styles.metricValue}>\n {validations > 0 ? formatTime(avgValidationTime) : \"\\u2014\"}\n </span>\n <span className={styles.metricSubtext}>\n {validations > 0\n ? `${formatNumber(validations)} validations \\u00B7 saved ${formatTime(\n validationSavings\n )}`\n : \"No validations run\"}\n </span>\n </div>\n </>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -36,7 +36,7 @@ const TICK_LABEL_PROPS = {
|
|
|
36
36
|
textAnchor: "end",
|
|
37
37
|
fill: "#5c6b77",
|
|
38
38
|
fontSize: 11,
|
|
39
|
-
fontFamily: "
|
|
39
|
+
fontFamily: '"JetBrains Mono", "SF Mono", "Monaco", "Menlo", "Consolas", monospace'
|
|
40
40
|
};
|
|
41
41
|
export const BubbleChart = ({
|
|
42
42
|
computeStore,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BubbleChart.js","names":["Axis","GlyphCircle","GridColumns","useParentSize","scaleLinear","Text","React","useComputeLastRecordingEvent","useComputeRecording","useComputeRequests","useTimeElapsed","visitComputeRequest","formatMilliseconds","css","EMPTY_DATA","STROKE_WIDTH_PX","FIXED_CHART_HEIGHT_PX","MARGIN_TOP","GRID_COLOR","TICK_LABEL_PROPS","textAnchor","fill","fontSize","fontFamily","BubbleChart","computeStore","fillHeight","selectedIds","onSelectRequest","requests","isRecording","lastRecordingEvent","startTimestamp","timestamp","requestData","useMemo","length","hasSelections","selectedSet","Set","undefined","datums","map","request","x","requestTimestamp","getTime","y","requestPayloadHash","size","failed","fulfilled","req","Math","max","computeUsage","fulfilledWithoutUsage","pending","isSelected","has","id","selected","unselected","datum","push","timeElapsed","maxTimeDomain","type","endTimestamp","Date","now","parentRef","width","height","chartHeight","xScale","domain","range","yScale","handleUnselect","useCallback","createElement","className","container","ref","opacity","onClick","scale","tickLabelProps","top","orientation","stroke","hideTicks","hideZero","tickComponent","renderTick","tickFormat","formatTick","RequestGlyph","key","handleClick","glyph","left","fillOpacity","strokeOpacity","strokeWidth","formattedValue","props","_extends","ms","valueOf"],"sources":["BubbleChart.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Axis } from \"@visx/axis\";\nimport { GlyphCircle } from \"@visx/glyph\";\nimport { GridColumns } from \"@visx/grid\";\nimport { useParentSize } from \"@visx/responsive\";\nimport { scaleLinear } from \"@visx/scale\";\nimport { Text, type TextProps } from \"@visx/text\";\nimport React from \"react\";\nimport {\n useComputeLastRecordingEvent,\n useComputeRecording,\n useComputeRequests,\n} from \"../hooks/useComputeSelectors.js\";\nimport { useTimeElapsed } from \"../hooks/useTimeElapsed.js\";\nimport type { ComputeStore } from \"../store/ComputeStore.js\";\nimport { visitComputeRequest } from \"../utils/computeRequest.js\";\nimport { formatMilliseconds } from \"../utils/format.js\";\nimport css from \"./BubbleChart.module.scss\";\n\ntype Datum = {\n id: string;\n x: number;\n y: number;\n size: number;\n fill: string;\n isSelected: boolean | undefined;\n};\n\nconst EMPTY_DATA: Datum[] = [];\n\nconst STROKE_WIDTH_PX = 1.5;\nconst FIXED_CHART_HEIGHT_PX = 250;\n\nconst MARGIN_TOP = 10;\n\nconst GRID_COLOR = \"#2d343c\";\n\nconst TICK_LABEL_PROPS = {\n textAnchor: \"end\",\n fill: \"#5c6b77\",\n fontSize: 11,\n fontFamily:\n \"\\\"JetBrains Mono\\\", \\\"SF Mono\\\", \\\"Monaco\\\", \\\"Menlo\\\", \\\"Consolas\\\", monospace\",\n} as const;\n\ninterface BubbleChartProps {\n computeStore: ComputeStore;\n fillHeight: boolean;\n selectedIds: string[];\n onSelectRequest: (id: string | undefined) => void;\n}\n\nexport const BubbleChart: React.FC<BubbleChartProps> = ({\n computeStore,\n fillHeight,\n selectedIds,\n onSelectRequest,\n}) => {\n const requests = useComputeRequests(computeStore);\n const isRecording = useComputeRecording(computeStore);\n const lastRecordingEvent = useComputeLastRecordingEvent(computeStore);\n\n const startTimestamp = lastRecordingEvent?.timestamp;\n\n const requestData: Datum[] = React.useMemo(() => {\n if (startTimestamp == null || requests.length === 0) {\n return EMPTY_DATA;\n }\n\n const hasSelections = selectedIds.length > 0;\n const selectedSet = hasSelections ? new Set(selectedIds) : undefined;\n\n const datums = requests.map(\n (request): Datum => ({\n x: request.requestTimestamp.getTime() - startTimestamp.getTime(),\n y: (request.requestPayloadHash % 10) + 1,\n size: visitComputeRequest(request, {\n failed: () => 40,\n fulfilled: (req) => Math.max(1, req.computeUsage) * 20,\n fulfilledWithoutUsage: () => 20,\n pending: () => 20,\n }),\n fill: visitComputeRequest(request, {\n failed: () => \"#e05252\",\n fulfilled: () => \"#2d8cf0\",\n fulfilledWithoutUsage: () => \"#7a8693\",\n pending: () => \"#6b7785\",\n }),\n isSelected: selectedSet\n ? selectedSet.has(request.id)\n : undefined,\n id: request.id,\n }),\n );\n\n if (hasSelections) {\n const selected: Datum[] = [];\n const unselected: Datum[] = [];\n for (const datum of datums) {\n if (datum.isSelected) {\n selected.push(datum);\n } else {\n unselected.push(datum);\n }\n }\n return [...unselected, ...selected];\n }\n\n return datums;\n }, [requests, selectedIds, startTimestamp]);\n\n const timeElapsed = useTimeElapsed(isRecording ? startTimestamp : undefined);\n\n const maxTimeDomain = lastRecordingEvent?.type === \"ended\"\n ? (lastRecordingEvent.endTimestamp?.getTime() ?? Date.now())\n - lastRecordingEvent.timestamp.getTime()\n : timeElapsed;\n\n const { parentRef, width, height } = useParentSize();\n\n const chartHeight = fillHeight ? height : FIXED_CHART_HEIGHT_PX;\n\n const xScale = React.useMemo(\n () =>\n scaleLinear<number>({\n domain: [0, Math.max(500, maxTimeDomain ?? 0)],\n range: [0, width],\n }),\n [maxTimeDomain, width],\n );\n\n const yScale = React.useMemo(\n () =>\n scaleLinear<number>({\n domain: [-1, 12],\n range: [chartHeight, MARGIN_TOP],\n }),\n [chartHeight],\n );\n\n const handleUnselect = React.useCallback(\n () => onSelectRequest(undefined),\n [onSelectRequest],\n );\n\n return (\n <div className={css.container} ref={parentRef}>\n <svg height={chartHeight} width={width}>\n <rect\n opacity={0}\n onClick={handleUnselect}\n height={chartHeight}\n width={width}\n />\n <Axis\n scale={xScale}\n tickLabelProps={TICK_LABEL_PROPS}\n top={25}\n orientation=\"top\"\n stroke={GRID_COLOR}\n hideTicks={true}\n hideZero={true}\n tickComponent={renderTick}\n tickFormat={formatTick}\n />\n <GridColumns\n stroke={GRID_COLOR}\n scale={xScale}\n width={width}\n height={chartHeight}\n />\n {requestData.map((datum) => (\n <RequestGlyph\n key={datum.id}\n datum={datum}\n xScale={xScale}\n yScale={yScale}\n onClick={onSelectRequest}\n />\n ))}\n </svg>\n </div>\n );\n};\n\ninterface RequestGlyphProps {\n datum: Datum;\n xScale: (x: number) => number;\n yScale: (y: number) => number;\n onClick: (id: string) => void;\n}\n\nconst RequestGlyph: React.FC<RequestGlyphProps> = ({\n datum,\n onClick,\n xScale,\n yScale,\n}) => {\n const fill = datum.isSelected === false ? \"#323a44\" : datum.fill;\n\n const handleClick = React.useCallback(() => {\n onClick(datum.id);\n }, [datum.id, onClick]);\n\n return (\n <GlyphCircle\n className={css.glyph}\n top={yScale(datum.y)}\n left={xScale(datum.x)}\n size={datum.size}\n fill={fill}\n fillOpacity={0.5}\n onClick={handleClick}\n strokeOpacity={1}\n stroke={`color-mix(in srgb, ${fill}, white 20%)`}\n strokeWidth={STROKE_WIDTH_PX}\n />\n );\n};\n\nconst renderTick = ({\n x,\n y,\n formattedValue,\n ...props\n}: Partial<TextProps> & {\n x: number;\n y: number;\n formattedValue: string | undefined;\n}): React.ReactNode => {\n return (\n <Text {...props} x={x - 3} y={y}>\n {formattedValue}\n </Text>\n );\n};\n\nconst formatTick = (ms: { valueOf(): number }) =>\n formatMilliseconds(ms.valueOf(), false);\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"BubbleChart.js","names":["Axis","GlyphCircle","GridColumns","useParentSize","scaleLinear","Text","React","useComputeLastRecordingEvent","useComputeRecording","useComputeRequests","useTimeElapsed","visitComputeRequest","formatMilliseconds","css","EMPTY_DATA","STROKE_WIDTH_PX","FIXED_CHART_HEIGHT_PX","MARGIN_TOP","GRID_COLOR","TICK_LABEL_PROPS","textAnchor","fill","fontSize","fontFamily","BubbleChart","computeStore","fillHeight","selectedIds","onSelectRequest","requests","isRecording","lastRecordingEvent","startTimestamp","timestamp","requestData","useMemo","length","hasSelections","selectedSet","Set","undefined","datums","map","request","x","requestTimestamp","getTime","y","requestPayloadHash","size","failed","fulfilled","req","Math","max","computeUsage","fulfilledWithoutUsage","pending","isSelected","has","id","selected","unselected","datum","push","timeElapsed","maxTimeDomain","type","endTimestamp","Date","now","parentRef","width","height","chartHeight","xScale","domain","range","yScale","handleUnselect","useCallback","createElement","className","container","ref","opacity","onClick","scale","tickLabelProps","top","orientation","stroke","hideTicks","hideZero","tickComponent","renderTick","tickFormat","formatTick","RequestGlyph","key","handleClick","glyph","left","fillOpacity","strokeOpacity","strokeWidth","formattedValue","props","_extends","ms","valueOf"],"sources":["BubbleChart.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Axis } from \"@visx/axis\";\nimport { GlyphCircle } from \"@visx/glyph\";\nimport { GridColumns } from \"@visx/grid\";\nimport { useParentSize } from \"@visx/responsive\";\nimport { scaleLinear } from \"@visx/scale\";\nimport { Text, type TextProps } from \"@visx/text\";\nimport React from \"react\";\n\nimport {\n useComputeLastRecordingEvent,\n useComputeRecording,\n useComputeRequests,\n} from \"../hooks/useComputeSelectors.js\";\nimport { useTimeElapsed } from \"../hooks/useTimeElapsed.js\";\nimport type { ComputeStore } from \"../store/ComputeStore.js\";\nimport { visitComputeRequest } from \"../utils/computeRequest.js\";\nimport { formatMilliseconds } from \"../utils/format.js\";\n\nimport css from \"./BubbleChart.module.scss\";\n\ntype Datum = {\n id: string;\n x: number;\n y: number;\n size: number;\n fill: string;\n isSelected: boolean | undefined;\n};\n\nconst EMPTY_DATA: Datum[] = [];\n\nconst STROKE_WIDTH_PX = 1.5;\nconst FIXED_CHART_HEIGHT_PX = 250;\n\nconst MARGIN_TOP = 10;\n\nconst GRID_COLOR = \"#2d343c\";\n\nconst TICK_LABEL_PROPS = {\n textAnchor: \"end\",\n fill: \"#5c6b77\",\n fontSize: 11,\n fontFamily:\n '\"JetBrains Mono\", \"SF Mono\", \"Monaco\", \"Menlo\", \"Consolas\", monospace',\n} as const;\n\ninterface BubbleChartProps {\n computeStore: ComputeStore;\n fillHeight: boolean;\n selectedIds: string[];\n onSelectRequest: (id: string | undefined) => void;\n}\n\nexport const BubbleChart: React.FC<BubbleChartProps> = ({\n computeStore,\n fillHeight,\n selectedIds,\n onSelectRequest,\n}) => {\n const requests = useComputeRequests(computeStore);\n const isRecording = useComputeRecording(computeStore);\n const lastRecordingEvent = useComputeLastRecordingEvent(computeStore);\n\n const startTimestamp = lastRecordingEvent?.timestamp;\n\n const requestData: Datum[] = React.useMemo(() => {\n if (startTimestamp == null || requests.length === 0) {\n return EMPTY_DATA;\n }\n\n const hasSelections = selectedIds.length > 0;\n const selectedSet = hasSelections ? new Set(selectedIds) : undefined;\n\n const datums = requests.map(\n (request): Datum => ({\n x: request.requestTimestamp.getTime() - startTimestamp.getTime(),\n y: (request.requestPayloadHash % 10) + 1,\n size: visitComputeRequest(request, {\n failed: () => 40,\n fulfilled: (req) => Math.max(1, req.computeUsage) * 20,\n fulfilledWithoutUsage: () => 20,\n pending: () => 20,\n }),\n fill: visitComputeRequest(request, {\n failed: () => \"#e05252\",\n fulfilled: () => \"#2d8cf0\",\n fulfilledWithoutUsage: () => \"#7a8693\",\n pending: () => \"#6b7785\",\n }),\n isSelected: selectedSet ? selectedSet.has(request.id) : undefined,\n id: request.id,\n })\n );\n\n if (hasSelections) {\n const selected: Datum[] = [];\n const unselected: Datum[] = [];\n for (const datum of datums) {\n if (datum.isSelected) {\n selected.push(datum);\n } else {\n unselected.push(datum);\n }\n }\n return [...unselected, ...selected];\n }\n\n return datums;\n }, [requests, selectedIds, startTimestamp]);\n\n const timeElapsed = useTimeElapsed(isRecording ? startTimestamp : undefined);\n\n const maxTimeDomain =\n lastRecordingEvent?.type === \"ended\"\n ? (lastRecordingEvent.endTimestamp?.getTime() ?? Date.now()) -\n lastRecordingEvent.timestamp.getTime()\n : timeElapsed;\n\n const { parentRef, width, height } = useParentSize();\n\n const chartHeight = fillHeight ? height : FIXED_CHART_HEIGHT_PX;\n\n const xScale = React.useMemo(\n () =>\n scaleLinear<number>({\n domain: [0, Math.max(500, maxTimeDomain ?? 0)],\n range: [0, width],\n }),\n [maxTimeDomain, width]\n );\n\n const yScale = React.useMemo(\n () =>\n scaleLinear<number>({\n domain: [-1, 12],\n range: [chartHeight, MARGIN_TOP],\n }),\n [chartHeight]\n );\n\n const handleUnselect = React.useCallback(\n () => onSelectRequest(undefined),\n [onSelectRequest]\n );\n\n return (\n <div className={css.container} ref={parentRef}>\n <svg height={chartHeight} width={width}>\n <rect\n opacity={0}\n onClick={handleUnselect}\n height={chartHeight}\n width={width}\n />\n <Axis\n scale={xScale}\n tickLabelProps={TICK_LABEL_PROPS}\n top={25}\n orientation=\"top\"\n stroke={GRID_COLOR}\n hideTicks={true}\n hideZero={true}\n tickComponent={renderTick}\n tickFormat={formatTick}\n />\n <GridColumns\n stroke={GRID_COLOR}\n scale={xScale}\n width={width}\n height={chartHeight}\n />\n {requestData.map((datum) => (\n <RequestGlyph\n key={datum.id}\n datum={datum}\n xScale={xScale}\n yScale={yScale}\n onClick={onSelectRequest}\n />\n ))}\n </svg>\n </div>\n );\n};\n\ninterface RequestGlyphProps {\n datum: Datum;\n xScale: (x: number) => number;\n yScale: (y: number) => number;\n onClick: (id: string) => void;\n}\n\nconst RequestGlyph: React.FC<RequestGlyphProps> = ({\n datum,\n onClick,\n xScale,\n yScale,\n}) => {\n const fill = datum.isSelected === false ? \"#323a44\" : datum.fill;\n\n const handleClick = React.useCallback(() => {\n onClick(datum.id);\n }, [datum.id, onClick]);\n\n return (\n <GlyphCircle\n className={css.glyph}\n top={yScale(datum.y)}\n left={xScale(datum.x)}\n size={datum.size}\n fill={fill}\n fillOpacity={0.5}\n onClick={handleClick}\n strokeOpacity={1}\n stroke={`color-mix(in srgb, ${fill}, white 20%)`}\n strokeWidth={STROKE_WIDTH_PX}\n />\n );\n};\n\nconst renderTick = ({\n x,\n y,\n formattedValue,\n ...props\n}: Partial<TextProps> & {\n x: number;\n y: number;\n formattedValue: string | undefined;\n}): React.ReactNode => {\n return (\n <Text {...props} x={x - 3} y={y}>\n {formattedValue}\n </Text>\n );\n};\n\nconst formatTick = (ms: { valueOf(): number }) =>\n formatMilliseconds(ms.valueOf(), false);\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -18,8 +18,8 @@ import { Button, ButtonGroup, Card, Collapse, Icon, InputGroup, Tag, Tooltip } f
|
|
|
18
18
|
import React, { useMemo, useState } from "react";
|
|
19
19
|
import { createPollingStore } from "../hooks/createPollingStore.js";
|
|
20
20
|
import { formatBytes, formatRelativeTime } from "../utils/format.js";
|
|
21
|
-
import styles from "./CacheInspectorTab.module.scss.js";
|
|
22
21
|
import { CopyableCodeBlock } from "./CopyableCodeBlock.js";
|
|
22
|
+
import styles from "./CacheInspectorTab.module.scss.js";
|
|
23
23
|
function getTypeColor(type) {
|
|
24
24
|
switch (type) {
|
|
25
25
|
case "object":
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CacheInspectorTab.js","names":["Button","ButtonGroup","Card","Collapse","Icon","InputGroup","Tag","Tooltip","React","useMemo","useState","createPollingStore","formatBytes","formatRelativeTime","styles","CopyableCodeBlock","getTypeColor","type","undefined","getStatusIcon","status","getStatusColor","emptySnapshot","entries","stats","totalEntries","totalSize","totalHits","CacheInspectorTab","monitorStore","searchQuery","setSearchQuery","expandedKeys","setExpandedKeys","Set","snapshotStore","loadCacheEntries","reduce","sum","e","metadata","size","hitCount","length","polledSnapshot","useSyncExternalStore","subscribe","getSnapshot","snapshot","filteredEntries","filter","entry","trim","query","toLowerCase","key","includes","objectType","toggleExpanded","newSet","has","delete","add","invalidateError","setInvalidateError","handleInvalidate","invalidateCacheEntry","forceRefresh","error","Error","String","handleClearAll","confirm","clearCache","createElement","className","cacheInspector","toolbar","title","stat","statLabel","statValue","toolbarActions","search","leftIcon","placeholder","value","onChange","target","fill","icon","onClick","intent","errorBanner","message","variant","content","skeletonList","Array","from","map","_","i","skeletonEntry","skeletonTag","skeletonText","skeletonBadge","emptyState","emptyTitle","emptyDescription","index","isExpanded","entryCard","style","entryHeader","entryHeaderLeft","expandIcon","minimal","typeTag","isOptimistic","entryHeaderRight","Date","timestamp","toLocaleString","age","stopPropagation","isOpen","entryBody","section","codeBlock","where","orderBy","JSON","stringify","pageSize","linkName","data"],"sources":["CacheInspectorTab.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Button,\n ButtonGroup,\n Card,\n Collapse,\n Icon,\n InputGroup,\n Tag,\n Tooltip,\n} from \"@blueprintjs/core\";\nimport type { CacheEntry } from \"@osdk/client/observable\";\nimport React, { useMemo, useState } from \"react\";\nimport { createPollingStore } from \"../hooks/createPollingStore.js\";\nimport type { MonitorStore } from \"../store/MonitorStore.js\";\nimport { formatBytes, formatRelativeTime } from \"../utils/format.js\";\nimport styles from \"./CacheInspectorTab.module.scss\";\nimport { CopyableCodeBlock } from \"./CopyableCodeBlock.js\";\n\nfunction getTypeColor(type: string) {\n switch (type) {\n case \"object\":\n return \"primary\";\n case \"list\":\n return \"success\";\n case \"link\":\n return \"warning\";\n case \"objectSet\":\n return \"danger\";\n default:\n return undefined;\n }\n}\n\nfunction getStatusIcon(status: string) {\n switch (status) {\n case \"loaded\":\n return \"tick-circle\";\n case \"loading\":\n return \"refresh\";\n case \"error\":\n return \"error\";\n case \"init\":\n return \"time\";\n default:\n return \"help\";\n }\n}\n\nfunction getStatusColor(status: string) {\n switch (status) {\n case \"loaded\":\n return \"success\";\n case \"loading\":\n return \"primary\";\n case \"error\":\n return \"danger\";\n case \"init\":\n return \"none\";\n default:\n return undefined;\n }\n}\n\nexport interface CacheInspectorTabProps {\n monitorStore: MonitorStore;\n}\n\ninterface CacheSnapshot {\n entries: CacheEntry[];\n stats: {\n totalEntries: number;\n totalSize: number;\n totalHits: number;\n };\n}\n\nconst emptySnapshot: CacheSnapshot = {\n entries: [],\n stats: { totalEntries: 0, totalSize: 0, totalHits: 0 },\n};\n\nexport const CacheInspectorTab: React.FC<CacheInspectorTabProps> = (\n { monitorStore },\n) => {\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [expandedKeys, setExpandedKeys] = useState<Set<string>>(new Set());\n const snapshotStore = React.useMemo(\n () =>\n createPollingStore(async () => {\n const entries = await monitorStore.loadCacheEntries();\n const totalSize = entries.reduce(\n (sum: number, e: CacheEntry) => sum + e.metadata.size,\n 0,\n );\n const totalHits = entries.reduce(\n (sum: number, e: CacheEntry) => sum + (e.metadata.hitCount ?? 0),\n 0,\n );\n return {\n entries,\n stats: {\n totalEntries: entries.length,\n totalSize,\n totalHits,\n },\n };\n }, 2000),\n [monitorStore],\n );\n const polledSnapshot = React.useSyncExternalStore(\n snapshotStore.subscribe,\n snapshotStore.getSnapshot,\n );\n\n const snapshot: CacheSnapshot = polledSnapshot ?? emptySnapshot;\n\n const filteredEntries = useMemo(() =>\n snapshot.entries.filter(entry => {\n if (!searchQuery.trim()) {\n return true;\n }\n const query = searchQuery.toLowerCase();\n return (\n entry.key.toLowerCase().includes(query)\n || entry.objectType.toLowerCase().includes(query)\n || entry.type.toLowerCase().includes(query)\n );\n }), [snapshot.entries, searchQuery]);\n\n const toggleExpanded = (key: string) => {\n const newSet = new Set(expandedKeys);\n if (newSet.has(key)) {\n newSet.delete(key);\n } else {\n newSet.add(key);\n }\n setExpandedKeys(newSet);\n };\n\n const [invalidateError, setInvalidateError] = useState<Error | null>(null);\n\n const handleInvalidate = async (entry: CacheEntry) => {\n setInvalidateError(null);\n try {\n await monitorStore.invalidateCacheEntry(entry);\n snapshotStore.forceRefresh();\n } catch (error) {\n setInvalidateError(\n error instanceof Error ? error : new Error(String(error)),\n );\n }\n };\n\n const handleClearAll = async () => {\n if (\n confirm(\"Clear entire cache? This will force all queries to refetch.\")\n ) {\n setInvalidateError(null);\n try {\n await monitorStore.clearCache();\n snapshotStore.forceRefresh();\n } catch (error) {\n setInvalidateError(\n error instanceof Error ? error : new Error(String(error)),\n );\n }\n }\n };\n\n return (\n <div className={styles.cacheInspector}>\n <div className={styles.toolbar}>\n <h3 className={styles.title}>Cache Inspector</h3>\n\n <div className={styles.stats}>\n <div className={styles.stat}>\n <span className={styles.statLabel}>Entries</span>\n <span className={styles.statValue}>\n {snapshot.stats.totalEntries}\n </span>\n </div>\n\n <div className={styles.stat}>\n <span className={styles.statLabel}>Total Size</span>\n <span className={styles.statValue}>\n {formatBytes(snapshot.stats.totalSize)}\n </span>\n </div>\n\n <div className={styles.stat}>\n <span className={styles.statLabel}>Total Hits</span>\n <span className={styles.statValue}>{snapshot.stats.totalHits}</span>\n </div>\n </div>\n </div>\n\n <div className={styles.toolbarActions}>\n <div className={styles.search}>\n <InputGroup\n leftIcon=\"search\"\n placeholder=\"Search cache entries...\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n fill={true}\n />\n </div>\n\n <ButtonGroup>\n <Button\n icon=\"refresh\"\n onClick={() => snapshotStore.forceRefresh()}\n size=\"small\"\n >\n Refresh\n </Button>\n <Button\n icon=\"trash\"\n intent=\"danger\"\n onClick={() => void handleClearAll()}\n size=\"small\"\n >\n Clear All\n </Button>\n </ButtonGroup>\n </div>\n\n {invalidateError && (\n <div className={styles.errorBanner}>\n <Icon icon=\"error\" intent=\"danger\" />\n <span>{invalidateError.message}</span>\n <Button\n icon=\"cross\"\n variant=\"minimal\"\n size=\"small\"\n onClick={() => {\n setInvalidateError(null);\n }}\n />\n </div>\n )}\n\n <div className={styles.content}>\n {polledSnapshot === undefined && (\n <div className={styles.skeletonList}>\n {Array.from({ length: 5 }).map((_, i) => (\n <div key={i} className={styles.skeletonEntry}>\n <div className={styles.skeletonTag} />\n <div className={styles.skeletonText} />\n <div className={styles.skeletonBadge} />\n </div>\n ))}\n </div>\n )}\n\n {filteredEntries.length === 0 && polledSnapshot !== undefined && (\n <div className={styles.emptyState}>\n <Icon icon=\"database\" size={28} />\n <div className={styles.emptyTitle}>\n {snapshot.entries.length === 0\n ? \"No Cache Entries\"\n : \"No Matching Entries\"}\n </div>\n <div className={styles.emptyDescription}>\n {snapshot.entries.length === 0\n ? \"The cache is empty. Query some data to see cache entries.\"\n : \"Try a different search term.\"}\n </div>\n </div>\n )}\n\n {filteredEntries.map((entry, index) => {\n const isExpanded = expandedKeys.has(entry.key);\n return (\n <Card\n key={entry.key}\n className={styles.entryCard}\n style={{ \"--entrance-index\": index } as React.CSSProperties}\n >\n <div\n className={styles.entryHeader}\n onClick={() => toggleExpanded(entry.key)}\n >\n <div className={styles.entryHeaderLeft}>\n <Icon\n icon={isExpanded ? \"chevron-down\" : \"chevron-right\"}\n size={14}\n className={styles.expandIcon}\n />\n <Tag\n minimal={true}\n intent={getTypeColor(entry.type)}\n className={styles.typeTag}\n >\n {entry.type}\n </Tag>\n <span className={styles.objectType}>{entry.objectType}</span>\n {entry.metadata.isOptimistic && (\n <Tooltip content=\"Has optimistic updates\">\n <Tag minimal={true} intent=\"warning\" icon=\"time\">\n Optimistic\n </Tag>\n </Tooltip>\n )}\n </div>\n\n <div className={styles.entryHeaderRight}>\n <Tooltip content={`Status: ${entry.metadata.status}`}>\n <Tag\n minimal={true}\n intent={getStatusColor(entry.metadata.status)}\n icon={getStatusIcon(entry.metadata.status)}\n >\n {entry.metadata.status}\n </Tag>\n </Tooltip>\n <Tooltip\n content={`Last updated: ${\n new Date(entry.metadata.timestamp).toLocaleString()\n }`}\n >\n <span className={styles.age}>\n {formatRelativeTime(entry.metadata.timestamp)}\n </span>\n </Tooltip>\n <Tooltip content={`Cache entry size`}>\n <span className={styles.size}>\n {formatBytes(entry.metadata.size)}\n </span>\n </Tooltip>\n <Button\n icon=\"refresh\"\n variant=\"minimal\"\n size=\"small\"\n onClick={(e) => {\n e.stopPropagation();\n void handleInvalidate(entry);\n }}\n />\n </div>\n </div>\n\n <Collapse isOpen={isExpanded}>\n <div className={styles.entryBody}>\n <div className={styles.section}>\n <h4>Cache Key</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {entry.key}\n </CopyableCodeBlock>\n </div>\n\n {entry.type === \"list\"\n && (entry.where != null || entry.orderBy != null) && (\n <div className={styles.section}>\n <h4>Query Parameters</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {JSON.stringify(\n {\n where: entry.where,\n orderBy: entry.orderBy,\n pageSize: entry.pageSize,\n },\n null,\n 2,\n )}\n </CopyableCodeBlock>\n </div>\n )}\n\n {entry.type === \"link\" && entry.linkName != null && (\n <div className={styles.section}>\n <h4>Link</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {entry.linkName}\n </CopyableCodeBlock>\n </div>\n )}\n\n {entry.data !== undefined && (\n <div className={styles.section}>\n <h4>Cached Data</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {JSON.stringify(entry.data, null, 2)}\n </CopyableCodeBlock>\n </div>\n )}\n </div>\n </Collapse>\n </Card>\n );\n })}\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"CacheInspectorTab.js","names":["Button","ButtonGroup","Card","Collapse","Icon","InputGroup","Tag","Tooltip","React","useMemo","useState","createPollingStore","formatBytes","formatRelativeTime","CopyableCodeBlock","styles","getTypeColor","type","undefined","getStatusIcon","status","getStatusColor","emptySnapshot","entries","stats","totalEntries","totalSize","totalHits","CacheInspectorTab","monitorStore","searchQuery","setSearchQuery","expandedKeys","setExpandedKeys","Set","snapshotStore","loadCacheEntries","reduce","sum","e","metadata","size","hitCount","length","polledSnapshot","useSyncExternalStore","subscribe","getSnapshot","snapshot","filteredEntries","filter","entry","trim","query","toLowerCase","key","includes","objectType","toggleExpanded","newSet","has","delete","add","invalidateError","setInvalidateError","handleInvalidate","invalidateCacheEntry","forceRefresh","error","Error","String","handleClearAll","confirm","clearCache","createElement","className","cacheInspector","toolbar","title","stat","statLabel","statValue","toolbarActions","search","leftIcon","placeholder","value","onChange","target","fill","icon","onClick","intent","errorBanner","message","variant","content","skeletonList","Array","from","map","_","i","skeletonEntry","skeletonTag","skeletonText","skeletonBadge","emptyState","emptyTitle","emptyDescription","index","isExpanded","entryCard","style","entryHeader","entryHeaderLeft","expandIcon","minimal","typeTag","isOptimistic","entryHeaderRight","Date","timestamp","toLocaleString","age","stopPropagation","isOpen","entryBody","section","codeBlock","where","orderBy","JSON","stringify","pageSize","linkName","data"],"sources":["CacheInspectorTab.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Button,\n ButtonGroup,\n Card,\n Collapse,\n Icon,\n InputGroup,\n Tag,\n Tooltip,\n} from \"@blueprintjs/core\";\nimport type { CacheEntry } from \"@osdk/client/observable\";\nimport React, { useMemo, useState } from \"react\";\n\nimport { createPollingStore } from \"../hooks/createPollingStore.js\";\nimport type { MonitorStore } from \"../store/MonitorStore.js\";\nimport { formatBytes, formatRelativeTime } from \"../utils/format.js\";\nimport { CopyableCodeBlock } from \"./CopyableCodeBlock.js\";\n\nimport styles from \"./CacheInspectorTab.module.scss\";\n\nfunction getTypeColor(type: string) {\n switch (type) {\n case \"object\":\n return \"primary\";\n case \"list\":\n return \"success\";\n case \"link\":\n return \"warning\";\n case \"objectSet\":\n return \"danger\";\n default:\n return undefined;\n }\n}\n\nfunction getStatusIcon(status: string) {\n switch (status) {\n case \"loaded\":\n return \"tick-circle\";\n case \"loading\":\n return \"refresh\";\n case \"error\":\n return \"error\";\n case \"init\":\n return \"time\";\n default:\n return \"help\";\n }\n}\n\nfunction getStatusColor(status: string) {\n switch (status) {\n case \"loaded\":\n return \"success\";\n case \"loading\":\n return \"primary\";\n case \"error\":\n return \"danger\";\n case \"init\":\n return \"none\";\n default:\n return undefined;\n }\n}\n\nexport interface CacheInspectorTabProps {\n monitorStore: MonitorStore;\n}\n\ninterface CacheSnapshot {\n entries: CacheEntry[];\n stats: {\n totalEntries: number;\n totalSize: number;\n totalHits: number;\n };\n}\n\nconst emptySnapshot: CacheSnapshot = {\n entries: [],\n stats: { totalEntries: 0, totalSize: 0, totalHits: 0 },\n};\n\nexport const CacheInspectorTab: React.FC<CacheInspectorTabProps> = ({\n monitorStore,\n}) => {\n const [searchQuery, setSearchQuery] = useState(\"\");\n const [expandedKeys, setExpandedKeys] = useState<Set<string>>(new Set());\n const snapshotStore = React.useMemo(\n () =>\n createPollingStore(async () => {\n const entries = await monitorStore.loadCacheEntries();\n const totalSize = entries.reduce(\n (sum: number, e: CacheEntry) => sum + e.metadata.size,\n 0\n );\n const totalHits = entries.reduce(\n (sum: number, e: CacheEntry) => sum + (e.metadata.hitCount ?? 0),\n 0\n );\n return {\n entries,\n stats: {\n totalEntries: entries.length,\n totalSize,\n totalHits,\n },\n };\n }, 2000),\n [monitorStore]\n );\n const polledSnapshot = React.useSyncExternalStore(\n snapshotStore.subscribe,\n snapshotStore.getSnapshot\n );\n\n const snapshot: CacheSnapshot = polledSnapshot ?? emptySnapshot;\n\n const filteredEntries = useMemo(\n () =>\n snapshot.entries.filter((entry) => {\n if (!searchQuery.trim()) {\n return true;\n }\n const query = searchQuery.toLowerCase();\n return (\n entry.key.toLowerCase().includes(query) ||\n entry.objectType.toLowerCase().includes(query) ||\n entry.type.toLowerCase().includes(query)\n );\n }),\n [snapshot.entries, searchQuery]\n );\n\n const toggleExpanded = (key: string) => {\n const newSet = new Set(expandedKeys);\n if (newSet.has(key)) {\n newSet.delete(key);\n } else {\n newSet.add(key);\n }\n setExpandedKeys(newSet);\n };\n\n const [invalidateError, setInvalidateError] = useState<Error | null>(null);\n\n const handleInvalidate = async (entry: CacheEntry) => {\n setInvalidateError(null);\n try {\n await monitorStore.invalidateCacheEntry(entry);\n snapshotStore.forceRefresh();\n } catch (error) {\n setInvalidateError(\n error instanceof Error ? error : new Error(String(error))\n );\n }\n };\n\n const handleClearAll = async () => {\n if (\n confirm(\"Clear entire cache? This will force all queries to refetch.\")\n ) {\n setInvalidateError(null);\n try {\n await monitorStore.clearCache();\n snapshotStore.forceRefresh();\n } catch (error) {\n setInvalidateError(\n error instanceof Error ? error : new Error(String(error))\n );\n }\n }\n };\n\n return (\n <div className={styles.cacheInspector}>\n <div className={styles.toolbar}>\n <h3 className={styles.title}>Cache Inspector</h3>\n\n <div className={styles.stats}>\n <div className={styles.stat}>\n <span className={styles.statLabel}>Entries</span>\n <span className={styles.statValue}>\n {snapshot.stats.totalEntries}\n </span>\n </div>\n\n <div className={styles.stat}>\n <span className={styles.statLabel}>Total Size</span>\n <span className={styles.statValue}>\n {formatBytes(snapshot.stats.totalSize)}\n </span>\n </div>\n\n <div className={styles.stat}>\n <span className={styles.statLabel}>Total Hits</span>\n <span className={styles.statValue}>{snapshot.stats.totalHits}</span>\n </div>\n </div>\n </div>\n\n <div className={styles.toolbarActions}>\n <div className={styles.search}>\n <InputGroup\n leftIcon=\"search\"\n placeholder=\"Search cache entries...\"\n value={searchQuery}\n onChange={(e) => setSearchQuery(e.target.value)}\n fill={true}\n />\n </div>\n\n <ButtonGroup>\n <Button\n icon=\"refresh\"\n onClick={() => snapshotStore.forceRefresh()}\n size=\"small\"\n >\n Refresh\n </Button>\n <Button\n icon=\"trash\"\n intent=\"danger\"\n onClick={() => void handleClearAll()}\n size=\"small\"\n >\n Clear All\n </Button>\n </ButtonGroup>\n </div>\n\n {invalidateError && (\n <div className={styles.errorBanner}>\n <Icon icon=\"error\" intent=\"danger\" />\n <span>{invalidateError.message}</span>\n <Button\n icon=\"cross\"\n variant=\"minimal\"\n size=\"small\"\n onClick={() => {\n setInvalidateError(null);\n }}\n />\n </div>\n )}\n\n <div className={styles.content}>\n {polledSnapshot === undefined && (\n <div className={styles.skeletonList}>\n {Array.from({ length: 5 }).map((_, i) => (\n <div key={i} className={styles.skeletonEntry}>\n <div className={styles.skeletonTag} />\n <div className={styles.skeletonText} />\n <div className={styles.skeletonBadge} />\n </div>\n ))}\n </div>\n )}\n\n {filteredEntries.length === 0 && polledSnapshot !== undefined && (\n <div className={styles.emptyState}>\n <Icon icon=\"database\" size={28} />\n <div className={styles.emptyTitle}>\n {snapshot.entries.length === 0\n ? \"No Cache Entries\"\n : \"No Matching Entries\"}\n </div>\n <div className={styles.emptyDescription}>\n {snapshot.entries.length === 0\n ? \"The cache is empty. Query some data to see cache entries.\"\n : \"Try a different search term.\"}\n </div>\n </div>\n )}\n\n {filteredEntries.map((entry, index) => {\n const isExpanded = expandedKeys.has(entry.key);\n return (\n <Card\n key={entry.key}\n className={styles.entryCard}\n style={{ \"--entrance-index\": index } as React.CSSProperties}\n >\n <div\n className={styles.entryHeader}\n onClick={() => toggleExpanded(entry.key)}\n >\n <div className={styles.entryHeaderLeft}>\n <Icon\n icon={isExpanded ? \"chevron-down\" : \"chevron-right\"}\n size={14}\n className={styles.expandIcon}\n />\n <Tag\n minimal={true}\n intent={getTypeColor(entry.type)}\n className={styles.typeTag}\n >\n {entry.type}\n </Tag>\n <span className={styles.objectType}>{entry.objectType}</span>\n {entry.metadata.isOptimistic && (\n <Tooltip content=\"Has optimistic updates\">\n <Tag minimal={true} intent=\"warning\" icon=\"time\">\n Optimistic\n </Tag>\n </Tooltip>\n )}\n </div>\n\n <div className={styles.entryHeaderRight}>\n <Tooltip content={`Status: ${entry.metadata.status}`}>\n <Tag\n minimal={true}\n intent={getStatusColor(entry.metadata.status)}\n icon={getStatusIcon(entry.metadata.status)}\n >\n {entry.metadata.status}\n </Tag>\n </Tooltip>\n <Tooltip\n content={`Last updated: ${new Date(\n entry.metadata.timestamp\n ).toLocaleString()}`}\n >\n <span className={styles.age}>\n {formatRelativeTime(entry.metadata.timestamp)}\n </span>\n </Tooltip>\n <Tooltip content={`Cache entry size`}>\n <span className={styles.size}>\n {formatBytes(entry.metadata.size)}\n </span>\n </Tooltip>\n <Button\n icon=\"refresh\"\n variant=\"minimal\"\n size=\"small\"\n onClick={(e) => {\n e.stopPropagation();\n void handleInvalidate(entry);\n }}\n />\n </div>\n </div>\n\n <Collapse isOpen={isExpanded}>\n <div className={styles.entryBody}>\n <div className={styles.section}>\n <h4>Cache Key</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {entry.key}\n </CopyableCodeBlock>\n </div>\n\n {entry.type === \"list\" &&\n (entry.where != null || entry.orderBy != null) && (\n <div className={styles.section}>\n <h4>Query Parameters</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {JSON.stringify(\n {\n where: entry.where,\n orderBy: entry.orderBy,\n pageSize: entry.pageSize,\n },\n null,\n 2\n )}\n </CopyableCodeBlock>\n </div>\n )}\n\n {entry.type === \"link\" && entry.linkName != null && (\n <div className={styles.section}>\n <h4>Link</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {entry.linkName}\n </CopyableCodeBlock>\n </div>\n )}\n\n {entry.data !== undefined && (\n <div className={styles.section}>\n <h4>Cached Data</h4>\n <CopyableCodeBlock className={styles.codeBlock}>\n {JSON.stringify(entry.data, null, 2)}\n </CopyableCodeBlock>\n </div>\n )}\n </div>\n </Collapse>\n </Card>\n );\n })}\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -40,7 +40,7 @@ export const CacheMetrics = ({
|
|
|
40
40
|
className: styles.metricLabel
|
|
41
41
|
}, "Cache Savings"), /*#__PURE__*/React.createElement("span", {
|
|
42
42
|
className: classNames(styles.metricValue, styles.success)
|
|
43
|
-
}, formatNumber(metrics.aggregates.cacheHits + metrics.aggregates.revalidations + metrics.aggregates.deduplications), " requests saved"), /*#__PURE__*/React.createElement("span", {
|
|
43
|
+
}, formatNumber(metrics.aggregates.cacheHits + metrics.aggregates.revalidations + metrics.aggregates.deduplications), " ", "requests saved"), /*#__PURE__*/React.createElement("span", {
|
|
44
44
|
className: styles.metricSubtext
|
|
45
45
|
}, formatNumber(metrics.aggregates.deduplications), " deduped")), /*#__PURE__*/React.createElement("div", {
|
|
46
46
|
className: styles.metric
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CacheMetrics.js","names":["classNames","React","formatNumber","formatTime","styles","CACHE_HIT_EXCELLENT","CACHE_HIT_GOOD","CacheMetrics","metrics","totalObjects","aggregates","totalObjectsFromCache","totalObjectsFromNetwork","objectBasedRate","rateClass","success","warning","danger","createElement","Fragment","className","metric","metricLabel","metricValue","toFixed","metricSubtext","cacheHits","revalidations","deduplications","rates","averageResponseTime","averageCachedResponseTime"],"sources":["CacheMetrics.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classNames from \"classnames\";\nimport React from \"react\";\nimport type { MetricsSnapshot } from \"../types/index.js\";\nimport { formatNumber, formatTime } from \"../utils/format.js\";\nimport styles from \"./MonitoringPanel.module.scss\";\n\nconst CACHE_HIT_EXCELLENT = 0.8;\nconst CACHE_HIT_GOOD = 0.5;\n\nexport interface CacheMetricsProps {\n metrics: MetricsSnapshot;\n}\n\nexport const CacheMetrics: React.FC<CacheMetricsProps> = ({ metrics }) => {\n const totalObjects
|
|
1
|
+
{"version":3,"file":"CacheMetrics.js","names":["classNames","React","formatNumber","formatTime","styles","CACHE_HIT_EXCELLENT","CACHE_HIT_GOOD","CacheMetrics","metrics","totalObjects","aggregates","totalObjectsFromCache","totalObjectsFromNetwork","objectBasedRate","rateClass","success","warning","danger","createElement","Fragment","className","metric","metricLabel","metricValue","toFixed","metricSubtext","cacheHits","revalidations","deduplications","rates","averageResponseTime","averageCachedResponseTime"],"sources":["CacheMetrics.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport classNames from \"classnames\";\nimport React from \"react\";\n\nimport type { MetricsSnapshot } from \"../types/index.js\";\nimport { formatNumber, formatTime } from \"../utils/format.js\";\n\nimport styles from \"./MonitoringPanel.module.scss\";\n\nconst CACHE_HIT_EXCELLENT = 0.8;\nconst CACHE_HIT_GOOD = 0.5;\n\nexport interface CacheMetricsProps {\n metrics: MetricsSnapshot;\n}\n\nexport const CacheMetrics: React.FC<CacheMetricsProps> = ({ metrics }) => {\n const totalObjects =\n metrics.aggregates.totalObjectsFromCache +\n metrics.aggregates.totalObjectsFromNetwork;\n const objectBasedRate =\n totalObjects > 0\n ? metrics.aggregates.totalObjectsFromCache / totalObjects\n : 0;\n const rateClass =\n objectBasedRate >= CACHE_HIT_EXCELLENT\n ? styles.success\n : objectBasedRate >= CACHE_HIT_GOOD\n ? styles.warning\n : styles.danger;\n\n return (\n <>\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Cache Hit Rate</span>\n <span className={classNames(styles.metricValue, rateClass)}>\n {(objectBasedRate * 100).toFixed(0)}%\n </span>\n <span className={styles.metricSubtext}>\n {formatNumber(metrics.aggregates.totalObjectsFromCache)} /{\" \"}\n {formatNumber(totalObjects)} objects\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Cache Savings</span>\n <span className={classNames(styles.metricValue, styles.success)}>\n {formatNumber(\n metrics.aggregates.cacheHits +\n metrics.aggregates.revalidations +\n metrics.aggregates.deduplications\n )}{\" \"}\n requests saved\n </span>\n <span className={styles.metricSubtext}>\n {formatNumber(metrics.aggregates.deduplications)} deduped\n </span>\n </div>\n\n <div className={styles.metric}>\n <span className={styles.metricLabel}>Avg Response</span>\n <span className={styles.metricValue}>\n {formatTime(metrics.rates.averageResponseTime)}\n </span>\n <span className={styles.metricSubtext}>\n Cache: {formatTime(metrics.rates.averageCachedResponseTime)}\n </span>\n </div>\n </>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -17,9 +17,9 @@
|
|
|
17
17
|
import { Icon, Tag, Tooltip } from "@blueprintjs/core";
|
|
18
18
|
import classNames from "classnames";
|
|
19
19
|
import React, { useState } from "react";
|
|
20
|
-
import styles from "./ComponentCard.module.scss.js";
|
|
21
20
|
import { HookRow } from "./HookRow.js";
|
|
22
21
|
import { resolveComponentName } from "./resolveComponentName.js";
|
|
22
|
+
import styles from "./ComponentCard.module.scss.js";
|
|
23
23
|
export const ComponentCard = ({
|
|
24
24
|
componentId,
|
|
25
25
|
bindings,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentCard.js","names":["Icon","Tag","Tooltip","classNames","React","useState","styles","HookRow","resolveComponentName","ComponentCard","componentId","bindings","formatTime","ms","toFixed","monitorStore","style","issues","expanded","setExpanded","length","componentName","totalRenders","reduce","sum","b","renderCount","avgRenderDuration","hasWarnings","errorCount","filter","i","severity","warningCount","healthStatus","createElement","className","componentCard","header","onClick","headerLeft","icon","size","expandIcon","healthDot","headerRight","content","minimal","intent","warningTag","hookCountTag","issueCountTag","healthyLabel","avgDuration","body","hooks","map","binding","index","key","querySignature","inlineIssues","issue","id","inlineIssue","inlineIssueText","title","suggestion","inlineIssueSuggestion"],"sources":["ComponentCard.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Icon, Tag, Tooltip } from \"@blueprintjs/core\";\nimport classNames from \"classnames\";\nimport React, { useState } from \"react\";\nimport type { MonitorStore } from \"../store/MonitorStore.js\";\nimport type { ComponentHookBinding } from \"../utils/ComponentQueryRegistry.js\";\nimport styles from \"./ComponentCard.module.scss\";\nimport { HookRow } from \"./HookRow.js\";\nimport type { Issue } from \"./issueTypes.js\";\nimport { resolveComponentName } from \"./resolveComponentName.js\";\n\nexport interface ComponentCardProps {\n componentId: string;\n bindings: ComponentHookBinding[];\n formatTime?: (ms: number) => string;\n monitorStore?: MonitorStore;\n style?: React.CSSProperties;\n issues?: Issue[];\n}\n\nexport const ComponentCard: React.FC<ComponentCardProps> = ({\n componentId,\n bindings,\n formatTime = (ms) => `${ms.toFixed(1)}ms`,\n monitorStore,\n style,\n issues = [],\n}) => {\n const [expanded, setExpanded] = useState(false);\n\n if (bindings.length === 0) {\n return null;\n }\n\n const componentName = resolveComponentName(bindings);\n\n const totalRenders = bindings.reduce((sum, b) => sum + b.renderCount, 0);\n const avgRenderDuration = bindings.reduce(\n (sum, b) => sum + b.avgRenderDuration,\n 0,\n ) / bindings.length;\n\n const hasWarnings = bindings.length > 10;\n\n const errorCount = issues.filter(i => i.severity === \"error\").length;\n const warningCount = issues.filter(i => i.severity === \"warning\").length;\n const healthStatus: \"healthy\" | \"warning\" | \"error\" = errorCount > 0\n ? \"error\"\n : warningCount > 0\n ? \"warning\"\n : \"healthy\";\n\n return (\n <div className={styles.componentCard} style={style}>\n <div\n className={styles.header}\n onClick={() => setExpanded(!expanded)}\n >\n <div className={styles.headerLeft}>\n <Icon\n icon={expanded ? \"chevron-down\" : \"chevron-right\"}\n size={14}\n className={styles.expandIcon}\n />\n <span\n className={classNames(\n styles.healthDot,\n styles[`health_${healthStatus}`],\n )}\n />\n <span className={styles.componentName}>{componentName}</span>\n </div>\n\n <div className={styles.headerRight}>\n {hasWarnings && (\n <Tooltip content=\"This component has many hooks\">\n <Tag minimal intent=\"warning\" className={styles.warningTag}>\n <Icon icon=\"warning-sign\" size={10} />\n </Tag>\n </Tooltip>\n )}\n <Tooltip content={`${bindings.length} OSDK hooks`}>\n <Tag minimal intent=\"primary\" className={styles.hookCountTag}>\n {bindings.length}\n </Tag>\n </Tooltip>\n {issues.length > 0 && (\n <Tooltip\n content={`${issues.length} issue${\n issues.length !== 1 ? \"s\" : \"\"\n }`}\n >\n <Tag\n minimal\n intent={errorCount > 0 ? \"danger\" : \"warning\"}\n className={styles.issueCountTag}\n >\n <Icon icon=\"warning-sign\" size={10} /> {issues.length}\n </Tag>\n </Tooltip>\n )}\n {issues.length === 0 && (\n <span className={styles.healthyLabel}>healthy</span>\n )}\n {totalRenders > 0 && (\n <Tooltip content={`${totalRenders} total renders`}>\n <div className={styles.renderCount}>\n <Icon icon=\"refresh\" size={10} />\n <span>{totalRenders}</span>\n </div>\n </Tooltip>\n )}\n {avgRenderDuration > 0 && (\n <Tooltip content={`Average render time`}>\n <div className={styles.avgDuration}>\n <Icon icon=\"time\" size={10} />\n <span>{formatTime(avgRenderDuration)}</span>\n </div>\n </Tooltip>\n )}\n </div>\n </div>\n\n {expanded && (\n <div className={styles.body}>\n <div className={styles.hooks}>\n {bindings.map((binding, index) => (\n <HookRow\n key={`${binding.querySignature}-${index}`}\n binding={binding}\n formatTime={formatTime}\n monitorStore={monitorStore}\n />\n ))}\n </div>\n {issues.length > 0 && (\n <div className={styles.inlineIssues}>\n {issues.map(issue => (\n <div\n key={issue.id}\n className={classNames(\n styles.inlineIssue,\n styles[`inlineIssue_${issue.severity}`],\n )}\n >\n <Icon\n icon={issue.severity === \"error\"\n ? \"error\"\n : issue.severity === \"warning\"\n ? \"warning-sign\"\n : \"info-sign\"}\n size={12}\n intent={issue.severity === \"error\"\n ? \"danger\"\n : issue.severity === \"warning\"\n ? \"warning\"\n : \"primary\"}\n />\n <span className={styles.inlineIssueText}>\n {issue.title}\n {issue.suggestion && (\n <span className={styles.inlineIssueSuggestion}>\n {\" \\u2192 \"}\n {issue.suggestion}\n </span>\n )}\n </span>\n </div>\n ))}\n </div>\n )}\n </div>\n )}\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComponentCard.js","names":["Icon","Tag","Tooltip","classNames","React","useState","HookRow","resolveComponentName","styles","ComponentCard","componentId","bindings","formatTime","ms","toFixed","monitorStore","style","issues","expanded","setExpanded","length","componentName","totalRenders","reduce","sum","b","renderCount","avgRenderDuration","hasWarnings","errorCount","filter","i","severity","warningCount","healthStatus","createElement","className","componentCard","header","onClick","headerLeft","icon","size","expandIcon","healthDot","headerRight","content","minimal","intent","warningTag","hookCountTag","issueCountTag","healthyLabel","avgDuration","body","hooks","map","binding","index","key","querySignature","inlineIssues","issue","id","inlineIssue","inlineIssueText","title","suggestion","inlineIssueSuggestion"],"sources":["ComponentCard.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Icon, Tag, Tooltip } from \"@blueprintjs/core\";\nimport classNames from \"classnames\";\nimport React, { useState } from \"react\";\n\nimport type { MonitorStore } from \"../store/MonitorStore.js\";\nimport type { ComponentHookBinding } from \"../utils/ComponentQueryRegistry.js\";\nimport { HookRow } from \"./HookRow.js\";\nimport type { Issue } from \"./issueTypes.js\";\nimport { resolveComponentName } from \"./resolveComponentName.js\";\n\nimport styles from \"./ComponentCard.module.scss\";\n\nexport interface ComponentCardProps {\n componentId: string;\n bindings: ComponentHookBinding[];\n formatTime?: (ms: number) => string;\n monitorStore?: MonitorStore;\n style?: React.CSSProperties;\n issues?: Issue[];\n}\n\nexport const ComponentCard: React.FC<ComponentCardProps> = ({\n componentId,\n bindings,\n formatTime = (ms) => `${ms.toFixed(1)}ms`,\n monitorStore,\n style,\n issues = [],\n}) => {\n const [expanded, setExpanded] = useState(false);\n\n if (bindings.length === 0) {\n return null;\n }\n\n const componentName = resolveComponentName(bindings);\n\n const totalRenders = bindings.reduce((sum, b) => sum + b.renderCount, 0);\n const avgRenderDuration =\n bindings.reduce((sum, b) => sum + b.avgRenderDuration, 0) / bindings.length;\n\n const hasWarnings = bindings.length > 10;\n\n const errorCount = issues.filter((i) => i.severity === \"error\").length;\n const warningCount = issues.filter((i) => i.severity === \"warning\").length;\n const healthStatus: \"healthy\" | \"warning\" | \"error\" =\n errorCount > 0 ? \"error\" : warningCount > 0 ? \"warning\" : \"healthy\";\n\n return (\n <div className={styles.componentCard} style={style}>\n <div className={styles.header} onClick={() => setExpanded(!expanded)}>\n <div className={styles.headerLeft}>\n <Icon\n icon={expanded ? \"chevron-down\" : \"chevron-right\"}\n size={14}\n className={styles.expandIcon}\n />\n <span\n className={classNames(\n styles.healthDot,\n styles[`health_${healthStatus}`]\n )}\n />\n <span className={styles.componentName}>{componentName}</span>\n </div>\n\n <div className={styles.headerRight}>\n {hasWarnings && (\n <Tooltip content=\"This component has many hooks\">\n <Tag minimal intent=\"warning\" className={styles.warningTag}>\n <Icon icon=\"warning-sign\" size={10} />\n </Tag>\n </Tooltip>\n )}\n <Tooltip content={`${bindings.length} OSDK hooks`}>\n <Tag minimal intent=\"primary\" className={styles.hookCountTag}>\n {bindings.length}\n </Tag>\n </Tooltip>\n {issues.length > 0 && (\n <Tooltip\n content={`${issues.length} issue${\n issues.length !== 1 ? \"s\" : \"\"\n }`}\n >\n <Tag\n minimal\n intent={errorCount > 0 ? \"danger\" : \"warning\"}\n className={styles.issueCountTag}\n >\n <Icon icon=\"warning-sign\" size={10} /> {issues.length}\n </Tag>\n </Tooltip>\n )}\n {issues.length === 0 && (\n <span className={styles.healthyLabel}>healthy</span>\n )}\n {totalRenders > 0 && (\n <Tooltip content={`${totalRenders} total renders`}>\n <div className={styles.renderCount}>\n <Icon icon=\"refresh\" size={10} />\n <span>{totalRenders}</span>\n </div>\n </Tooltip>\n )}\n {avgRenderDuration > 0 && (\n <Tooltip content={`Average render time`}>\n <div className={styles.avgDuration}>\n <Icon icon=\"time\" size={10} />\n <span>{formatTime(avgRenderDuration)}</span>\n </div>\n </Tooltip>\n )}\n </div>\n </div>\n\n {expanded && (\n <div className={styles.body}>\n <div className={styles.hooks}>\n {bindings.map((binding, index) => (\n <HookRow\n key={`${binding.querySignature}-${index}`}\n binding={binding}\n formatTime={formatTime}\n monitorStore={monitorStore}\n />\n ))}\n </div>\n {issues.length > 0 && (\n <div className={styles.inlineIssues}>\n {issues.map((issue) => (\n <div\n key={issue.id}\n className={classNames(\n styles.inlineIssue,\n styles[`inlineIssue_${issue.severity}`]\n )}\n >\n <Icon\n icon={\n issue.severity === \"error\"\n ? \"error\"\n : issue.severity === \"warning\"\n ? \"warning-sign\"\n : \"info-sign\"\n }\n size={12}\n intent={\n issue.severity === \"error\"\n ? \"danger\"\n : issue.severity === \"warning\"\n ? \"warning\"\n : \"primary\"\n }\n />\n <span className={styles.inlineIssueText}>\n {issue.title}\n {issue.suggestion && (\n <span className={styles.inlineIssueSuggestion}>\n {\" \\u2192 \"}\n {issue.suggestion}\n </span>\n )}\n </span>\n </div>\n ))}\n </div>\n )}\n </div>\n )}\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -106,20 +106,20 @@ export const ComputeTab = ({
|
|
|
106
106
|
}, isRecording ? "No compute requests yet" : "Start recording to track compute usage")));
|
|
107
107
|
};
|
|
108
108
|
const REQUEST_DISPLAY = {
|
|
109
|
-
|
|
109
|
+
fulfilled: {
|
|
110
110
|
icon: "\u2713",
|
|
111
111
|
class: styles.computeFulfilled
|
|
112
112
|
},
|
|
113
113
|
"fulfilled-without-usage": {
|
|
114
|
-
icon: "\
|
|
114
|
+
icon: "\u00B7",
|
|
115
115
|
class: styles.computeFulfilledWithoutUsage
|
|
116
116
|
},
|
|
117
|
-
|
|
118
|
-
icon: "\
|
|
117
|
+
failed: {
|
|
118
|
+
icon: "\u00D7",
|
|
119
119
|
class: styles.computeFailed
|
|
120
120
|
},
|
|
121
|
-
|
|
122
|
-
icon: "\
|
|
121
|
+
pending: {
|
|
122
|
+
icon: "\u22EF",
|
|
123
123
|
class: styles.computePending
|
|
124
124
|
}
|
|
125
125
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComputeTab.js","names":["Button","classNames","React","useMemo","useComputeMetrics","useComputeNetworkPaused","useComputeRecording","useComputeRequests","formatBytes","formatNumber","BubbleChart","styles","ComputeTab","computeStore","metrics","requests","isRecording","isNetworkPaused","selectedIds","setSelectedIds","useState","selectedIdSet","Set","recentRequests","slice","reverse","createElement","Fragment","className","computeControls","onClick","setIsRecording","icon","intent","size","toggleNetworkPaused","title","computeMetricsGrid","metricCell","metricLabel","metricValue","totalUsage","metricSubtext","fulfilledCount","lastMinuteUsage","averageUsagePerRequest","averageResponseBytes","requestCount","fulfilledWithoutUsageCount","length","bubbleChartContainer","fillHeight","onSelectRequest","id","operationsList","map","req","ComputeRequestItem","key","request","isSelected","has","emptyState","REQUEST_DISPLAY","class","computeFulfilled","computeFulfilledWithoutUsage","computeFailed","computePending","DEFAULT_REQUEST_DISPLAY","getUsageClass","usage","danger","warning","success","requestIcon","requestClass","type","operationItem","selectedItem","operationType","operationDetails","operationSignature","requestUrl","operationTime","Date","requestTimestamp","toLocaleTimeString","operationMetrics","operationMetric","computeUsage","responsePayloadBytes","error"],"sources":["ComputeTab.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@blueprintjs/core\";\nimport classNames from \"classnames\";\nimport React, { useMemo } from \"react\";\nimport {\n useComputeMetrics,\n useComputeNetworkPaused,\n useComputeRecording,\n useComputeRequests,\n} from \"../hooks/useComputeSelectors.js\";\nimport type { ComputeStore } from \"../store/ComputeStore.js\";\nimport type { ComputeRequest } from \"../types/compute.js\";\nimport { formatBytes, formatNumber } from \"../utils/format.js\";\nimport { BubbleChart } from \"./BubbleChart.js\";\nimport styles from \"./MonitoringPanel.module.scss\";\n\nexport interface ComputeTabProps {\n computeStore: ComputeStore;\n}\n\nexport const ComputeTab: React.FC<ComputeTabProps> = ({ computeStore }) => {\n const metrics = useComputeMetrics(computeStore);\n const requests = useComputeRequests(computeStore);\n const isRecording = useComputeRecording(computeStore);\n const isNetworkPaused = useComputeNetworkPaused(computeStore);\n const [selectedIds, setSelectedIds] = React.useState<string[]>([]);\n\n const selectedIdSet = useMemo(() => new Set(selectedIds), [selectedIds]);\n\n const renderMetrics = () => (\n <div className={styles.computeMetricsGrid}>\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Total Usage</span>\n <span className={styles.metricValue}>\n {formatNumber(metrics.totalUsage)}\n </span>\n <span className={styles.metricSubtext}>\n {metrics.fulfilledCount} requests\n </span>\n </div>\n\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Last Minute</span>\n <span className={styles.metricValue}>\n {formatNumber(metrics.lastMinuteUsage)}\n </span>\n <span className={styles.metricSubtext}>compute units</span>\n </div>\n\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Avg per Request</span>\n <span className={styles.metricValue}>\n {formatNumber(metrics.averageUsagePerRequest)}\n </span>\n <span className={styles.metricSubtext}>compute units</span>\n </div>\n\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Avg Response Size</span>\n <span className={styles.metricValue}>\n {formatBytes(metrics.averageResponseBytes)}\n </span>\n <span className={styles.metricSubtext}>\n {metrics.requestCount} total\n {metrics.fulfilledWithoutUsageCount > 0 && (\n <>\n {\", \"}\n {metrics.fulfilledWithoutUsageCount} without usage data\n </>\n )}\n </span>\n </div>\n </div>\n );\n\n const recentRequests = useMemo(\n () => requests.slice(-50).reverse(),\n [requests],\n );\n\n return (\n <>\n <div className={styles.computeControls}>\n {isRecording\n ? (\n <Button\n onClick={() => computeStore.setIsRecording(false)}\n icon=\"stop\"\n intent=\"danger\"\n size=\"small\"\n >\n Stop Recording\n </Button>\n )\n : (\n <Button\n onClick={() => computeStore.setIsRecording(true)}\n icon=\"record\"\n intent=\"primary\"\n size=\"small\"\n >\n Start Recording\n </Button>\n )}\n <Button\n onClick={() => computeStore.toggleNetworkPaused()}\n icon={isNetworkPaused ? \"play\" : \"pause\"}\n size=\"small\"\n title=\"Block all OSDK network requests\"\n >\n {isNetworkPaused ? \"Resume\" : \"Pause\"} Network\n </Button>\n </div>\n\n {renderMetrics()}\n\n {requests.length > 0 && (\n <div className={styles.bubbleChartContainer}>\n <BubbleChart\n computeStore={computeStore}\n fillHeight={false}\n selectedIds={selectedIds}\n onSelectRequest={(id) => {\n if (id) {\n setSelectedIds([id]);\n } else {\n setSelectedIds([]);\n }\n }}\n />\n </div>\n )}\n\n <div className={styles.operationsList}>\n {recentRequests.length > 0\n ? recentRequests.map((req) => (\n <ComputeRequestItem\n key={req.id}\n request={req}\n isSelected={selectedIdSet.has(req.id)}\n />\n ))\n : (\n <div className={styles.emptyState}>\n {isRecording\n ? \"No compute requests yet\"\n : \"Start recording to track compute usage\"}\n </div>\n )}\n </div>\n </>\n );\n};\n\nconst REQUEST_DISPLAY: Record<string, { icon: string; class: string }> = {\n \"fulfilled\": { icon: \"\\u2713\", class: styles.computeFulfilled },\n \"fulfilled-without-usage\": {\n icon: \"\\u00b7\",\n class: styles.computeFulfilledWithoutUsage,\n },\n \"failed\": { icon: \"\\u00d7\", class: styles.computeFailed },\n \"pending\": { icon: \"\\u22ef\", class: styles.computePending },\n};\n\nconst DEFAULT_REQUEST_DISPLAY = { icon: \"\\u2022\", class: \"\" };\n\ninterface ComputeRequestItemProps {\n request: ComputeRequest;\n isSelected: boolean;\n}\n\nfunction getUsageClass(usage: number): string {\n if (usage > 1000) {\n return styles.danger;\n }\n if (usage > 100) {\n return styles.warning;\n }\n return styles.success;\n}\n\nconst ComputeRequestItem: React.FC<ComputeRequestItemProps> = ({\n request,\n isSelected,\n}) => {\n const { icon: requestIcon, class: requestClass } =\n REQUEST_DISPLAY[request.type] ?? DEFAULT_REQUEST_DISPLAY;\n\n return (\n <div\n className={classNames(styles.operationItem, {\n [styles.selectedItem]: isSelected,\n })}\n >\n <span className={classNames(styles.operationType, requestClass)}>\n {requestIcon}\n </span>\n <div className={styles.operationDetails}>\n <div className={styles.operationSignature}>\n {request.requestUrl}\n </div>\n <div className={styles.operationTime}>\n {new Date(request.requestTimestamp).toLocaleTimeString()}\n </div>\n <div className={styles.operationMetrics}>\n {request.type === \"fulfilled\" && (\n <>\n <span\n className={classNames(\n styles.operationMetric,\n getUsageClass(request.computeUsage),\n )}\n >\n {formatNumber(request.computeUsage)} CU\n </span>\n <span className={styles.operationMetric}>\n {formatBytes(request.responsePayloadBytes)}\n </span>\n </>\n )}\n {request.type === \"fulfilled-without-usage\" && (\n <>\n <span className={styles.operationMetric}>\n no usage data\n </span>\n <span className={styles.operationMetric}>\n {formatBytes(request.responsePayloadBytes)}\n </span>\n </>\n )}\n {request.type === \"failed\" && (\n <span className={classNames(styles.operationMetric, styles.danger)}>\n {request.error.type}\n </span>\n )}\n {request.type === \"pending\" && (\n <span className={styles.operationMetric}>\n Loading...\n </span>\n )}\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ComputeTab.js","names":["Button","classNames","React","useMemo","useComputeMetrics","useComputeNetworkPaused","useComputeRecording","useComputeRequests","formatBytes","formatNumber","BubbleChart","styles","ComputeTab","computeStore","metrics","requests","isRecording","isNetworkPaused","selectedIds","setSelectedIds","useState","selectedIdSet","Set","recentRequests","slice","reverse","createElement","Fragment","className","computeControls","onClick","setIsRecording","icon","intent","size","toggleNetworkPaused","title","computeMetricsGrid","metricCell","metricLabel","metricValue","totalUsage","metricSubtext","fulfilledCount","lastMinuteUsage","averageUsagePerRequest","averageResponseBytes","requestCount","fulfilledWithoutUsageCount","length","bubbleChartContainer","fillHeight","onSelectRequest","id","operationsList","map","req","ComputeRequestItem","key","request","isSelected","has","emptyState","REQUEST_DISPLAY","fulfilled","class","computeFulfilled","computeFulfilledWithoutUsage","failed","computeFailed","pending","computePending","DEFAULT_REQUEST_DISPLAY","getUsageClass","usage","danger","warning","success","requestIcon","requestClass","type","operationItem","selectedItem","operationType","operationDetails","operationSignature","requestUrl","operationTime","Date","requestTimestamp","toLocaleTimeString","operationMetrics","operationMetric","computeUsage","responsePayloadBytes","error"],"sources":["ComputeTab.tsx"],"sourcesContent":["/*\n * Copyright 2025 Palantir Technologies, Inc. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Button } from \"@blueprintjs/core\";\nimport classNames from \"classnames\";\nimport React, { useMemo } from \"react\";\n\nimport {\n useComputeMetrics,\n useComputeNetworkPaused,\n useComputeRecording,\n useComputeRequests,\n} from \"../hooks/useComputeSelectors.js\";\nimport type { ComputeStore } from \"../store/ComputeStore.js\";\nimport type { ComputeRequest } from \"../types/compute.js\";\nimport { formatBytes, formatNumber } from \"../utils/format.js\";\nimport { BubbleChart } from \"./BubbleChart.js\";\n\nimport styles from \"./MonitoringPanel.module.scss\";\n\nexport interface ComputeTabProps {\n computeStore: ComputeStore;\n}\n\nexport const ComputeTab: React.FC<ComputeTabProps> = ({ computeStore }) => {\n const metrics = useComputeMetrics(computeStore);\n const requests = useComputeRequests(computeStore);\n const isRecording = useComputeRecording(computeStore);\n const isNetworkPaused = useComputeNetworkPaused(computeStore);\n const [selectedIds, setSelectedIds] = React.useState<string[]>([]);\n\n const selectedIdSet = useMemo(() => new Set(selectedIds), [selectedIds]);\n\n const renderMetrics = () => (\n <div className={styles.computeMetricsGrid}>\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Total Usage</span>\n <span className={styles.metricValue}>\n {formatNumber(metrics.totalUsage)}\n </span>\n <span className={styles.metricSubtext}>\n {metrics.fulfilledCount} requests\n </span>\n </div>\n\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Last Minute</span>\n <span className={styles.metricValue}>\n {formatNumber(metrics.lastMinuteUsage)}\n </span>\n <span className={styles.metricSubtext}>compute units</span>\n </div>\n\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Avg per Request</span>\n <span className={styles.metricValue}>\n {formatNumber(metrics.averageUsagePerRequest)}\n </span>\n <span className={styles.metricSubtext}>compute units</span>\n </div>\n\n <div className={styles.metricCell}>\n <span className={styles.metricLabel}>Avg Response Size</span>\n <span className={styles.metricValue}>\n {formatBytes(metrics.averageResponseBytes)}\n </span>\n <span className={styles.metricSubtext}>\n {metrics.requestCount} total\n {metrics.fulfilledWithoutUsageCount > 0 && (\n <>\n {\", \"}\n {metrics.fulfilledWithoutUsageCount} without usage data\n </>\n )}\n </span>\n </div>\n </div>\n );\n\n const recentRequests = useMemo(\n () => requests.slice(-50).reverse(),\n [requests]\n );\n\n return (\n <>\n <div className={styles.computeControls}>\n {isRecording ? (\n <Button\n onClick={() => computeStore.setIsRecording(false)}\n icon=\"stop\"\n intent=\"danger\"\n size=\"small\"\n >\n Stop Recording\n </Button>\n ) : (\n <Button\n onClick={() => computeStore.setIsRecording(true)}\n icon=\"record\"\n intent=\"primary\"\n size=\"small\"\n >\n Start Recording\n </Button>\n )}\n <Button\n onClick={() => computeStore.toggleNetworkPaused()}\n icon={isNetworkPaused ? \"play\" : \"pause\"}\n size=\"small\"\n title=\"Block all OSDK network requests\"\n >\n {isNetworkPaused ? \"Resume\" : \"Pause\"} Network\n </Button>\n </div>\n\n {renderMetrics()}\n\n {requests.length > 0 && (\n <div className={styles.bubbleChartContainer}>\n <BubbleChart\n computeStore={computeStore}\n fillHeight={false}\n selectedIds={selectedIds}\n onSelectRequest={(id) => {\n if (id) {\n setSelectedIds([id]);\n } else {\n setSelectedIds([]);\n }\n }}\n />\n </div>\n )}\n\n <div className={styles.operationsList}>\n {recentRequests.length > 0 ? (\n recentRequests.map((req) => (\n <ComputeRequestItem\n key={req.id}\n request={req}\n isSelected={selectedIdSet.has(req.id)}\n />\n ))\n ) : (\n <div className={styles.emptyState}>\n {isRecording\n ? \"No compute requests yet\"\n : \"Start recording to track compute usage\"}\n </div>\n )}\n </div>\n </>\n );\n};\n\nconst REQUEST_DISPLAY: Record<string, { icon: string; class: string }> = {\n fulfilled: { icon: \"\\u2713\", class: styles.computeFulfilled },\n \"fulfilled-without-usage\": {\n icon: \"\\u00B7\",\n class: styles.computeFulfilledWithoutUsage,\n },\n failed: { icon: \"\\u00D7\", class: styles.computeFailed },\n pending: { icon: \"\\u22EF\", class: styles.computePending },\n};\n\nconst DEFAULT_REQUEST_DISPLAY = { icon: \"\\u2022\", class: \"\" };\n\ninterface ComputeRequestItemProps {\n request: ComputeRequest;\n isSelected: boolean;\n}\n\nfunction getUsageClass(usage: number): string {\n if (usage > 1000) {\n return styles.danger;\n }\n if (usage > 100) {\n return styles.warning;\n }\n return styles.success;\n}\n\nconst ComputeRequestItem: React.FC<ComputeRequestItemProps> = ({\n request,\n isSelected,\n}) => {\n const { icon: requestIcon, class: requestClass } =\n REQUEST_DISPLAY[request.type] ?? DEFAULT_REQUEST_DISPLAY;\n\n return (\n <div\n className={classNames(styles.operationItem, {\n [styles.selectedItem]: isSelected,\n })}\n >\n <span className={classNames(styles.operationType, requestClass)}>\n {requestIcon}\n </span>\n <div className={styles.operationDetails}>\n <div className={styles.operationSignature}>{request.requestUrl}</div>\n <div className={styles.operationTime}>\n {new Date(request.requestTimestamp).toLocaleTimeString()}\n </div>\n <div className={styles.operationMetrics}>\n {request.type === \"fulfilled\" && (\n <>\n <span\n className={classNames(\n styles.operationMetric,\n getUsageClass(request.computeUsage)\n )}\n >\n {formatNumber(request.computeUsage)} CU\n </span>\n <span className={styles.operationMetric}>\n {formatBytes(request.responsePayloadBytes)}\n </span>\n </>\n )}\n {request.type === \"fulfilled-without-usage\" && (\n <>\n <span className={styles.operationMetric}>no usage data</span>\n <span className={styles.operationMetric}>\n {formatBytes(request.responsePayloadBytes)}\n </span>\n </>\n )}\n {request.type === \"failed\" && (\n <span className={classNames(styles.operationMetric, styles.danger)}>\n {request.error.type}\n </span>\n )}\n {request.type === \"pending\" && (\n <span className={styles.operationMetric}>Loading...</span>\n )}\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|