diff --git a/superset-frontend/src/components/FacePile/FacePile.test.tsx b/superset-frontend/src/components/FacePile/FacePile.test.tsx
index 0e7b4516493fa..ce8acdc1af3b9 100644
--- a/superset-frontend/src/components/FacePile/FacePile.test.tsx
+++ b/superset-frontend/src/components/FacePile/FacePile.test.tsx
@@ -16,9 +16,10 @@
* specific language governing permissions and limitations
* under the License.
*/
+import { Provider } from 'react-redux';
import { styledMount as mount } from 'spec/helpers/theming';
-
import { Avatar } from 'src/components';
+import { store } from 'src/views/store';
import FacePile from '.';
import { getRandomColor } from './utils';
@@ -29,7 +30,11 @@ const users = [...new Array(10)].map((_, i) => ({
}));
describe('FacePile', () => {
- const wrapper = mount();
+ const wrapper = mount(
+
+
+ ,
+ );
it('is a valid element', () => {
expect(wrapper.find(FacePile)).toExist();
diff --git a/superset-frontend/src/components/FacePile/index.tsx b/superset-frontend/src/components/FacePile/index.tsx
index 526babbc3ef38..51e44d248e6cb 100644
--- a/superset-frontend/src/components/FacePile/index.tsx
+++ b/superset-frontend/src/components/FacePile/index.tsx
@@ -16,6 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
+import { useSelector } from 'react-redux';
import {
getCategoricalSchemeRegistry,
styled,
@@ -23,6 +24,7 @@ import {
} from '@superset-ui/core';
import { Tooltip } from 'src/components/Tooltip';
import { Avatar } from 'src/components';
+import { RootState } from 'src/views/store';
import { getRandomColor } from './utils';
interface FacePileProps {
@@ -53,13 +55,18 @@ const StyledGroup = styled(Avatar.Group)`
`;
export default function FacePile({ users, maxCount = 4 }: FacePileProps) {
+ const enableAvatars = useSelector(
+ state => state.common?.conf?.SLACK_ENABLE_AVATARS,
+ );
return (
{users.map(({ first_name, last_name, id }) => {
const name = `${first_name} ${last_name}`;
const uniqueKey = `${id}-${first_name}-${last_name}`;
const color = getRandomColor(uniqueKey, colorList);
- const avatarUrl = `/api/v1/user/${id}/avatar.png`;
+ const avatarUrl = enableAvatars
+ ? `/api/v1/user/${id}/avatar.png`
+ : undefined;
return (