diff --git a/frontend/app/components/Session/Player/MobilePlayer/MobilePlayerSubheader.tsx b/frontend/app/components/Session/Player/MobilePlayer/MobilePlayerSubheader.tsx index 853fd1184..fbb95f28a 100644 --- a/frontend/app/components/Session/Player/MobilePlayer/MobilePlayerSubheader.tsx +++ b/frontend/app/components/Session/Player/MobilePlayer/MobilePlayerSubheader.tsx @@ -9,12 +9,14 @@ import { Tag } from 'antd' import { ShareAltOutlined } from '@ant-design/icons'; import { Button as AntButton, Popover } from 'antd'; import SharePopup from 'Components/shared/SharePopup/SharePopup'; +import { useStore } from "App/mstore"; function SubHeader(props: any) { + const { issueReportingStore } = useStore() + const integrations = issueReportingStore.list const enabledIntegration = useMemo(() => { - const { integrations } = props; - if (!integrations || !integrations.size) { + if (!integrations || !integrations.length) { return false; } @@ -57,7 +59,6 @@ function SubHeader(props: any) { export default connect((state: any) => ({ siteId: state.getIn(['site', 'siteId']), - integrations: state.getIn(['issues', 'list']), modules: state.getIn(['user', 'account', 'modules']) || [], isIOS: state.getIn(['sessions', 'current']).platform === 'ios', }))(observer(SubHeader)); diff --git a/frontend/app/components/Session/Player/MobilePlayer/PlayerBlock.tsx b/frontend/app/components/Session/Player/MobilePlayer/PlayerBlock.tsx index d2e7e3f45..424a1631b 100644 --- a/frontend/app/components/Session/Player/MobilePlayer/PlayerBlock.tsx +++ b/frontend/app/components/Session/Player/MobilePlayer/PlayerBlock.tsx @@ -20,11 +20,11 @@ function PlayerBlock(props: IProps) { const { sessionId, activeTab, - jiraConfig, fullView = false, setActiveTab, } = props; - const { uiPlayerStore } = useStore(); + const { uiPlayerStore, issueReportingStore } = useStore(); + const jiraConfig = issueReportingStore.list[0] const fullscreen = uiPlayerStore.fullscreen; const shouldShowSubHeader = !fullscreen && !fullView return ( @@ -45,5 +45,4 @@ function PlayerBlock(props: IProps) { export default connect((state: any) => ({ sessionId: state.getIn(['sessions', 'current']).sessionId, - jiraConfig: state.getIn(['issues', 'list'])[0], }))(observer(PlayerBlock)) \ No newline at end of file diff --git a/frontend/app/components/Session/Player/ReplayPlayer/PlayerBlock.tsx b/frontend/app/components/Session/Player/ReplayPlayer/PlayerBlock.tsx index c424d7a47..e92b6e4c3 100644 --- a/frontend/app/components/Session/Player/ReplayPlayer/PlayerBlock.tsx +++ b/frontend/app/components/Session/Player/ReplayPlayer/PlayerBlock.tsx @@ -21,11 +21,11 @@ function PlayerBlock(props: IProps) { const { sessionId, activeTab, - jiraConfig, fullView = false, setActiveTab, } = props; - const { uiPlayerStore } = useStore(); + const { uiPlayerStore, issueReportingStore } = useStore(); + const jiraConfig = issueReportingStore.list[0] const fullscreen = uiPlayerStore.fullscreen; const shouldShowSubHeader = !fullscreen && !fullView; return ( @@ -46,5 +46,4 @@ function PlayerBlock(props: IProps) { export default connect((state: Record) => ({ sessionId: state.getIn(['sessions', 'current']).sessionId, - jiraConfig: state.getIn(['issues', 'list'])[0], }))(observer(PlayerBlock)); diff --git a/frontend/app/components/Session_/Issues/IssueForm.js b/frontend/app/components/Session_/Issues/IssueForm.js index d9ec41e39..f83e6b79a 100644 --- a/frontend/app/components/Session_/Issues/IssueForm.js +++ b/frontend/app/components/Session_/Issues/IssueForm.js @@ -30,7 +30,6 @@ function IssueForm(props) { const edit = issueReportingStore.editInstance; const fetchMeta = issueReportingStore.fetchMeta; - console.log(users, instance, projects, issueTypes) React.useEffect(() => { init({ projectId: projects[0] ? projects[0].id : '', @@ -56,6 +55,7 @@ function IssueForm(props) { const { errors } = props; if (!errors || errors.length === 0) { init({ projectId: instance?.projectId }); + void issueReportingStore.fetchList(sessionId); closeHandler(); } }); diff --git a/frontend/app/components/Session_/Issues/Issues.js b/frontend/app/components/Session_/Issues/Issues.js index 29eb3bd78..e85e5d43f 100644 --- a/frontend/app/components/Session_/Issues/Issues.js +++ b/frontend/app/components/Session_/Issues/Issues.js @@ -3,11 +3,11 @@ import { observer } from 'mobx-react-lite'; import React from 'react'; import { useStore } from 'App/mstore'; import { Icon, Popover } from 'UI'; -import { connect } from 'react-redux'; import IssuesModal from './IssuesModal'; function Issues(props) { const { issueReportingStore } = useStore(); + const issuesIntegration = issueReportingStore.list const handleOpen = () => { issueReportingStore.init(); @@ -20,10 +20,8 @@ function Issues(props) { } }; - const { sessionId, issuesIntegration } = props; + const { sessionId } = props; const provider = issuesIntegration[0]?.provider || ''; - - console.log(provider, sessionId, issuesIntegration) return ( ({ - issuesIntegration: state.getIn(['issues', 'list']) || {}, - issuesFetched: state.getIn(['issues', 'issuesFetched']), -}))(observer(Issues)); +export default observer(Issues); diff --git a/frontend/app/components/Session_/Subheader.js b/frontend/app/components/Session_/Subheader.js index a7fa9a45f..a404c4d6d 100644 --- a/frontend/app/components/Session_/Subheader.js +++ b/frontend/app/components/Session_/Subheader.js @@ -28,9 +28,9 @@ function SubHeader(props) { const { store } = React.useContext(PlayerContext); const { location: currentLocation = 'loading...' } = store.get(); const hasIframe = localStorage.getItem(IFRAME) === 'true'; - const { uxtestingStore } = useStore(); + const { uxtestingStore, issueReportingStore } = useStore(); const [hideTools, setHideTools] = React.useState(false); - + const integrations = issueReportingStore.list; React.useEffect(() => { const hideDevtools = checkParam('hideTools'); if (hideDevtools) { @@ -39,7 +39,6 @@ function SubHeader(props) { }, []); const enabledIntegration = useMemo(() => { - const { integrations } = props; if (!integrations || !integrations.size) { return false; } @@ -157,6 +156,5 @@ function SubHeader(props) { export default connect((state) => ({ siteId: state.getIn(['site', 'siteId']), - integrations: state.getIn(['issues', 'list']), modules: state.getIn(['user', 'account', 'modules']) || [] }))(observer(SubHeader)); diff --git a/frontend/app/duck/issues.js b/frontend/app/duck/issues.js deleted file mode 100644 index 1eb80c9c6..000000000 --- a/frontend/app/duck/issues.js +++ /dev/null @@ -1,115 +0,0 @@ -import ReportedIssue from 'Types/session/assignment'; -import Activity from 'Types/session/activity'; -import { List, Map, Set } from 'immutable'; -import withRequestState, { RequestTypes } from 'Duck/requestStateCreator'; -import { createListUpdater } from './funcTools/tools'; -import { editType, initType } from './funcTools/crud/types'; -import { createInit, createEdit } from './funcTools/crud'; - -const idKey = 'id'; -const name = 'assignment'; -const listUpdater = createListUpdater(idKey); - -const FETCH_ASSIGNMENTS = new RequestTypes('asignment/FETCH_ASSIGNMENTS'); -const FETCH_ISSUE = new RequestTypes('asignment/FETCH_ISSUE'); -const FETCH_PROJECTS = new RequestTypes('asignment/FETCH_PROJECTS'); -const FETCH_META = new RequestTypes('asignment/FETCH_META'); -const ADD_ACTIVITY = new RequestTypes('asignment/ADD_ACTIVITY'); -const ADD_MESSAGE = new RequestTypes('asignment/ADD_MESSAGE'); -const EDIT = editType(name); -const INIT = initType(name); -const RESET_ACTIVE_ISSUE = 'assignment/RESET_ACTIVE_ISSUE'; - -const initialState = Map({ - list: List(), - instance: new ReportedIssue(), - activeIssue: new ReportedIssue(), - issueTypes: List(), - issueTypeIcons: Set(), - users: List(), - projects: List() -}); - -let issueTypes = []; - -const reducer = (state = initialState, action = {}) => { - const users = state.get('users'); - switch (action.type) { - case FETCH_PROJECTS.SUCCESS: - return state.set('projects', List(action.data)); - case FETCH_ASSIGNMENTS.SUCCESS: - return state.set('list', action.data.map(as => new ReportedIssue(as))); - case ADD_ACTIVITY.SUCCESS: - const instance = new ReportedIssue(action.data); - return listUpdater(state, instance); - case FETCH_META.SUCCESS: - issueTypes = action.data.issueTypes; - var issueTypeIcons = {} - for (var i =0; i < issueTypes.length; i++) { - issueTypeIcons[issueTypes[i].id] = issueTypes[i].iconUrl - } - return state.set('issueTypes', List(issueTypes)) - .set('users', List(action.data.users)) - .set('issueTypeIcons', issueTypeIcons) - case FETCH_ISSUE.SUCCESS: - return state.set('activeIssue', new ReportedIssue({ ...action.data, users})); - case RESET_ACTIVE_ISSUE: - return state.set('activeIssue', new ReportedIssue()); - case ADD_MESSAGE.SUCCESS: - const user = users.filter(user => user.id === action.data.author).first(); - const activity = new Activity({ type: 'message', user, ...action.data,}); - return state.updateIn([ 'activeIssue', 'activities' ], list => list.push(activity)); - case INIT: - action.instance.issueType = issueTypes.length > 0 ? issueTypes[0].id : ''; - return state.set('instance', new ReportedIssue(action.instance)); - case EDIT: - return state.mergeIn([ 'instance' ], action.instance); - default: - return state; - } -}; - -export default withRequestState({ - fetchListRequest: FETCH_ASSIGNMENTS, - addActivityRequest: ADD_ACTIVITY, - fetchIssueRequest: FETCH_ISSUE, - addMessageRequest: ADD_MESSAGE, - fetchProjectsRequest: FETCH_PROJECTS -}, reducer); - -export const init = createInit(name); -export const edit = createEdit(name); - -export function resetActiveIsue() { - return { - type: RESET_ACTIVE_ISSUE - } -} - -export function fetchProjects() { - return { - types: FETCH_PROJECTS.toArray(), - call: client => client.get(`/integrations/issues/list_projects`) - } -} - -export function fetchMeta(projectId) { - return { - types: FETCH_META.toArray(), - call: client => client.get(`/integrations/issues/${projectId}`) - } -} - -export function addActivity(sessionId, params) { - return { - types: ADD_ACTIVITY.toArray(), - call: client => client.post(`/sessions/${ sessionId }/assign`, params.toCreate()), - } -} - -export function addMessage(sessionId, assignmentId, params) { - return { - types: ADD_MESSAGE.toArray(), - call: client => client.post(`/sessions/${ sessionId }/assign/${ assignmentId }/comment`, params), - } -} diff --git a/frontend/app/mstore/issueReportingStore.ts b/frontend/app/mstore/issueReportingStore.ts index ba8aee1db..b104548e1 100644 --- a/frontend/app/mstore/issueReportingStore.ts +++ b/frontend/app/mstore/issueReportingStore.ts @@ -5,9 +5,11 @@ import { issueReportsService } from "App/services"; export default class issueReportingStore { instance: ReportedIssue issueTypes: any[] = [] + list: any[] = [] issueTypeIcons: {} users: any[] = [] projects: any[] = [] + issuesFetched = false projectsFetched = false projectsLoading = false metaLoading = false @@ -29,6 +31,11 @@ export default class issueReportingStore { this.instance = new ReportedIssue({ ...inst, ...data }) } + setList = (list: any[]) => { + this.list = list; + this.issuesFetched = true + } + setProjects = (projects: any[]) => { this.projectsFetched = true; this.projects = projects; @@ -87,4 +94,13 @@ export default class issueReportingStore { this.createLoading = false; } } + + fetchList = async (sessionId: string) => { + try { + const { data } = await issueReportsService.fetchIssueIntegrations(sessionId); + this.setList(data); + } catch (e) { + console.error(e) + } + } } \ No newline at end of file diff --git a/frontend/app/services/IssueReportsService.ts b/frontend/app/services/IssueReportsService.ts index 4d6ef23f0..505a7bf8a 100644 --- a/frontend/app/services/IssueReportsService.ts +++ b/frontend/app/services/IssueReportsService.ts @@ -7,7 +7,7 @@ export default class IssueReportsService extends BaseService { return await r.json(); } - fetchMeta = async (projectId: number) => { + fetchMeta = async (projectId?: number) => { const r = await this.client.get(`/integrations/issues/${projectId}`) return await r.json(); @@ -18,4 +18,10 @@ export default class IssueReportsService extends BaseService { return await r.json(); } + + fetchIssueIntegrations = async (sessionId: string) => { + const r = await this.client.get(`/sessions/${ sessionId }/assign`) + + return await r.json(); + } } \ No newline at end of file