feat: Slack Avatar integration

Our current Avatars are a little dry, using a limited variety of colors and showing the user's initials. The app could use a little more personality. Now given we already have a slack integration and administrators can configure their `SLACK_API_TOKEN`, I was thinking we can use this integration to get Slack's avatars integrated in Superset. Given the popularity of Slack and users familiarity with the avatars there, I thought it'd be neat to bring a bit more color in Superset. The approach here is centered around a new endpoint `/api/v1/user/{id}/avatar.png`, which fetches from a new column in UserAttribute (our one-to-one extension to FAB's User model) for avatar_url, and redirects to the destination. When loading for the first time, if information is empty and Slack is configured, we ask Slack for the URL, which is secret, but serves the image from outside the authentication part of their API.
apache · Apr 2, 2024 · ae55fc4 · ae55fc4
1 parent ca47717
commit ae55fc4
Show file tree

Hide file tree

Showing 19 changed files with 266 additions and 32 deletions.
diff --git a/.gitignore b/.gitignore
@@ -110,5 +110,6 @@ release.json
 messages.mo
 
 docker/requirements-local.txt
+docker/.env-local
 
 cache/
diff --git a/UPDATING.md b/UPDATING.md
@@ -35,6 +35,9 @@ assists people when migrating to a new version.
   files for production use cases! While we never really supported
   or should have tried to support docker-compose for production use cases, we now actively
   have taken a stance against supporting it. See the PR for details.
+- ? New config flag `SLACK_ENABLE_AVATARS` that is `True` by default, meaning if you have
+  set `SLACK_API_TOKEN` already for other purposes, Superset will start using Slack
+  avatars throughout the app.
 
 ### Breaking Changes
 

diff --git a/docker-compose-image-tag.yml b/docker-compose-image-tag.yml
@@ -33,7 +33,11 @@ services:
       - redis:/data
 
   db:
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     image: postgres:15
     container_name: superset_db
     restart: unless-stopped
@@ -42,7 +46,11 @@ services:
       - ./docker/docker-entrypoint-initdb.d:/docker-entrypoint-initdb.d
 
   superset:
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     image: *superset-image
     container_name: superset_app
     command: ["/app/docker/docker-bootstrap.sh", "app-gunicorn"]
