Skip to content

Commit 80a72b3

Browse files
committed
chore: remove redundant sections
Signed-off-by: Gabriel Bernal <gbernal@redhat.com>
1 parent 3cb2299 commit 80a72b3

File tree

1 file changed

+0
-80
lines changed

1 file changed

+0
-80
lines changed

CONTRIBUTING.md

Lines changed: 0 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ Thank you for your interest in contributing to the OpenShift Monitoring Plugin!
1212
- [Code Conventions](#code-conventions)
1313
- [Naming Conventions](#naming-conventions)
1414
- [React Component Patterns](#react-component-patterns)
15-
- [State Management](#state-management)
1615
- [TypeScript Best Practices](#typescript-best-practices)
1716
- [Go Backend Guidelines](#go-backend-guidelines)
1817
- [Testing Requirements](#testing-requirements)
@@ -278,52 +277,6 @@ export const ErrorAlert: FC<ErrorAlertProps> = ({ error }) => {
278277
};
279278
```
280279

281-
#### Memoization
282-
283-
Use `memo` for components that receive stable props and render frequently:
284-
285-
```typescript
286-
// ✅ Good: Memoized component with named export
287-
import { memo } from "react";
288-
289-
export const Health: FC<{ health: "up" | "down" }> = memo(({ health }) => {
290-
return health === "up" ? (
291-
<GreenCheckCircleIcon />
292-
) : (
293-
<RedExclamationCircleIcon />
294-
);
295-
});
296-
```
297-
298-
Use `useMemo` for expensive computations:
299-
300-
```typescript
301-
// ✅ Good: Memoized computation
302-
const additionalAlertSourceLabels = useMemo(
303-
() => getAdditionalSources(alerts, alertSource),
304-
[alerts]
305-
);
306-
307-
// Avoid creating new arrays on every render
308-
const queriesMemoKey = JSON.stringify(_.map(queries, "query"));
309-
const queryStrings = useMemo(() => _.map(queries, "query"), [queriesMemoKey]);
310-
```
311-
312-
Use `useCallback` for event handlers passed to child components:
313-
314-
```typescript
315-
// ✅ Good: Memoized callbacks
316-
const toggleIsEnabled = useCallback(
317-
() => dispatch(queryBrowserToggleIsEnabled(index)),
318-
[dispatch, index]
319-
);
320-
321-
const doDelete = useCallback(() => {
322-
dispatch(queryBrowserDeleteQuery(index));
323-
focusedQuery = undefined;
324-
}, [dispatch, index]);
325-
```
326-
327280
#### Translations (i18n)
328281

329282
Always use the `useTranslation` hook for user-facing strings, this allows the translation
@@ -345,39 +298,6 @@ export const MyComponent: FC = () => {
345298
};
346299
```
347300

348-
### State Management
349-
350-
#### Context API
351-
352-
Use React Context for sharing state across component trees:
353-
354-
```typescript
355-
// ✅ Good: Context definition
356-
import React, { useMemo } from "react";
357-
358-
type MonitoringContextType = {
359-
plugin: MonitoringPlugins;
360-
prometheus: Prometheus;
361-
useAlertsTenancy: boolean;
362-
useMetricsTenancy: boolean;
363-
accessCheckLoading: boolean;
364-
};
365-
366-
export const MonitoringContext = React.createContext<MonitoringContextType>({
367-
plugin: "monitoring-plugin",
368-
prometheus: "cmo",
369-
useAlertsTenancy: false,
370-
useMetricsTenancy: false,
371-
accessCheckLoading: true,
372-
});
373-
374-
// Custom hook to consume context
375-
export const useMonitoring = () => {
376-
const context = useContext(MonitoringContext);
377-
return context;
378-
};
379-
```
380-
381301
### TypeScript Best Practices
382302

383303
#### Type Imports

0 commit comments

Comments
 (0)