@stackoverflow/backstage-plugin-stack-overflow-teams 1.5.0

package/README.md

@@ -0,0 +1,91 @@
+# Stack Overflow Teams Frontend Plugin
+
+This package is the frontend counterpart of the `stack-overflow-teams` plugin for Backstage.
+
+## Areas of Responsibility
+
+It provides the UI and interacts with the [backend service](https://github.com/EstoesMoises/backstage-stackoverflow/tree/main/plugins/stack-overflow-teams-backend) to fetch data from your Stack Overflow Enterprise instance.
+
+### Backend Dependency
+
+To fully utilize this plugin, you must also install and configure the corresponding **backend package** (`backstage-plugin-stack-overflow-teams-backend`) in your Backstage backend. The frontend plugin relies on the backend for API communication and authentication handling.
+
+## More details
+
+### Enhanced `<StackOverflowSearchResultListItem />`
+
+This component is a modified version of the [community plugin.](https://github.com/backstage/community-plugins/tree/main/workspaces/stack-overflow/plugins/stack-overflow/src/search/StackOverflowSearchResultListItem)
+
+It adds a more Stack Overflow-like interface, including additional information such as the questions' score, user role, user reputation, and timestamp.
+
+---
+
+### Individual Frontend Components
+
+- **`<StackOverflowMe />`**
+  
+  Displays information about the authenticated user.
+
+- **`<StackOverflowPostQuestionModal />`**
+  
+  Provides a form for users to create a new Stack Overflow question. Once submitted, an API request is executed to create the question.
+  
+  This form listens to the `'openAskQuestionModal'` event. You can utilize this anywhere in your Backstage UI. To invoke the form, add the component to your UI along with a button that dispatches the event. Example:
+
+  ```tsx
+  <SidebarItem
+    icon={StackOverflowIcon}
+    onClick={() => window.dispatchEvent(new Event('openAskQuestionModal'))}
+    text="Ask a Question"
+  />
+  
+  <StackOverflowPostQuestionModal />
+  ```
+
+- **`<StackOverflowQuestion />`**
+  
+  Retrieves questions from the API. Uses standard pagination, displaying only the first 30 API results.
+
+- **`<StackOverflowTags />`**
+  
+  Retrieves tags from the API. Uses standard pagination, displaying only the first 30 API results.
+
+- **`<StackOverflowUsers />`**
+  
+  Retrieves users from the API. Uses standard pagination, displaying only the first 30 API results.
+
+- **`<StackOverflowHub />`**
+  
+  Various components collectively create this informative hub.
+
+## Authentication Components
+
+- **`<StackAuthStart />`**
+  
+  Initiates **`/auth/start`** on the backend.
+
+- **`<StackAuthLoading />`**
+  
+  Handles the loading state during authentication.
+
+- **`<StackAuthCallback />`**
+  
+  Receives the code and state from your Stack Overflow Enterprise instance as part of the OAuth process and initiates **`/callback`** in the backend.
+
+- **`<StackAuthSuccess />`**
+  
+  Displays authentication success state.
+
+- **`<StackAuthFailed />`**
+  
+  Displays authentication failure state.
+
+### Page
+
+- **`<StackOverflowTeamsPage />`**
+  
+  This page triggers authentication components, bundles, and orchestrates everything for you so you don't have to use the authentication components separately. If authenticated, it will return the `<StackOverflowHub />`.
+
+### API Requests
+
+The frontend plugin creates an API Ref for Stack Overflow for Teams, which can be found under the `/api` folder. **All API requests from the frontend are directed to Backstage's backend**.

package/config.d.ts

@@ -0,0 +1,71 @@
+/*
+ * Copyright 2023 The Backstage Authors
+ *
+ * Licensed 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.
+ */
+
+export interface Config {
+    /**
+     * Configuration options for the stack overflow for teams frontend plugin. 
+     * 
+     * This configuration is shared with the backstage-plugin-stack-overflow-teams-backend and backstage-stack-overflow-teams-collator
+     */
+    stackoverflow?: {
+      /**
+       * The base url of the Stack Overflow API used for the plugin
+       */
+      baseUrl: string;
+  
+      /**
+       * The API Access Token to authenticate to Stack Overflow API Version 3
+       * @visibility secret
+       */
+      apiAccessToken: string;
+  
+      /**
+       * The name of the team for a Stack Overflow for Teams account
+       */
+      teamName?: string;
+
+      /**
+       * Client Id for the OAuth Application, required to use the Stack Overflow for Teams Hub and write actions.
+       */
+      clientId: number;
+
+      /**
+       * RedirectUri for the OAuth Application, required to use the Stack Overflow for Teams Hub and write actions.
+       * 
+       * This should be your Backstage application domain ending in the plugin's <StackOverflowTeamsPage /> route
+       */
+      redirectUri: string;
+  
+      /**
+       * Type representing the request parameters.
+       */
+      requestParams?: {
+        [key: string]: string | string[] | number;
+      };
+      /**
+       * Type representing the schedule options.
+       */
+      schedule?: {
+        frequency?: TimeUnit;
+        timeout?: TimeUnit;
+        initialDelay?: TimeUnit;
+      };
+
+      
+    };
+  }
+
+type TimeUnit = { minutes?: number; hours?: number; seconds?: number }

package/dist/api/StackOverflowAPI.esm.js

@@ -0,0 +1,125 @@
+import { createApiRef } from '@backstage/core-plugin-api';
+
+const stackoverflowteamsApiRef = createApiRef({
+  id: "plugin.stackoverflowteams.api"
+});
+const createStackOverflowApi = (discoveryApi, fetchApi) => {
+  const getBaseUrl = async () => discoveryApi.getBaseUrl("stack-overflow-teams");
+  const requestAPI = async (endpoint, method = "GET", body, params) => {
+    const baseUrl = await getBaseUrl();
+    const queryString = params ? `?${params.join("&")}` : "";
+    const url = `${baseUrl}/${endpoint}${queryString}`;
+    const response = await fetchApi.fetch(url, {
+      method,
+      credentials: "include",
+      headers: { "Content-Type": "application/json" },
+      body: body ? JSON.stringify(body) : void 0
+    });
+    if (!response.ok) {
+      const errorResponse = await response.json();
+      throw new Error(errorResponse.error || `Request failed: ${response.statusText}`);
+    }
+    return response.json();
+  };
+  const buildQuestionParams = (filter) => {
+    const params = [];
+    if (filter?.sort) {
+      params.push(`sort=${filter.sort}`);
+    }
+    if (filter?.order) {
+      params.push(`order=${filter.order}`);
+    }
+    if (filter?.isAnswered !== void 0) {
+      params.push(`isAnswered=${filter.isAnswered}`);
+    }
+    if (filter?.page !== void 0) {
+      params.push(`page=${filter.page}`);
+    }
+    if (filter?.pageSize !== void 0) {
+      params.push(`pageSize=${filter.pageSize}`);
+    }
+    return params;
+  };
+  return {
+    search: (query, page) => {
+      const body = { query };
+      if (page !== void 0) {
+        body.page = page;
+      }
+      return requestAPI("search", "POST", body);
+    },
+    getQuestions: (filter) => {
+      const params = buildQuestionParams(filter);
+      return requestAPI("questions", "GET", void 0, params.length > 0 ? params : void 0);
+    },
+    getTags: (search) => {
+      const params = search ? [`search=${encodeURIComponent(search)}`] : void 0;
+      return requestAPI("tags", "GET", void 0, params);
+    },
+    getUsers: () => requestAPI("users"),
+    getMe: () => requestAPI("me"),
+    getBaseUrl: async () => {
+      const response = await requestAPI("baseurl");
+      return response.SOInstance;
+    },
+    getTeamName: async () => {
+      const response = await requestAPI("baseurl");
+      return response.teamName;
+    },
+    postQuestion: (title, body, tags) => requestAPI("questions", "POST", { title, body, tags }),
+    startAuth: async () => {
+      const data = await requestAPI("auth/start");
+      return data.authUrl;
+    },
+    completeAuth: async (code, state) => {
+      await requestAPI("callback", "GET", void 0, [
+        `code=${encodeURIComponent(code)}`,
+        `state=${encodeURIComponent(state)}`
+      ]);
+    },
+    getAuthStatus: async () => {
+      try {
+        await requestAPI("authStatus");
+        return true;
+      } catch {
+        return false;
+      }
+    },
+    logout: async () => {
+      try {
+        await requestAPI("logout", "POST");
+        return true;
+      } catch {
+        return false;
+      }
+    },
+    submitAccessToken: async (token) => {
+      try {
+        await requestAPI("auth/token", "POST", { accessToken: token });
+        return true;
+      } catch {
+        return false;
+      }
+    },
+    // Convenience methods for common filtering scenarios
+    getActiveQuestions: (page) => {
+      const params = buildQuestionParams({ sort: "activity", order: "desc", page });
+      return requestAPI("questions", "GET", void 0, params);
+    },
+    getNewestQuestions: (page) => {
+      const params = buildQuestionParams({ sort: "creation", order: "desc", page });
+      return requestAPI("questions", "GET", void 0, params);
+    },
+    getTopScoredQuestions: (page) => {
+      const params = buildQuestionParams({ sort: "score", order: "desc", page });
+      return requestAPI("questions", "GET", void 0, params);
+    },
+    getUnansweredQuestions: (page) => {
+      const params = buildQuestionParams({ isAnswered: false, sort: "creation", order: "desc", page });
+      return requestAPI("questions", "GET", void 0, params);
+    }
+  };
+};
+
+export { createStackOverflowApi, stackoverflowteamsApiRef };
+//# sourceMappingURL=StackOverflowAPI.esm.js.map

package/dist/api/StackOverflowAPI.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackOverflowAPI.esm.js","sources":["../../src/api/StackOverflowAPI.ts"],"sourcesContent":["import {\n  createApiRef,\n  DiscoveryApi,\n  FetchApi,\n} from '@backstage/core-plugin-api';\nimport { Question, Tag, User, PaginatedResponse } from '../api';\n\nexport const stackoverflowteamsApiRef = createApiRef<StackOverflowAPI>({\n  id: 'plugin.stackoverflowteams.api',\n});\n\ntype ApiResponse<T> = PaginatedResponse<T>;\n\ninterface BaseUrlResponse {\n  SOInstance: string;\n  teamName: string\n}\n\n// Enhanced interface for questions filter options\ninterface QuestionsFilter {\n  sort?: 'activity' | 'creation' | 'score';\n  order?: 'asc' | 'desc';\n  isAnswered?: boolean;\n  page?: number;\n  pageSize?: number;\n}\n\nexport interface StackOverflowAPI {\n  search(query: string, page?: number): Promise<any>;\n  getQuestions(filter?: QuestionsFilter): Promise<ApiResponse<Question>>;\n  getTags(search?: string): Promise<ApiResponse<Tag>>;\n  getUsers(): Promise<ApiResponse<User>>;\n  getMe(): Promise<User>;\n  getBaseUrl(): Promise<string>;\n  getTeamName(): Promise<string>;\n  postQuestion(title: string, body: string, tags: string[]): Promise<Question>;\n  startAuth(): Promise<string>;\n  completeAuth(code: string, state: string): Promise<void>;\n  getAuthStatus: () => Promise<boolean>;\n  logout: () => Promise<boolean>;\n  submitAccessToken: (token: string) => Promise<boolean>;\n  \n  // Convenience methods for common filtering scenarios\n  getActiveQuestions(page?: number): Promise<ApiResponse<Question>>;\n  getNewestQuestions(page?: number): Promise<ApiResponse<Question>>;\n  getTopScoredQuestions(page?: number): Promise<ApiResponse<Question>>;\n  getUnansweredQuestions(page?: number): Promise<ApiResponse<Question>>;\n}\n\nexport const createStackOverflowApi = (\n  discoveryApi: DiscoveryApi,\n  fetchApi: FetchApi,\n): StackOverflowAPI => {\n  const getBaseUrl = async () => discoveryApi.getBaseUrl('stack-overflow-teams');\n\n  const requestAPI = async <T>(\n    endpoint: string,\n    method: 'GET' | 'POST' = 'GET',\n    body?: Record<string, unknown>,\n    params?: string[],\n  ): Promise<T> => {\n    const baseUrl = await getBaseUrl();\n    const queryString = params ? `?${params.join('&')}` : '';\n    const url = `${baseUrl}/${endpoint}${queryString}`;\n    \n    const response = await fetchApi.fetch(url, {\n      method,\n      credentials: 'include',\n      headers: { 'Content-Type': 'application/json' },\n      body: body ? JSON.stringify(body) : undefined,\n    });\n\n    if (!response.ok) {\n      const errorResponse = await response.json();\n      throw new Error(errorResponse.error || `Request failed: ${response.statusText}`);\n    }\n\n    return response.json();\n  };\n\n  const buildQuestionParams = (filter?: QuestionsFilter): string[] => {\n    const params: string[] = [];\n    \n    if (filter?.sort) {\n      params.push(`sort=${filter.sort}`);\n    }\n    \n    if (filter?.order) {\n      params.push(`order=${filter.order}`);\n    }\n    \n    if (filter?.isAnswered !== undefined) {\n      params.push(`isAnswered=${filter.isAnswered}`);\n    }\n    \n    if (filter?.page !== undefined) {\n      params.push(`page=${filter.page}`);\n    }\n    \n    if (filter?.pageSize !== undefined) {\n      params.push(`pageSize=${filter.pageSize}`);\n    }\n    \n    return params;\n  };\n\n  return {\n    search: (query: string, page?: number) => {\n      const body: { query: string; page?: number } = { query };\n      if (page !== undefined) {\n        body.page = page;\n      }\n      return requestAPI<any>('search', 'POST', body);\n    },\n    getQuestions: (filter?: QuestionsFilter) => {\n      const params = buildQuestionParams(filter);\n      return requestAPI<ApiResponse<Question>>('questions', 'GET', undefined, params.length > 0 ? params : undefined);\n    },\n    getTags: (search?: string) => {\n      const params = search ? [`search=${encodeURIComponent(search)}`] : undefined;\n      return requestAPI<ApiResponse<Tag>>('tags', 'GET', undefined, params);\n    },\n    getUsers: () => requestAPI<ApiResponse<User>>('users'),\n    getMe: () => requestAPI<User>('me'),\n    getBaseUrl: async () => {\n      const response = await requestAPI<BaseUrlResponse>('baseurl');\n      return response.SOInstance;\n    },\n    getTeamName: async () => {\n      const response = await requestAPI<BaseUrlResponse>('baseurl')\n      return response.teamName\n    },\n    postQuestion: (title: string, body: string, tags: string[]) =>\n      requestAPI<Question>('questions', 'POST', { title, body, tags }),\n    startAuth: async () => {\n      const data = await requestAPI<{ authUrl: string }>('auth/start');\n      return data.authUrl;\n    },\n    completeAuth: async (code: string, state: string) => {\n      await requestAPI('callback', 'GET', undefined, [\n        `code=${encodeURIComponent(code)}`,\n        `state=${encodeURIComponent(state)}`,\n      ]);\n    },\n    getAuthStatus: async (): Promise<boolean> => {\n      try {\n        await requestAPI('authStatus');\n        return true;\n      } catch {\n        return false;\n      }\n    },\n    logout: async (): Promise<boolean> => {\n      try {\n        await requestAPI('logout', 'POST');\n        return true;\n      } catch {\n        return false;\n      }\n    },\n    submitAccessToken: async (token: string): Promise<boolean> => {\n      try {\n        await requestAPI('auth/token', 'POST', { accessToken: token });\n        return true;\n      } catch {\n        return false;\n      }\n    },\n\n    // Convenience methods for common filtering scenarios\n    getActiveQuestions: (page?: number) => {\n      const params = buildQuestionParams({ sort: 'activity', order: 'desc', page });\n      return requestAPI<ApiResponse<Question>>('questions', 'GET', undefined, params);\n    },\n\n    getNewestQuestions: (page?: number) => {\n      const params = buildQuestionParams({ sort: 'creation', order: 'desc', page });\n      return requestAPI<ApiResponse<Question>>('questions', 'GET', undefined, params);\n    },\n\n    getTopScoredQuestions: (page?: number) => {\n      const params = buildQuestionParams({ sort: 'score', order: 'desc', page });\n      return requestAPI<ApiResponse<Question>>('questions', 'GET', undefined, params);\n    },\n\n    getUnansweredQuestions: (page?: number) => {\n      const params = buildQuestionParams({ isAnswered: false, sort: 'creation', order: 'desc', page });\n      return requestAPI<ApiResponse<Question>>('questions', 'GET', undefined, params);\n    },\n  };\n};"],"names":[],"mappings":"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"}

package/dist/components/StackOverflow/StackOverflowMe.esm.js

@@ -0,0 +1,110 @@
+import { useApi } from '@backstage/core-plugin-api';
+import { stackoverflowteamsApiRef } from '../../api/StackOverflowAPI.esm.js';
+import React, { useState, useEffect } from 'react';
+import { Box, CircularProgress, Typography, Card, IconButton, CardContent, Avatar, Chip, Link } from '@mui/material';
+import { LogoutIcon } from '../../icons/LogoutIcon.esm.js';
+
+const StackOverflowMe = () => {
+  const stackOverflowTeamsApi = useApi(stackoverflowteamsApiRef);
+  const logout = async () => {
+    try {
+      const success = await stackOverflowTeamsApi.logout();
+      if (success) {
+        window.location.reload();
+      } else {
+        throw new Error("Logout failed.");
+      }
+    } catch (error2) {
+      throw new Error("Error during logout:", error2);
+    }
+  };
+  const [userData, setUserData] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  useEffect(() => {
+    const fetchMe = async () => {
+      try {
+        const data = await stackOverflowTeamsApi.getMe();
+        setUserData(data);
+      } catch (err) {
+        setError("Failed to load user data");
+      } finally {
+        setLoading(false);
+      }
+    };
+    fetchMe();
+  }, [stackOverflowTeamsApi]);
+  if (loading) {
+    return /* @__PURE__ */ React.createElement(
+      Box,
+      {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        width: "100%"
+      },
+      /* @__PURE__ */ React.createElement(CircularProgress, { color: "primary" })
+    );
+  }
+  if (error) {
+    return /* @__PURE__ */ React.createElement(
+      Box,
+      {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        width: "100%"
+      },
+      /* @__PURE__ */ React.createElement(Typography, { color: "error" }, error)
+    );
+  }
+  if (!userData) return null;
+  return /* @__PURE__ */ React.createElement(
+    Box,
+    {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      width: "100%"
+    },
+    /* @__PURE__ */ React.createElement(
+      Card,
+      {
+        variant: "outlined",
+        sx: {
+          p: 3,
+          position: "relative",
+          boxShadow: 3
+        }
+      },
+      /* @__PURE__ */ React.createElement(Box, { sx: { position: "absolute", top: 8, right: 8 } }, /* @__PURE__ */ React.createElement(
+        IconButton,
+        {
+          onClick: logout
+        },
+        /* @__PURE__ */ React.createElement(LogoutIcon, null)
+      )),
+      /* @__PURE__ */ React.createElement(CardContent, { sx: { textAlign: "center" } }, /* @__PURE__ */ React.createElement(Avatar, { src: userData.avatarUrl, sx: { mx: "auto", mb: 2 } }), /* @__PURE__ */ React.createElement(Typography, { variant: "h6", fontWeight: "bold", gutterBottom: true }, userData.name), /* @__PURE__ */ React.createElement(Box, { display: "flex", justifyContent: "center", gap: 1, mb: 1 }, /* @__PURE__ */ React.createElement(
+        Chip,
+        {
+          label: `Reputation: ${userData.reputation}`,
+          size: "small",
+          color: "primary"
+        }
+      ), /* @__PURE__ */ React.createElement(Chip, { label: userData.role, size: "small", variant: "outlined" })), userData.jobTitle && /* @__PURE__ */ React.createElement(Typography, { variant: "body2", fontWeight: "500", mt: 1 }, "Position: ", userData.jobTitle), /* @__PURE__ */ React.createElement(
+        Link,
+        {
+          href: userData.webUrl,
+          target: "_blank",
+          rel: "noopener",
+          color: "primary",
+          sx: { display: "block", mt: 2, fontWeight: "bold" }
+        },
+        "View Profile"
+      ))
+    )
+  );
+};
+
+export { StackOverflowMe };
+//# sourceMappingURL=StackOverflowMe.esm.js.map

package/dist/components/StackOverflow/StackOverflowMe.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StackOverflowMe.esm.js","sources":["../../../src/components/StackOverflow/StackOverflowMe.tsx"],"sourcesContent":["import { useApi } from '@backstage/core-plugin-api';\nimport { stackoverflowteamsApiRef, User } from '../../api';\nimport { useEffect, useState } from 'react';\nimport React from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport {\n  Box,\n  Avatar,\n  Typography,\n  Card,\n  CardContent,\n  Link,\n  CircularProgress,\n  Chip,\n  IconButton,\n} from '@mui/material';\nimport { LogoutIcon } from '../../icons';\n\nexport const StackOverflowMe = () => {\n  const stackOverflowTeamsApi = useApi(stackoverflowteamsApiRef);\n  const logout = async () => {\n    try {\n      const success = await stackOverflowTeamsApi.logout();\n      if (success) {\n        window.location.reload();\n      } else {\n        throw new Error('Logout failed.');\n      }\n    } catch (error:any) {\n      throw new Error('Error during logout:', error);\n    }\n  };\n\n  const [userData, setUserData] = useState<User | null>(null);\n  const [loading, setLoading] = useState<Boolean>(true);\n  const [error, setError] = useState<string | null>(null);\n\n  useEffect(() => {\n    const fetchMe = async () => {\n      try {\n        const data = await stackOverflowTeamsApi.getMe();\n        setUserData(data);\n      } catch (err) {\n        setError('Failed to load user data');\n      } finally {\n        setLoading(false);\n      }\n    };\n\n    fetchMe();\n  }, [stackOverflowTeamsApi]);\n\n  if (loading) {\n    return (\n      <Box\n        display=\"flex\"\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        width=\"100%\"\n      >\n        <CircularProgress color=\"primary\" />\n      </Box>\n    );\n  }\n\n  if (error) {\n    return (\n      <Box\n        display=\"flex\"\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        width=\"100%\"\n      >\n        <Typography color=\"error\">{error}</Typography>\n      </Box>\n    );\n  }\n\n  if (!userData) return null;\n\n  return (\n    <Box\n      display=\"flex\"\n      justifyContent=\"center\"\n      alignItems=\"center\"\n      width=\"100%\"\n    >\n      <Card\n        variant=\"outlined\"\n        sx={{\n          p: 3,\n          position: 'relative',\n          boxShadow: 3,\n        }}\n      >\n        {/* Logout Button */}\n        <Box sx={{ position: 'absolute', top: 8, right: 8 }}>\n        <IconButton\n          \n          onClick={logout}\n        >\n          <LogoutIcon />\n        </IconButton>\n        </Box>\n        <CardContent sx={{ textAlign: 'center' }}>\n          {/* Avatar */}\n          <Avatar src={userData.avatarUrl} sx={{ mx: 'auto', mb: 2 }} />\n\n          {/* User Details */}\n          <Typography variant=\"h6\" fontWeight=\"bold\" gutterBottom>\n            {userData.name}\n          </Typography>\n\n          <Box display=\"flex\" justifyContent=\"center\" gap={1} mb={1}>\n            <Chip\n              label={`Reputation: ${userData.reputation}`}\n              size=\"small\"\n              color=\"primary\"\n            />\n            <Chip label={userData.role} size=\"small\" variant=\"outlined\" />\n          </Box>\n\n          {userData.jobTitle && (\n            <Typography variant=\"body2\" fontWeight=\"500\" mt={1}>\n              Position: {userData.jobTitle}\n            </Typography>\n          )}\n\n          {/* Profile Link */}\n          <Link\n            href={userData.webUrl}\n            target=\"_blank\"\n            rel=\"noopener\"\n            color=\"primary\"\n            sx={{ display: 'block', mt: 2, fontWeight: 'bold' }}\n          >\n            View Profile\n          </Link>\n        </CardContent>\n      </Card>\n    </Box>\n  );\n};\n"],"names":["error"],"mappings":"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"}