Filters polishing, remove displaying rotation modal for Terraform/API based schedules (#3259)

# What this PR does

Filters fixes and polishing, remove displaying rotation modal for
Terraform/API bases schedules

## Which issue(s) this PR fixes

https://github.com/grafana/oncall/issues/1714
https://github.com/grafana/oncall-private/issues/2246
https://github.com/grafana/oncall/issues/3183

## Checklist

- [ ] Unit, integration, and e2e (if applicable) tests updated
- [ ] Documentation added (or `pr:no public docs` PR label added if not
required)
- [x] `CHANGELOG.md` updated (or `pr:no changelog` PR label added if not
required)

CHANGELOG.md

@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
+### Fixed
+
+- User filter doesn't display current value on Alert Groups page ([1714](https://github.com/grafana/oncall/issues/1714))
+- Remove displaying rotation modal for Terraform/API based schedules
+- Filters polishing ([3183](https://github.com/grafana/oncall/issues/3183))
+
 ## v1.3.62 (2023-11-21)
 
 ### Added

grafana-plugin/src/components/LabelsFilter/LabelsFilter.tsx

@@ -21,14 +21,15 @@ const LabelsFilter: FC<LabelsFilterProps> = (props) => {
   const [search, setSearch] = useState('');
 
   const handleChange = useCallback((value) => {
-    onChange(value.map((v) => v.value));
+    onChange(value.map((v) => v.data));
   }, []);
 
   const handleLoadOptions = (search) => {
     return onLoadOptions(search).then((options) =>
       options.map((v) => ({
         label: `${v.key[FieldName]} : ${v.value[FieldName]}`,
-        value: v,
+        value: `${v.key[FieldName]} : ${v.value[FieldName]}`,
+        data: v,
       }))
     );
   };
@@ -37,7 +38,8 @@ const LabelsFilter: FC<LabelsFilterProps> = (props) => {
     () =>
       propsValue.map((v) => ({
         label: `${v.key[FieldName]} : ${v.value[FieldName]}`,
-        value: v,
+        value: `${v.key[FieldName]} : ${v.value[FieldName]}`,
+        data: v,
       })),
     [propsValue]
   );

grafana-plugin/src/containers/RemoteFilters/RemoteFilters.tsx

@@ -75,7 +75,7 @@ class RemoteFilters extends Component<RemoteFiltersProps, RemoteFiltersState> {
 
       const { filterOptions } = this.state;
 
-      let { filters, values } = parseFilters(query, filterOptions, query);
+      let { filters, values } = parseFilters({ ...query, ...filtersStore.globalValues }, filterOptions, query);
 
       this.setState({ filterOptions, filters, values }, () => this.onChange());
     }
@@ -273,6 +273,7 @@ class RemoteFilters extends Component<RemoteFiltersProps, RemoteFiltersState> {
             value={values[filter.name]}
             onChange={this.getRemoteOptionsChangeHandler(filter.name)}
             getOptionLabel={(item: SelectableValue) => <Emoji text={item.label || ''} />}
+            predefinedOptions={filter.default ? [filter.default] : undefined}
           />
         );
 

grafana-plugin/src/containers/RemoteSelect/RemoteSelect.tsx

@@ -27,6 +27,7 @@ interface RemoteSelectProps {
   showError?: boolean;
   maxMenuHeight?: number;
   requiredUserAction?: UserAction;
+  predefinedOptions?: any[];
 }
 
 const RemoteSelect = inject('store')(
@@ -49,6 +50,7 @@ const RemoteSelect = inject('store')(
       showError,
       maxMenuHeight,
       requiredUserAction,
+      predefinedOptions,
     } = props;
 
     const [noOptionsMessage, setNoOptionsMessage] = useState<string>('No options found');
@@ -66,7 +68,7 @@ const RemoteSelect = inject('store')(
       return oldOptions.concat(newOptions.filter(({ value }) => !existingValues.includes(value)));
     }
 
-    const [options, setOptions] = useReducer(mergeOptions, []);
+    const [options, setOptions] = useReducer(mergeOptions, getOptions(predefinedOptions || []));
 
     const loadOptionsCallback = useDebouncedCallback(async (query: string, cb) => {
       try {

grafana-plugin/src/pages/schedule/Schedule.tsx

@@ -291,7 +291,13 @@ class SchedulePage extends React.Component<SchedulePageProps, SchedulePageState>
                         shiftSwapIdToShowForm
                           ? this.adjustShiftSwapForm
                           : (event: Event) => {
-                              this.handleShowForm(event.shift.pk);
+                              const shiftId = event.shift.pk;
+
+                              if (event.shift.type === 2 && !disabledRotationForm) {
+                                this.handleShowRotationForm(shiftId);
+                              } else if (event.shift.type === 3 && !disabledOverrideForm) {
+                                this.handleShowOverridesForm(shiftId);
+                              }
                             }
                       }
                     />
@@ -382,20 +388,6 @@ class SchedulePage extends React.Component<SchedulePageProps, SchedulePageState>
     });
   };
 
-  handleShowForm = async (shiftId: Shift['id'] | 'new') => {
-    const {
-      store: { scheduleStore },
-    } = this.props;
-
-    const shift = await scheduleStore.updateOncallShift(shiftId);
-
-    if (shift.type === 2) {
-      this.handleShowRotationForm(shiftId);
-    } else if (shift.type === 3) {
-      this.handleShowOverridesForm(shiftId);
-    }
-  };
-
   handleShowRotationForm = (shiftId: Shift['id'] | 'new') => {
     this.setState({ shiftIdToShowRotationForm: shiftId });
   };