@@ -57,7 +65,11 @@ services:
     image: *superset-image
     container_name: superset_init
     command: ["/app/docker/docker-init.sh"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     depends_on: *superset-depends-on
     user: "root"
     volumes: *superset-volumes
@@ -68,7 +80,11 @@ services:
     image: *superset-image
     container_name: superset_worker
     command: ["/app/docker/docker-bootstrap.sh", "worker"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     restart: unless-stopped
     depends_on: *superset-depends-on
     user: "root"
@@ -84,7 +100,11 @@ services:
     image: *superset-image
     container_name: superset_worker_beat
     command: ["/app/docker/docker-bootstrap.sh", "beat"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     restart: unless-stopped
     depends_on: *superset-depends-on
     user: "root"

diff --git a/docker-compose-non-dev.yml b/docker-compose-non-dev.yml
@@ -38,7 +38,11 @@ services:
       - redis:/data
 
   db:
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     image: postgres:15
     container_name: superset_db
     restart: unless-stopped
@@ -47,7 +51,11 @@ services:
       - ./docker/docker-entrypoint-initdb.d:/docker-entrypoint-initdb.d
 
   superset:
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     build:
       <<: *common-build
     container_name: superset_app
@@ -64,7 +72,11 @@ services:
     build:
       <<: *common-build
     command: ["/app/docker/docker-init.sh"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     depends_on: *superset-depends-on
     user: "root"
     volumes: *superset-volumes
@@ -76,7 +88,11 @@ services:
       <<: *common-build
     container_name: superset_worker
     command: ["/app/docker/docker-bootstrap.sh", "worker"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     restart: unless-stopped
     depends_on: *superset-depends-on
     user: "root"
@@ -93,7 +109,11 @@ services:
       <<: *common-build
     container_name: superset_worker_beat
     command: ["/app/docker/docker-bootstrap.sh", "beat"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     restart: unless-stopped
     depends_on: *superset-depends-on
     user: "root"

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -54,7 +54,11 @@ services:
       - redis:/data
 
   db:
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     image: postgres:15
     container_name: superset_db
     restart: unless-stopped
@@ -65,7 +69,11 @@ services:
       - ./docker/docker-entrypoint-initdb.d:/docker-entrypoint-initdb.d
 
   superset:
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     build:
       <<: *common-build
     container_name: superset_app
@@ -116,7 +124,11 @@ services:
       <<: *common-build
     container_name: superset_init
     command: ["/app/docker/docker-init.sh"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     depends_on: *superset-depends-on
     user: *superset-user
     volumes: *superset-volumes
@@ -135,7 +147,11 @@ services:
       PUPPETEER_SKIP_CHROMIUM_DOWNLOAD: ${BUILD_SUPERSET_FRONTEND_IN_DOCKER:-false}
     container_name: superset_node
     command: ["/app/docker/docker-frontend.sh"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     depends_on: *superset-depends-on
     volumes: *superset-volumes
 
@@ -144,7 +160,11 @@ services:
       <<: *common-build
     container_name: superset_worker
     command: ["/app/docker/docker-bootstrap.sh", "worker"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     restart: unless-stopped
     depends_on: *superset-depends-on
     user: *superset-user
@@ -162,7 +182,11 @@ services:
       <<: *common-build
     container_name: superset_worker_beat
     command: ["/app/docker/docker-bootstrap.sh", "beat"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     restart: unless-stopped
     depends_on: *superset-depends-on
     user: *superset-user
@@ -175,7 +199,11 @@ services:
       <<: *common-build
     container_name: superset_tests_worker
     command: ["/app/docker/docker-bootstrap.sh", "worker"]
-    env_file: docker/.env
+    env_file:
+      # defaults
+      - docker/.env
+      # gitignored overrides
+      - docker/.env-local
     environment:
       DATABASE_HOST: localhost
       DATABASE_DB: test

diff --git a/docker/pythonpath_dev/superset_config.py b/docker/pythonpath_dev/superset_config.py
@@ -99,6 +99,7 @@ class CeleryConfig:
 WEBDRIVER_BASEURL_USER_FRIENDLY = WEBDRIVER_BASEURL
 
 SQLLAB_CTAS_NO_LIMIT = True
+SLACK_API_TOKEN = os.getenv("SLACK_API_TOKEN")
 
 #
 # Optionally import superset_config_docker.py (which will have been included on

diff --git a/superset-frontend/src/components/FacePile/index.tsx b/superset-frontend/src/components/FacePile/index.tsx
@@ -33,12 +33,14 @@ interface FacePileProps {
 
 const colorList = getCategoricalSchemeRegistry().get()?.colors ?? [];
 
-const customAvatarStyler = (theme: SupersetTheme) => `
-  width: ${theme.gridUnit * 6}px;
-  height: ${theme.gridUnit * 6}px;
-  line-height: ${theme.gridUnit * 6}px;
-  font-size: ${theme.typography.sizes.m}px;
-`;
+const customAvatarStyler = (theme: SupersetTheme) => {
+  const size = theme.gridUnit * 8;
+  return `
+  width: ${size}px;
+  height: ${size}px;
+  line-height: ${size}px;
+  font-size: ${theme.typography.sizes.m}px;`;
+};
 
 const StyledAvatar = styled(Avatar)`
   ${({ theme }) => customAvatarStyler(theme)}
@@ -58,6 +60,7 @@ export default function FacePile({ users, maxCount = 4 }: FacePileProps) {
         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`;
         return (
           <Tooltip key={name} title={name} placement="top">
             <StyledAvatar
@@ -66,12 +69,14 @@ export default function FacePile({ users, maxCount = 4 }: FacePileProps) {
                 backgroundColor: color,
                 borderColor: color,
               }}
+              src={avatarUrl}
             >
               {first_name?.[0]?.toLocaleUpperCase()}
               {last_name?.[0]?.toLocaleUpperCase()}
             </StyledAvatar>
           </Tooltip>
         );
+        return <img src={avatarUrl} />;
       })}
     </StyledGroup>
   );

diff --git a/superset-frontend/src/components/TableCollection/index.tsx b/superset-frontend/src/components/TableCollection/index.tsx
@@ -307,6 +307,7 @@ export default React.memo(
                           [cell.column.size || '']: cell.column.size,
                         },
                       )}
+                      style={cell.column.tdStyle}
                       {...cell.getCellProps()}
                       {...columnCellProps}
                     >

diff --git a/superset-frontend/src/pages/DashboardList/index.tsx b/superset-frontend/src/pages/DashboardList/index.tsx
@@ -357,6 +357,7 @@ function DashboardList(props: DashboardListProps) {
         Header: t('Owners'),
         accessor: 'owners',
         disableSortBy: true,
+        tdStyle: { padding: '0px' },
         size: 'xl',
       },
       {

diff --git a/superset/config.py b/superset/config.py
@@ -1315,6 +1315,8 @@ def EMAIL_HEADER_MUTATOR(  # pylint: disable=invalid-name,unused-argument
 # Slack API token for the superset reports, either string or callable
 SLACK_API_TOKEN: Callable[[], str] | str | None = None
 SLACK_PROXY = None
+# Whether Superset should use Slack avatars for users
+SLACK_ENABLE_AVATARS = True
 
 # The webdriver to use for generating reports. Use one of the following
 # firefox
@@ -1411,6 +1413,7 @@ def EMAIL_HEADER_MUTATOR(  # pylint: disable=invalid-name,unused-argument
             "data:",
             "https://apachesuperset.gateway.scarf.sh",
             "https://static.scarf.sh/",
+            "https://avatars.slack-edge.com",
         ],
         "worker-src": ["'self'", "blob:"],
         "connect-src": [
@@ -1440,6 +1443,7 @@ def EMAIL_HEADER_MUTATOR(  # pylint: disable=invalid-name,unused-argument
             "data:",
             "https://apachesuperset.gateway.scarf.sh",
             "https://static.scarf.sh/",
+            "https://avatars.slack-edge.com",
         ],
         "worker-src": ["'self'", "blob:"],
         "connect-src": [

diff --git a/superset/dashboards/api.py b/superset/dashboards/api.py
@@ -179,6 +179,9 @@ def ensure_thumbnails_enabled(self) -> Optional[Response]:
         "owners.id",
         "owners.first_name",
         "owners.last_name",
+        "owners.email",
+        "owners.id",
+        # "owners.user_attributes.avatar_url",
         "roles.id",
         "roles.name",
         "is_managed_externally",

diff --git a/superset/initialization/__init__.py b/superset/initialization/__init__.py
@@ -190,7 +190,7 @@ def init_views(self) -> None:
         )
         from superset.views.sqllab import SqllabView
         from superset.views.tags import TagModelView, TagView
-        from superset.views.users.api import CurrentUserRestApi
+        from superset.views.users.api import CurrentUserRestApi, UserRestApi
 
         #
         # Setup API views
@@ -205,6 +205,7 @@ def init_views(self) -> None:
         appbuilder.add_api(ChartDataRestApi)
         appbuilder.add_api(CssTemplateRestApi)
         appbuilder.add_api(CurrentUserRestApi)
+        appbuilder.add_api(UserRestApi)
         appbuilder.add_api(DashboardFilterStateRestApi)
         appbuilder.add_api(DashboardPermalinkRestApi)
         appbuilder.add_api(DashboardRestApi)

diff --git a/superset/migrations/versions/2024-04-01_22-44_c22cb5c2e546_user_attr_avatar_url.py b/superset/migrations/versions/2024-04-01_22-44_c22cb5c2e546_user_attr_avatar_url.py
@@ -0,0 +1,39 @@
+# Licensed to the Apache Software Foundation (ASF) under one
+# or more contributor license agreements.  See the NOTICE file
+# distributed with this work for additional information
+# regarding copyright ownership.  The ASF licenses this file
+# to you under the Apache License, Version 2.0 (the
+# "License"); you may not use this file except in compliance
+# with the License.  You may obtain a copy of the License at
+#
+#   http://www.apache.org/licenses/LICENSE-2.0
+# # Unless required by applicable law or agreed to in writing,
+# software distributed under the License is distributed on an
+# "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+# KIND, either express or implied.  See the License for the
+# specific language governing permissions and limitations
+# under the License.
+"""empty message
+
+Revision ID: c22cb5c2e546
+Revises: be1b217cd8cd
+Create Date: 2024-04-01 22:44:40.386543
+
+"""
+import sqlalchemy as sa
+from alembic import op
+from sqlalchemy.dialects import postgresql
+
+# revision identifiers, used by Alembic.
+revision = "c22cb5c2e546"
+down_revision = "be1b217cd8cd"
+
+
+def upgrade():
+    op.add_column(
+        "user_attribute", sa.Column("avatar_url", sa.String(length=100), nullable=True)
+    )
+
+
+def downgrade():
+    op.drop_column("user_attribute", "avatar_url")