Merge pull request #5292 from ethereum/desktopgitstatusfixes

Desktop git status & init fixes

apps/remix-ide/src/app/plugins/git.tsx

@@ -8,7 +8,7 @@ const profile = {
   name: 'dgit',
   displayName: 'Git',
   desciption: 'Git plugin for Remix',
-  methods: ['pull', 'track', 'diff', 'clone', 'open'],
+  methods: ['open', 'init'],
   events: [''],
   version: packageJson.version,
   maintainedBy: 'Remix',
@@ -34,6 +34,10 @@ export class GitPlugin extends ViewPlugin {
     this.emit('openPanel', panel)
   }
 
+  async init() {
+    this.emit('init')
+  }
+
   render() {
     return <div id='gitTab'><GitUI plugin={this} /></div>
   }

libs/remix-api/src/lib/plugins/dgitplugin-api.ts

@@ -0,0 +1,11 @@
+import { StatusEvents } from "@remixproject/plugin-utils"
+
+export interface IDgitPlugin {
+  events: {
+  } & StatusEvents,
+  methods: {
+      open(panel: string): Promise<void>,
+      init(): Promise<void>
+  }
+}
+

libs/remix-api/src/lib/remix-api.ts

@@ -15,9 +15,11 @@ import { ILayoutApi } from "./plugins/layout-api"
 import { IMatomoApi } from "./plugins/matomo-api"
 import { IRemixAI } from "./plugins/remixai-api"
 import { IRemixAID } from "./plugins/remixAIDesktop-api"
+import { IDgitPlugin } from "./plugins/dgitplugin-api"
 
 export interface ICustomRemixApi extends IRemixApi {
   dgitApi: IGitApi
+  dgit: IDgitPlugin
   config: IConfigApi
   notification: INotificationApi
   settings: ISettings

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

@@ -1,4 +1,4 @@
-import { GitHubUser } from '@remix-api';
+import { branch, GitHubUser } from '@remix-api';
 import { AppModal } from '../interface'
 
 type ActionMap<M extends { [index: string]: any }> = {
@@ -14,10 +14,16 @@ type ActionMap<M extends { [index: string]: any }> = {
 
 export const enum appActionTypes {
   setGitHubUser = 'SET_GITHUB_USER',
+  setCurrentBranch = 'SET_CURRENT_BRANCH',
+  setNeedsGitInit = 'SET_NEEDS_GIT_INIT',
+  setCanUseGit = 'SET_CAN_USE_GIT',
 }
 
 type AppPayload = {
-  [appActionTypes.setGitHubUser]: GitHubUser
+  [appActionTypes.setGitHubUser]: GitHubUser,
+  [appActionTypes.setCurrentBranch]: branch,
+  [appActionTypes.setNeedsGitInit]: boolean,
+  [appActionTypes.setCanUseGit]: boolean,
 }
 
 export type AppAction = ActionMap<AppPayload>[keyof ActionMap<

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

@@ -1,4 +1,4 @@
-import { GitHubUser } from '@remix-api'
+import { branch, GitHubUser } from '@remix-api'
 import { AppModalCancelTypes, ModalTypes } from '../types'
 
 export type ValidationResult = {
@@ -49,5 +49,8 @@ export interface forceChoiceModal {
 
 export interface AppState {
     gitHubUser: GitHubUser
+    currentBranch: branch
+    needsGitInit: boolean
+    canUseGit: boolean
 }
 

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

@@ -3,11 +3,29 @@ import { AppState } from "../interface";
 
 export const appReducer = (state: AppState, action: AppAction): AppState => {
   switch (action.type) {
-  case appActionTypes.setGitHubUser:{
+  case appActionTypes.setGitHubUser: {
     return {
       ...state,
       gitHubUser: action.payload
     }
   }
+  case appActionTypes.setCurrentBranch: {
+    return {
+      ...state,
+      currentBranch: action.payload
+    }
+  }
+  case appActionTypes.setNeedsGitInit: {
+    return {
+      ...state,
+      needsGitInit: action.payload
+    }
+  }
+  case appActionTypes.setCanUseGit: {
+    return {
+      ...state,
+      canUseGit: action.payload
+    }
+  }
   }
 }

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

@@ -3,4 +3,7 @@ import { AppState } from "../interface";
 
 export const appInitialState: AppState = {
   gitHubUser: {} as GitHubUser,
+  currentBranch: null,
+  needsGitInit: true,
+  canUseGit: false
 }

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

@@ -31,7 +31,7 @@ import { GitHubCredentials } from './panels/githubcredentials'
 import { Setup } from './panels/setup'
 import { Init } from './panels/init'
 import { Disabled } from './disabled'
-import { AppContext, appPlatformTypes, platformContext } from '@remix-ui/app'
+import { appActionTypes, AppContext, appPlatformTypes, platformContext } from '@remix-ui/app'
 import { Version } from './panels/version'
 
 export const gitPluginContext = React.createContext<gitState>(defaultGitState)
@@ -113,14 +113,20 @@ export const GitUI = (props: IGitUi) => {
     })
 
     let needsInit = false
-    if (!(gitState.currentBranch && gitState.currentBranch.name !== '') && gitState.currentHead === '') {
+    if (!(gitState.currentBranch && gitState.currentBranch.name !== '') && (!gitState.currentHead || gitState.currentHead === '')) {
       needsInit = true
     }
 
     setNeedsInit(needsInit)
+    appContext.appStateDispatch({ type: appActionTypes.setNeedsGitInit, payload: needsInit })
+    appContext.appStateDispatch({ type: appActionTypes.setCurrentBranch, payload: gitState.currentBranch || null })
 
   }, [gitState.gitHubUser, gitState.currentBranch, gitState.remotes, gitState.gitHubAccessToken, gitState.currentHead])
 
+  useEffect(() => {
+    appContext.appStateDispatch({ type: appActionTypes.setCanUseGit, payload: gitState.canUseApp })
+  },[gitState.canUseApp])
+
   useEffect(() => {
     const panelName = Object.keys(gitUIPanels)
       .filter(k => gitUIPanels[k] === activePanel);

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

@@ -41,7 +41,7 @@ export const setPlugin = (p: Plugin, dispatcher: React.Dispatch<gitActionDispatc
 
 export const init = async () => {
   await sendToMatomo(gitMatomoEventTypes.INIT)
-  await plugin.call('dgitApi', "init");
+  await plugin.call('dgitApi', 'init');
   dispatch(setTimestamp(Date.now()))
   await getBranches();
 }

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

@@ -3,7 +3,7 @@ import React from "react";
 import { setCanUseApp, setLoading, setRepoName, setGItHubToken, setLog, setGitHubUser, setUserEmails, setTimestamp, setDesktopWorkingDir, setVersion } from "../state/gitpayload";
 import { gitActionDispatch, gitUIPanels, storage } from "../types";
 import { Plugin } from "@remixproject/engine";
-import { getBranches, getFileStatusMatrix, loadGitHubUserFromToken, getRemotes, gitlog, setPlugin, setStorage } from "./gitactions";
+import { getBranches, getFileStatusMatrix, loadGitHubUserFromToken, getRemotes, gitlog, setPlugin, setStorage, init } from "./gitactions";
 import { Profile } from "@remixproject/plugin-utils";
 import { CustomRemixApi } from "@remix-api";
 import { statusChanged } from "./pluginActions";
@@ -200,10 +200,13 @@ export const setCallBacks = (viewPlugin: Plugin, gitDispatcher: React.Dispatch<g
   })
 
   plugin.on('dgit' as any, 'openPanel', async (panel: string) => {
-
     setAtivePanel(panel)
   })
 
+  plugin.on('dgit' as any, 'init', async () => {
+    init()
+  })
+
   callBackEnabled = true;
 }
 

libs/remix-ui/statusbar/src/lib/components/gitStatus.tsx

@@ -1,8 +1,9 @@
-import React, { useEffect, Dispatch, useState } from 'react'
+import React, { useEffect, Dispatch, useState, useContext } from 'react'
 // eslint-disable-next-line @nrwl/nx/enforce-module-boundaries
 import { StatusBar } from 'apps/remix-ide/src/app/components/status-bar'
 import '../../css/statusbar.css'
 import { CustomTooltip } from '@remix-ui/helper'
+import { AppContext } from '@remix-ui/app'
 
 export interface GitStatusProps {
   plugin: StatusBar
@@ -11,70 +12,32 @@ export interface GitStatusProps {
 }
 
 export default function GitStatus({ plugin, gitBranchName, setGitBranchName }: GitStatusProps) {
-  const [isLocalHost, setIsLocalHost] = useState(false)
+  const appContext = useContext(AppContext)
 
-  useEffect(() => {
+  const openDgit = async () => {
-    plugin.on('filePanel', 'setWorkspace', async (workspace) => {
+    plugin.verticalIcons.select('dgit')
-      const isGit = await plugin.call('fileManager', 'isGitRepo')
-      setIsLocalHost(workspace.isLocalhost)
-      if (isGit) {
-        setGitBranchName(workspace.name)
-      } else {
-        setGitBranchName('Not a git repo')
-      }
-    })
-    plugin.on('filePanel', 'workspaceInitializationCompleted', async () => {
-      const isGit = await plugin.call('fileManager', 'isGitRepo')
-      if (isGit) {
-        const workspace = localStorage.getItem('currentWorkspace')
-        setGitBranchName(workspace)
-      } else {
-        setGitBranchName('Not a git repo')
-      }
-    })
-    plugin.on('dgitApi', 'init', async () => {
-      const isGit = await plugin.call('fileManager', 'isGitRepo')
-      if (isGit) {
-        const workspace = localStorage.getItem('currentWorkspace')
-        setGitBranchName(workspace)
-      }
-    })
-
-  }, [])
-
-  const lightDgitUp = async () => {
-    const isActive = await plugin.call('manager', 'isActive', 'dgit')
-    const isGit = await plugin.call('fileManager', 'isGitRepo')
-    if (!isActive) await plugin.call('manager', 'activatePlugin', 'dgit')
-    if (gitBranchName.length > 0 && isGit) {
-      plugin.verticalIcons.select('dgit')
-    }
   }
 
   const initializeNewGitRepo = async () => {
-    if (isLocalHost === false) {
+    await plugin.call('dgit', 'init')
-      const isActive = await plugin.call('manager', 'isActive', 'dgit')
+    await plugin.call('matomo', 'track', ['trackEvent', 'statusBar', 'initNewRepo']);
-      if (!isActive) await plugin.call('manager', 'activatePlugin', 'dgit')
-      await plugin.call('dgitApi', 'init')
-      ;(window as any)._paq.push('trackEvent', 'statusbar', 'initNewRepo')
-    }
   }
 
-  const checkBranchName = ()=> {
+  if (!appContext.appState.canUseGit) return null
-    return gitBranchName && gitBranchName !== 'Not a git repo' && gitBranchName.length > 0
+
-  }
   return (
     <CustomTooltip
-      tooltipText={`${gitBranchName === 'Not a git repo' ? 'Initialize as a git repo' : gitBranchName} (Git)`}
+      tooltipText={`${appContext.appState.needsGitInit ? 'Initialize as git repo' : 'Current branch: ' + appContext.appState.currentBranch.name}`}
     >
       <div
         className="d-flex flex-row pl-3 small text-white justify-content-center align-items-center remixui_statusbar_gitstatus"
-        onClick={async () => await lightDgitUp()}
+        onClick={async () => await openDgit()}
       >
-        {checkBranchName() && isLocalHost === false ? <span className="fa-regular fa-code-branch ml-1"></span>
+        {!appContext.appState.needsGitInit ? <span className="fa-regular fa-code-branch ml-1"></span>
-          : <span className=" ml-1" onClick={initializeNewGitRepo}> Initialize as git repo</span>}
+          : <span className=" ml-1" onClick={initializeNewGitRepo}>Initialize as git repo</span>}
-        {checkBranchName() && isLocalHost === false && <span className="ml-1">{gitBranchName}</span>}
+        {!appContext.appState.needsGitInit && appContext.appState.currentBranch &&
-        {checkBranchName() && isLocalHost === false && <span className="fa-solid fa-arrows-rotate fa-1 ml-1"></span>}
+          <span onClick={async () => await openDgit()} className="ml-1">{appContext.appState.currentBranch.name}</span>
+        }
       </div>
     </CustomTooltip>
   )

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

@@ -167,7 +167,7 @@ export const createWorkspace = async (
           // commit the template as first commit
           plugin.call('notification', 'toast', 'Creating initial git commit ...')
 
-          await dgitPlugin.call('dgitApi', 'init')
+          await dgitPlugin.call('dgit', 'init')
           if (!isEmpty) await loadWorkspacePreset(workspaceTemplateName, opts)
           const status = await dgitPlugin.call('dgitApi', 'status', { ref: 'HEAD' })
 

libs/remix-ui/workspace/src/lib/components/file-explorer.tsx

@@ -584,7 +584,7 @@ export const FileExplorer = (props: FileExplorerProps) => {
   const handleGitInit = async () => {
     const isActive = await plugin.call('manager', 'isActive', 'dgit')
     if (!isActive) await plugin.call('manager', 'activatePlugin', 'dgit')
-    await plugin.call('dgitApi', 'init')
+    await plugin.call('dgit', 'init')
   }
 
   return (