ui/packages/shared/profile: Deatch filter input and address TS comments

Co-authored-by: Monica Wojciechowska <monica.wojciechowski@polarsignals.com>
parca-dev · May 15, 2023 · 9753eab · 9753eab
1 parent 9caa2fa
commit 9753eab
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 11 deletions.
diff --git a/ui/packages/shared/profile/src/MetricsGraph/MetricsTooltip/index.tsx b/ui/packages/shared/profile/src/MetricsGraph/MetricsTooltip/index.tsx
@@ -121,7 +121,7 @@ const MetricsTooltip = ({
                       <tr>
                         <td className="w-1/4">Value</td>
                         <td className="w-3/4">
-                          {valueFormatter(highlighted.valuePerSecond, sampleUnit, 5)}{' '}
+                          {valueFormatter(highlighted.valuePerSecond, sampleUnit, 5)}
                         </td>
                       </tr>
                       {delta && (

diff --git a/ui/packages/shared/profile/src/ProfileMetricsGraph/index.tsx b/ui/packages/shared/profile/src/ProfileMetricsGraph/index.tsx
@@ -30,7 +30,7 @@ interface ProfileMetricsGraphProps {
   profile: ProfileSelection | null;
   from: number;
   to: number;
-  filterByFunction: string | undefined;
+  filterByFunction?: string;
   setTimeRange: (range: DateTimeRange) => void;
   addLabelMatcher: (key: string, value: string) => void;
   onPointClick: (timestamp: number, labels: Label[], queryExpression: string) => void;
@@ -47,7 +47,7 @@ export const useQueryRange = (
   queryExpression: string,
   start: number,
   end: number,
-  filterByFunction: string | undefined
+  filterByFunction?: string,
 ): IQueryRangeState => {
   const [state, setState] = useState<IQueryRangeState>({
     response: null,

diff --git a/ui/packages/shared/profile/src/ProfileSelector/index.tsx b/ui/packages/shared/profile/src/ProfileSelector/index.tsx
@@ -215,15 +215,13 @@ const ProfileSelector = ({
               runQuery={setQueryExpression}
               currentQuery={query}
             />
-            <div>
-              <Input
-                className="divider-y block w-full flex-1 rounded rounded-l-none bg-gray-50 px-2 py-2 text-sm outline-none focus:ring-indigo-800 dark:bg-gray-900"
-                placeholder="filter function name..."
-                value={functionFilter}
-                onChange={e => setFunctionFilter(e.target.value)}
-              />
-            </div>
           </div>
+          <Input
+            className="divider-y block rounded bg-gray-50 px-2 py-2 text-sm outline-none focus:ring-indigo-800 dark:bg-gray-900"
+            placeholder="Filter function name..."
+            value={functionFilter}
+            onChange={e => setFunctionFilter(e.target.value)}
+          />
           <DateTimeRangePicker
             onRangeSelection={setTimeRangeSelection}
             range={timeRangeSelection}