refactor

libs/remix-ui/app/src/lib/remix-app/actions/app.ts

@@ -0,0 +1,25 @@
+import { GitHubUser } from '@remix-ui/git';
+import { AppModal } from '../interface'
+
+type ActionMap<M extends { [index: string]: any }> = {
+    [Key in keyof M]: M[Key] extends undefined
+      ? {
+          type: Key;
+        }
+      : {
+          type: Key;
+          payload: M[Key];
+        }
+}
+
+export const enum appActionTypes {
+  setGitHubUser = 'SET_GITHUB_USER',
+}
+
+type AppPayload = {
+  [appActionTypes.setGitHubUser]: GitHubUser
+}
+
+export type AppAction = ActionMap<AppPayload>[keyof ActionMap<
+  AppPayload
+>]

libs/remix-ui/app/src/lib/remix-app/context/context.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
-import { AlertModal, AppModal } from '../interface'
+import { AlertModal, AppModal, AppState } from '../interface'
 import { ModalInitialState } from '../state/modals'
+import { AppAction } from '../actions/app'
 
 export type appProviderContextType = {
   settings: any,
@@ -8,6 +9,8 @@ export type appProviderContextType = {
   showEnter: boolean,
   appManager: any
   modal: any
+  appState: AppState
+  appStateDispatch: React.Dispatch<AppAction>
 }
 
 export enum appPlatformTypes {

libs/remix-ui/app/src/lib/remix-app/interface/index.ts

@@ -1,3 +1,4 @@
+import { GitHubUser } from '@remix-ui/git'
 import { ModalTypes } from '../types'
 
 export type ValidationResult = {
@@ -45,3 +46,7 @@ export interface forceChoiceModal {
   message: string | JSX.Element,
 }
 
+export interface AppState {
+    gitHubUser: GitHubUser
+}
+

libs/remix-ui/app/src/lib/remix-app/reducer/app.ts

@@ -0,0 +1,13 @@
+import { AppAction, appActionTypes } from "../actions/app";
+import { AppState } from "../interface";
+
+export const appReducer = (state: AppState, action: AppAction): AppState => {
+    switch (action.type) {
+        case appActionTypes.setGitHubUser:{
+            return {
+                ...state,
+                gitHubUser: action.payload
+            }
+        }
+    }
+}

libs/remix-ui/app/src/lib/remix-app/remix-app.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react'
+import React, { useEffect, useReducer, useRef, useState } from 'react'
 import './style/remix-app.css'
 import { RemixUIMainPanel } from '@remix-ui/panel'
 import MatomoDialog from './components/modals/matomo'
@@ -12,6 +12,9 @@ import { appProviderContextType, onLineContext, platformContext } from './contex
 import { FormattedMessage, IntlProvider } from 'react-intl'
 import { CustomTooltip } from '@remix-ui/helper'
 import { UsageTypes } from './types'
+import { AppState } from './interface'
+import { appReducer } from './reducer/app'
+import { appInitialState } from './state/app'
 
 declare global {
   interface Window {
@@ -40,6 +43,8 @@ const RemixApp = (props: IRemixAppUi) => {
   const sidePanelRef = useRef(null)
   const pinnedPanelRef = useRef(null)
 
+  const [appState, appStateDispatch] = useReducer(appReducer, appInitialState)
+
   useEffect(() => {
     async function activateApp() {
       props.app.themeModule.initTheme(() => {
@@ -133,7 +138,9 @@ const RemixApp = (props: IRemixAppUi) => {
     showMatamo: props.app.showMatamo,
     appManager: props.app.appManager,
     showEnter: props.app.showEnter,
-    modal: props.app.notification
+    modal: props.app.notification,
+    appState: appState,
+    appStateDispatch: appStateDispatch
   }
 
   const handleUserChosenType = async (type) => {

libs/remix-ui/app/src/lib/remix-app/state/app.ts

@@ -0,0 +1,6 @@
+import { GitHubUser } from "@remix-ui/git";
+import { AppState } from "../interface";
+
+export const appInitialState: AppState = {
+    gitHubUser: {} as GitHubUser,
+}

libs/remix-ui/git/src/components/gitui.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useReducer, useState } from 'react'
+import React, { useContext, useEffect, useReducer, useState } from 'react'
 import { add, addall, checkout, checkoutfile, clone, commit, createBranch, remoteBranches, repositories, rm, getCommitChanges, diff, resolveRef, getBranchCommits, setUpstreamRemote, loadGitHubUserFromToken, getBranches, getRemotes, remoteCommits, saveGitHubCredentials, getGitHubCredentialsFromLocalStorage, fetch, pull, push, setDefaultRemote, addRemote, removeRemote, sendToGitLog, clearGitLog, getBranchDifferences, getFileStatusMatrix, init, showAlert, gitlog } from '../lib/gitactions'
 import { loadFiles, setCallBacks } from '../lib/listeners'
 import { openDiff, openFile, saveToken, sendToMatomo, setModifiedDecorator, setPlugin, setUntrackedDecorator, statusChanged, disconnectFromGithub, logInGitHub } from '../lib/pluginActions'
@@ -32,6 +32,7 @@ import { Setup } from './panels/setup'
 import { Init } from './panels/init'
 import { Disabled } from './disabled'
 import { IGitUi } from '../types'
+import { AppContext } from '@remix-ui/app'
 export const gitPluginContext = React.createContext<gitState>(defaultGitState)
 export const loaderContext = React.createContext<loaderState>(defaultLoaderState)
 
@@ -43,6 +44,7 @@ export const GitUI = (props: IGitUi) => {
   const [setup, setSetup] = useState<boolean>(false)
   const [needsInit, setNeedsInit] = useState<boolean>(true)
   const [appLoaded, setAppLoaded] = useState<boolean>(false)
+  const appContext = useContext(AppContext)
 
   useEffect(() => {
     plugin.emit('statusChanged', {
@@ -50,15 +52,11 @@ export const GitUI = (props: IGitUi) => {
       type: 'info',
       title: 'Loading Git Plugin'
     })
-    setTimeout(() => {
-      setAppLoaded(true)
-      plugin.on('filePanel', 'requestGitHubSignIn' as any, () => setActivePanel('7'))
-    }, 2000)
   }, [])
 
   useEffect(() => {
     if (!appLoaded) return
-    setCallBacks(plugin, gitDispatch, loaderDispatch, setActivePanel)
+    setCallBacks(plugin, gitDispatch, appContext.appStateDispatch, loaderDispatch, setActivePanel)
     setPlugin(plugin, gitDispatch, loaderDispatch)
     loaderDispatch({ type: 'plugin', payload: true })
 

libs/remix-ui/git/src/lib/gitactions.ts

@@ -8,6 +8,8 @@ import { ModalTypes } from "@remix-ui/app";
 import { sendToMatomo, setFileDecorators } from "./pluginActions";
 import { Plugin } from "@remixproject/engine";
 import { CustomRemixApi } from "@remix-api";
+import { AppAction, appActionTypes } from "libs/remix-ui/app/src/lib/remix-app/actions/app";
+import { app } from "electron";
 
 export const fileStatuses = [
   ["new,untracked", 0, 2, 0], // new, untracked
@@ -31,11 +33,12 @@ const statusmatrix: statusMatrixType[] = fileStatuses.map((x: any) => {
   };
 });
 
-let plugin: Plugin<any, CustomRemixApi>, dispatch: React.Dispatch<gitActionDispatch>
+let plugin: Plugin<any, CustomRemixApi>, dispatch: React.Dispatch<gitActionDispatch>, appDispatcher: React.Dispatch<AppAction>
 
-export const setPlugin = (p: Plugin, dispatcher: React.Dispatch<gitActionDispatch>) => {
+export const setPlugin = (p: Plugin, dispatcher: React.Dispatch<gitActionDispatch>, appDispatch: React.Dispatch<AppAction>) => {
   plugin = p
   dispatch = dispatcher
+  appDispatcher = appDispatch
 }
 
 export const init = async () => {
@@ -572,6 +575,7 @@ export const saveGitHubCredentials = async (credentials: { username: string, ema
       dispatch(setGitHubUser({
         login: credentials.username,
       }))
+      appDispatcher({ type: appActionTypes.setGitHubUser, payload: { login: credentials.username } })
       dispatch(setUserEmails([{
         email: credentials.email,
         primary: true,
@@ -631,6 +635,7 @@ export const loadGitHubUserFromToken = async () => {
         if (data.user && data.user.login && (storedUsername !== data.user.login)) await plugin.call('config', 'setAppParameter', 'settings/github-user-name', data.user.login)
 
         dispatch(setGitHubUser(data.user))
+        appDispatcher({ type: appActionTypes.setGitHubUser, payload: data.user })
         dispatch(setScopes(data.scopes))
         dispatch(setUserEmails(data.emails))
         sendToGitLog({
@@ -646,6 +651,7 @@ export const loadGitHubUserFromToken = async () => {
           message: `Please check your GitHub token in the GitHub settings.`
         })
         dispatch(setGitHubUser(null))
+        appDispatcher({ type: appActionTypes.setGitHubUser, payload: null })
         return false
       }
     } else {
@@ -654,6 +660,7 @@ export const loadGitHubUserFromToken = async () => {
         message: `Please check your GitHub token in the GitHub settings.`
       })
       dispatch(setGitHubUser(null))
+      appDispatcher({ type: appActionTypes.setGitHubUser, payload: null })
       return false
     }
   } catch (e) {

libs/remix-ui/git/src/lib/listeners.ts

@@ -7,6 +7,7 @@ import { getBranches, getFileStatusMatrix, loadGitHubUserFromToken, getRemotes,
 import { Profile } from "@remixproject/plugin-utils";
 import { CustomRemixApi } from "@remix-api";
 import { statusChanged } from "./pluginActions";
+import { AppAction } from "libs/remix-ui/app/src/lib/remix-app/actions/app";
 
 let plugin: Plugin<any, CustomRemixApi>, gitDispatch: React.Dispatch<gitActionDispatch>, loaderDispatch: React.Dispatch<any>, loadFileQueue: AsyncDebouncedQueue
 let callBackEnabled: boolean = false
@@ -34,13 +35,13 @@ class AsyncDebouncedQueue {
   }
 }
 
-export const setCallBacks = (viewPlugin: Plugin, gitDispatcher: React.Dispatch<gitActionDispatch>, loaderDispatcher: React.Dispatch<any>, setAtivePanel: React.Dispatch<React.SetStateAction<string>>) => {
+export const setCallBacks = (viewPlugin: Plugin, gitDispatcher: React.Dispatch<gitActionDispatch>, appDispatcher: React.Dispatch<AppAction>, loaderDispatcher: React.Dispatch<any>, setAtivePanel: React.Dispatch<React.SetStateAction<string>>) => {
   plugin = viewPlugin
   gitDispatch = gitDispatcher
   loaderDispatch = loaderDispatcher
   loadFileQueue = new AsyncDebouncedQueue()
 
-  setPlugin(viewPlugin, gitDispatcher)
+  setPlugin(viewPlugin, gitDispatcher, appDispatcher)
 
   plugin.on("fileManager", "fileSaved", async (file: string) => {
     loadFileQueue.enqueue(async () => {

libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx

@@ -14,10 +14,10 @@ import { MenuItems, WorkSpaceState, WorkspaceMetadata } from './types'
 import { contextMenuActions } from './utils'
 import FileExplorerContextMenu from './components/file-explorer-context-menu'
 import { customAction } from '@remixproject/plugin-api'
-import { appPlatformTypes, platformContext } from '@remix-ui/app'
+import { AppContext, appPlatformTypes, platformContext } from '@remix-ui/app'
 import { ElectronMenu } from './components/electron-menu'
 import { ElectronWorkspaceName } from './components/electron-workspace-name'
-import { branch, GitHubUser, userEmails } from '@remix-ui/git'
+import { branch, GitHubUser, gitUIPanels, userEmails } from '@remix-ui/git'
 
 const _paq = (window._paq = window._paq || [])
 
@@ -49,6 +49,8 @@ export function Workspace() {
 
   const [canPaste, setCanPaste] = useState(false)
 
+  const appContext = useContext(AppContext)
+
   const [state, setState] = useState<WorkSpaceState>({
     ctrlKey: false,
     cutShortcut: false,
@@ -73,34 +75,10 @@ export function Workspace() {
     reservedKeywords: [ROOT_PATH],
     copyElement: [],
     dragStatus: false,
-    loggedInGithub: false,
-    githubUser: null
   })
 
   useEffect(() => {
-    const run = async () => {
-      const token = await global.plugin.call('config' as any, 'getAppParameter' as any, 'settings/gist-access-token')
-      const data: {
-        user: GitHubUser,
-        scopes: string[]
-        emails: userEmails
-      } = await global.plugin.call('dgitApi' as any, 'getGitHubUser', { token });
-
-      if (data.user) {
-        setState((prevState) => {
-          return { ...prevState, loggedInGithub: true, githubUser: data.user }
-        })
-      }
-    }
-    global.plugin.on('dgit', 'disconnectFromGithubRequest', () => {
-      setState((prevState) => {
-        return { ...prevState, loggedInGithub: false, githubUser: null }
-      })
-    })
-    global.plugin.on('dgit', 'loggedInGithubChanged', () => {
-      run()
-    })
-    run()
+
   }, [])
 
   useEffect(() => {
@@ -916,9 +894,8 @@ export function Workspace() {
   }
 
   const logInGithub = async () => {
-    await global.plugin.call('manager', 'activatePlugin', 'dgit')
     await global.plugin.call('menuicons', 'select', 'dgit');
-    await global.plugin.emit('requestGitHubSignIn');
+    await global.plugin.call('dgit', 'open', gitUIPanels.GITHUB)
     _paq.push(['trackEvent', 'Workspace', 'GIT', 'login'])
   }
 
@@ -994,7 +971,7 @@ export function Workspace() {
                     </span>
                     <span className="d-flex">
                       {
-                        !state.loggedInGithub && <CustomTooltip
+                        !appContext.appState.gitHubUser && <CustomTooltip
                           placement="right"
                           tooltipId="githubNotLogged"
                           tooltipClasses="text-nowrap"
@@ -1007,13 +984,13 @@ export function Workspace() {
                         </CustomTooltip>
                       }
                       {
-                        state.loggedInGithub && <CustomTooltip
+                        appContext.appState.gitHubUser && <CustomTooltip
                           placement="right"
                           tooltipId="githubLoggedIn"
                           tooltipClasses="text-nowrap"
-                          tooltipText={state.githubUser && intl.formatMessage({ id: 'filePanel.gitHubLoggedAs' }, { githubuser: state.githubUser.login }) || ''}
+                          tooltipText={appContext.appState.gitHubUser && intl.formatMessage({ id: 'filePanel.gitHubLoggedAs' }, { githubuser: appContext.appState.gitHubUser.login }) || ''}
                         >
-                          <img width={20} height={20} data-id={`connected-img-${state.githubUser && state.githubUser.login}`} src={state.githubUser && state.githubUser.avatar_url} className="remixui_avatar_user ml-2" />
+                          <img width={20} height={20} data-id={`connected-img-${appContext.appState.gitHubUser && appContext.appState.gitHubUser.login}`} src={appContext.appState.gitHubUser && appContext.appState.gitHubUser.avatar_url} className="remixui_avatar_user ml-2" />
                         </CustomTooltip>
                       }
                     </span>

libs/remix-ui/workspace/src/lib/types/index.ts

@@ -241,8 +241,6 @@ export interface WorkSpaceState {
     reservedKeywords: string[]
     copyElement: CopyElementType[]
     dragStatus: boolean
-    loggedInGithub: boolean
-    githubUser: GitHubUser
 }
 
 export type FileFocusContextType = {