Merge branch 'dev' into fix/resizable-component

Author: ElinorW

.github/policies/resourceManagement.yml

@@ -89,7 +89,6 @@ configuration:
           - isOpen
           - not:
               and:
-                - isAssignedToSomeone
                 - isLabeled
       then:
         - addLabel:
@@ -98,7 +97,17 @@ configuration:
       - payloadType: Issues
       - and:
           - isOpen
-          - isAssignedToSomeone
+          - isLabeled
+          - not:
+              and:
+                - isAssignedToSomeone
+      then:
+        - addLabel:
+            label: 'Triaged-Unassigned'
+    - if:
+      - payloadType: Issues
+      - and:
+          - isOpen
           - isLabeled
       then:
         - removeLabel:

src/app/services/actions/autocomplete-action-creators.spec.ts

@@ -47,7 +47,8 @@ const mockState: ApplicationState = {
   samples: {
     queries: [],
     pending: false,
-    error: null
+    error: null,
+    hasAutoSelectedDefault: false
   },
   scopes: {
     pending: { isSpecificPermissions: false, isFullPermissions: false },
@@ -123,7 +124,8 @@ store.getState = () => ({
   samples: {
     queries: [],
     pending: false,
-    error: null
+    error: null,
+    hasAutoSelectedDefault: false
   }
 })
 

src/app/services/actions/permissions-action-creator.spec.ts

@@ -68,7 +68,8 @@ const mockState: ApplicationState = {
   samples: {
     queries: [],
     pending: false,
-    error: null
+    error: null,
+    hasAutoSelectedDefault: false
   },
   scopes: {
     pending: { isSpecificPermissions: false, isFullPermissions: false },

src/app/services/actions/resource-explorer-action-creators.spec.ts

@@ -43,7 +43,8 @@ const mockState: ApplicationState = {
   samples: {
     queries: [],
     pending: false,
-    error: null
+    error: null,
+    hasAutoSelectedDefault: false
   },
   permissionGrants: {
     permissions: [],

src/app/services/slices/samples.slice.ts

@@ -9,12 +9,14 @@ interface SamplesState {
   queries: ISampleQuery[];
   pending: boolean;
   error: object | null | string;
+  hasAutoSelectedDefault: boolean;
 }
 
 const initialState: SamplesState = {
   queries: [],
   pending: false,
-  error: null
+  error: null,
+  hasAutoSelectedDefault: false
 };
 
 export const fetchSamples = createAsyncThunk<ISampleQuery[], void, { rejectValue: ISampleQuery[] }>(
@@ -52,7 +54,11 @@ export const fetchSamples = createAsyncThunk<ISampleQuery[], void, { rejectValue
 const samplesSlice = createSlice({
   name: 'samples',
   initialState,
-  reducers: {},
+  reducers: {
+    setHasAutoSelectedDefault: (state, action) => {
+      state.hasAutoSelectedDefault = action.payload;
+    }
+  },
   extraReducers: (builder) => {
     builder
       .addCase(fetchSamples.pending, (state) => {
@@ -73,4 +79,5 @@ const samplesSlice = createSlice({
   }
 });
 
+export const { setHasAutoSelectedDefault } = samplesSlice.actions;
 export default samplesSlice.reducer;

src/app/views/App.tsx

@@ -1,6 +1,5 @@
 import {
   FluentProvider,
-  teamsHighContrastTheme,
   Theme,
   webDarkTheme,
   webLightTheme
@@ -256,8 +255,7 @@ class App extends Component<IAppProps, IAppState> {
   public render() {
     const fluentV9Themes: Record<string, Theme> = {
       light: webLightTheme,
-      dark: webDarkTheme,
-      'high-contrast': teamsHighContrastTheme
+      dark: webDarkTheme
     };
     return (
       <FluentProvider theme={fluentV9Themes[this.props.appTheme]}>

src/app/views/main-header/settings/ThemeChooser.tsx

@@ -6,7 +6,7 @@ import { PopupsComponent } from '../../../services/context/popups-context';
 import { changeTheme } from '../../../services/slices/theme.slice';
 import { translateMessage } from '../../../utils/translate-messages';
 import { useIconOptionStyles, useRadioGroupStyles } from './ThemeChooser.styles';
-import { BrightnessHigh24Regular, WeatherMoon24Regular, DarkTheme24Regular} from '@fluentui/react-icons';
+import { BrightnessHigh24Regular, WeatherMoon24Regular} from '@fluentui/react-icons';
 
 const availableThemes = [
   {
@@ -18,11 +18,6 @@ const availableThemes = [
     key: 'dark',
     displayName: 'Dark',
     icon: <WeatherMoon24Regular />
-  },
-  {
-    key: 'high-contrast',
-    displayName: 'High Contrast',
-    icon: <DarkTheme24Regular />
   }
 ];
 

src/app/views/sidebar/Sidebar.styles.tsx

@@ -29,6 +29,15 @@ export const useSidebarStyles = makeStyles({
     maxWidth: '100%'
   },
   activeLeaf: {
-    backgroundColor: tokens.colorNeutralBackground3Hover
+    backgroundColor: tokens.colorNeutralBackground3Hover,
+    '@media (forced-colors: active)': {
+      backgroundColor: 'Highlight',
+      color: 'HighlightText',
+      forcedColorAdjust: 'none',
+      // Adding border for better visibility in high contrast mode
+      outlineWidth: '2px',
+      outlineStyle: 'solid',
+      outlineColor: 'ButtonText'
+    }
   }
 })

src/app/views/sidebar/history/History.styles.ts

@@ -9,6 +9,9 @@ export const useHistoryStyles = makeStyles({
     alignItems: 'center',
     gap: '2px'
   },
+  button: {
+    border: 'none'
+  },
   badgeContainer: {
     minWidth: '50px',
     display: 'inline-flex'

src/app/views/sidebar/history/History.tsx

@@ -34,9 +34,9 @@ import {
 } from '@fluentui/react-components';
 import {
   AddSquare20Regular,
-  ArrowDownloadRegular,
-  DeleteRegular,
-  MoreHorizontalRegular,
+  ArrowDownload20Regular,
+  Delete20Regular,
+  MoreHorizontal20Regular,
   SubtractSquare20Regular
 } from '@fluentui/react-icons';
 import React, { useEffect, useRef, useState } from 'react';
@@ -143,14 +143,15 @@ const GroupIcons = (props: AsideGroupIconsProps)=>{
     <Tooltip withArrow relationship="label" content={`${translateMessage('Export')} ${groupName} queries`}>
       <Button onClick={
         (e) => handleDownloadHistoryGroup(e,groupName, historyItems )}
-      appearance="subtle" icon={<ArrowDownloadRegular/>}></Button>
+      appearance="subtle" icon={<ArrowDownload20Regular/>} className={styles.button}></Button>
     </Tooltip>
     <Dialog open={open} onOpenChange={(_event, data) => setOpen(data.open)}>
       <DialogTrigger disableButtonEnhancement>
         <Tooltip withArrow relationship="label" content={`${translateMessage('Delete')} ${groupName} queries`}>
           <Button
             appearance="subtle"
-            icon={<DeleteRegular/>}
+            icon={<Delete20Regular/>}
+            className={styles.button}
             onClick={(e) => {
               e.stopPropagation();
               setOpen(true);
@@ -198,6 +199,7 @@ interface HistoryProps {
 const HistoryItems = (props: HistoryProps)=>{
   const dispatch = useAppDispatch();
   const sidebarStyles = useSidebarStyles();
+  const historyStyles = useHistoryStyles();
   const {groups, history} = props
   const shouldGenerateGroups = useRef(true);
   const [selectedItemKey, setSelectedItemKey] = useState<string | null>(null);
@@ -348,6 +350,7 @@ const HistoryItems = (props: HistoryProps)=>{
                             aria-label={translateMessage('Remove from collection')}
                             appearance='transparent'
                             icon={<SubtractSquare20Regular />}
+                            className={historyStyles.button}
                             onClick={ (e: React.MouseEvent<HTMLButtonElement>) => {
                               e.stopPropagation();
                               handleRemoveFromCollection(h);
@@ -365,6 +368,7 @@ const HistoryItems = (props: HistoryProps)=>{
                             aria-label={translateMessage('Add to collection')}
                             appearance='transparent'
                             icon={<AddSquare20Regular />}
+                            className={historyStyles.button}
                             onClick={(e:  React.MouseEvent<HTMLButtonElement>) => {
                               e.stopPropagation();
                               handleAddToCollection(h);
@@ -432,6 +436,7 @@ interface HistoryItemActionMenuProps {
 
 const HistoryItemActionMenu = (props: HistoryItemActionMenuProps)=>{
   const dispatch = useAppDispatch()
+  const historyStyles = useHistoryStyles()
   const {item} = props
 
   const handleExportQuery = (query: IHistoryItem)=>{
@@ -457,21 +462,28 @@ const HistoryItemActionMenu = (props: HistoryItemActionMenuProps)=>{
   }
   return <Menu>
     <MenuTrigger disableButtonEnhancement>
-      <Button  tabIndex={0} appearance='subtle' icon={<MoreHorizontalRegular/>}></Button>
+      <Button
+        tabIndex={0}
+        appearance='subtle'
+        icon={<MoreHorizontal20Regular />}
+        className={historyStyles.button}
+      ></Button>
     </MenuTrigger>
 
     <MenuPopover>
       <MenuList>
         <MenuGroup>
           <MenuGroupHeader>{translateMessage('actions')}</MenuGroupHeader>
-          <MenuItem icon={<ArrowDownloadRegular/>}
+          <MenuItem icon={<ArrowDownload20Regular/>}
+            className={historyStyles.button}
             onClick={(e) => {
               e.stopPropagation();
               handleExportQuery(item);
             }}>
             {translateMessage('Export')}
           </MenuItem>
-          <MenuItem icon={<DeleteRegular/>}
+          <MenuItem icon={<Delete20Regular/>}
+            className={historyStyles.button}
             onClick={(e) => {
               e.stopPropagation();
               handleDeleteQuery(item);