update git statusbar section

pull/5370/head
Joseph Izang 6 months ago
parent d071594506
commit 7da3e6dd30
  1. 7
      apps/remix-ide/src/app/panels/file-panel.js
  2. 2
      libs/remix-ui/app/src/lib/remix-app/remix-app.tsx
  3. 12
      libs/remix-ui/statusbar/src/lib/components/gitStatus.tsx
  4. 62
      libs/remix-ui/statusbar/src/lib/remixui-statusbar-panel.tsx
  5. 1
      libs/remix-ui/statusbar/src/lib/types/index.ts

@ -34,6 +34,7 @@ const profile = {
methods: [ methods: [
'createNewFile', 'createNewFile',
'uploadFile', 'uploadFile',
'echoCall',
'getCurrentWorkspace', 'getCurrentWorkspace',
'getAvailableWorkspaceName', 'getAvailableWorkspaceName',
'getWorkspaces', 'getWorkspaces',
@ -103,6 +104,11 @@ module.exports = class Filepanel extends ViewPlugin {
}) })
} }
echoCall(args) {
console.log('echoCall', args)
return args
}
/** /**
* @param item { id: string, name: string, type?: string[], path?: string[], extension?: string[], pattern?: string[] } * @param item { id: string, name: string, type?: string[], path?: string[], extension?: string[], pattern?: string[] }
* typically: * typically:
@ -147,6 +153,7 @@ module.exports = class Filepanel extends ViewPlugin {
} }
getCurrentWorkspace() { getCurrentWorkspace() {
console.log('getCurrentWorkspace', this.currentWorkspaceMetadata)
return this.currentWorkspaceMetadata return this.currentWorkspaceMetadata
} }

@ -168,7 +168,7 @@ const RemixApp = (props: IRemixAppUi) => {
} }
} }
console.log('statusbar', props.app.statusBar)
return ( return (
//@ts-ignore //@ts-ignore
<IntlProvider locale={locale.code} messages={locale.messages}> <IntlProvider locale={locale.code} messages={locale.messages}>

@ -1,11 +1,15 @@
import React from 'react' import React, { useState } from 'react'
export interface GitStatusProps {
workspaceName: string
}
export default function GitStatus({ workspaceName }: GitStatusProps) {
//use placeholder data to show the small section of the statusbar for git
export default function GitStatus() {
return ( return (
<div className="d-flex flex-row p-1 text-white justify-content-center align-items-center"> <div className="d-flex flex-row p-1 text-white justify-content-center align-items-center">
<span className="fa-regular fa-code-branch ml-1"></span> <span className="fa-regular fa-code-branch ml-1"></span>
<span className="small mx-1">dev-updates</span> <span className="small mx-1">{`${workspaceName}`}</span>
<span className="fa-solid fa-arrows-rotate fa-1"></span> <span className="fa-solid fa-arrows-rotate fa-1"></span>
</div> </div>
) )

@ -6,6 +6,7 @@ import ScamAlertStatus from './components/scamAlertStatus'
import ScamDetails from './components/scamDetails' import ScamDetails from './components/scamDetails'
import { FloatingFocusManager, autoUpdate, flip, offset, shift, useClick, useDismiss, useFloating, useInteractions, useRole } from '@floating-ui/react' import { FloatingFocusManager, autoUpdate, flip, offset, shift, useClick, useDismiss, useFloating, useInteractions, useRole } from '@floating-ui/react'
import axios from 'axios' import axios from 'axios'
import { get } from 'lodash'
export interface RemixUIStatusBarProps { export interface RemixUIStatusBarProps {
statusBarPlugin: StatusBarInterface statusBarPlugin: StatusBarInterface
@ -16,27 +17,27 @@ export type ScamAlert = {
url: string url: string
} }
type GetCurrentWorkspace =
{
name: string
isLocalhost: boolean
absolutePath: string
}
export function RemixUIStatusBar({ statusBarPlugin }: RemixUIStatusBarProps) { export function RemixUIStatusBar({ statusBarPlugin }: RemixUIStatusBarProps) {
const [showScamDetails, setShowScamDetails] = useState(false) const [showScamDetails, setShowScamDetails] = useState(false)
const [scamAlerts, setScamAlerts] = useState<ScamAlert[]>([]) const [scamAlerts, setScamAlerts] = useState<ScamAlert[]>([])
const [workspaceName, setWorkspaceName] = useState('')
const { refs, context, floatingStyles } = useFloating({ const { refs, context, floatingStyles } = useFloating({
open: showScamDetails, open: showScamDetails,
onOpenChange: setShowScamDetails, onOpenChange: setShowScamDetails,
middleware: [ middleware: [offset(10), flip({ fallbackAxisSideDirection: 'end' }), shift()],
offset(10), whileElementsMounted: autoUpdate,
flip({ fallbackAxisSideDirection: "end" }),
shift()
],
whileElementsMounted: autoUpdate
}) })
const click = useClick(context) const click = useClick(context)
const dismiss = useDismiss(context) const dismiss = useDismiss(context)
const role = useRole(context) const role = useRole(context)
const { getReferenceProps, getFloatingProps } = useInteractions([ const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role])
click,
dismiss,
role
])
useEffect(() => { useEffect(() => {
const abortController = new AbortController() const abortController = new AbortController()
@ -44,9 +45,7 @@ export function RemixUIStatusBar ({ statusBarPlugin }: RemixUIStatusBarProps) {
async function getScamAlerts() { async function getScamAlerts() {
const response = await axios.get('https://raw.githubusercontent.com/remix-project-org/remix-dynamics/main/ide/scam-alerts.json', { signal }) const response = await axios.get('https://raw.githubusercontent.com/remix-project-org/remix-dynamics/main/ide/scam-alerts.json', { signal })
if (signal.aborted) return if (signal.aborted) return
console.log('getScamAlerts', response)
setScamAlerts(response.data.alerts) setScamAlerts(response.data.alerts)
console.log('getScamAlerts', scamAlerts)
} }
getScamAlerts() getScamAlerts()
return () => { return () => {
@ -54,28 +53,39 @@ export function RemixUIStatusBar ({ statusBarPlugin }: RemixUIStatusBarProps) {
} }
}, []) }, [])
useEffect(() => { async function getGitBranchName() {
console.log('scamAlerts', scamAlerts) const gitRepo = await statusBarPlugin.call('fileManager', 'isGitRepo')
}, [scamAlerts]) console.log('gitRepo', gitRepo)
return gitRepo
const getGitBranchName = async () => { }
return new Promise((resolve, reject) => { async function getWorkspaceName() {
return 0 console.log(statusBarPlugin)
}) const workspaceObject = await statusBarPlugin.call('filePanel', 'getCurrentWorkspace')
if (workspaceObject === null) {
console.log('workspaceObject is null or undefined')
return
} }
console.log('workspaceObject', workspaceObject)
}
function getWorkspaceGitBranchName() {
if (!getGitBranchName()) return
getWorkspaceName()
}
// getWorkspaceName()
getWorkspaceGitBranchName()
return ( return (
<> <>
{showScamDetails && ( {showScamDetails && (
<FloatingFocusManager context={context} modal={false}> <FloatingFocusManager context={context} modal={false}>
<ScamDetails refs={refs} floatStyle={{ ...floatingStyles, minHeight: '300px', alignContent: 'center', paddingRight: '5px' }} getFloatingProps={getFloatingProps} scamAlerts={scamAlerts} /> <ScamDetails refs={refs} floatStyle={{ ...floatingStyles, minHeight: '300px', alignContent: 'center', paddingRight: '5px' }} getFloatingProps={getFloatingProps} scamAlerts={scamAlerts} />
</FloatingFocusManager>)} </FloatingFocusManager>
)}
<div className="d-flex flex-row bg-primary justify-content-between align-items-center"> <div className="d-flex flex-row bg-primary justify-content-between align-items-center">
<div className="remixui_statusbar"> <div className="remixui_statusbar">
<GitStatus /> <GitStatus workspaceName={workspaceName ?? 'none'} />
</div>
<div className="remixui_statusbar">
</div> </div>
<div className="remixui_statusbar"></div>
<div className="remixui_statusbar d-flex flex-row"> <div className="remixui_statusbar d-flex flex-row">
<ScamAlertStatus refs={refs} getReferenceProps={getReferenceProps} /> <ScamAlertStatus refs={refs} getReferenceProps={getReferenceProps} />
<AIStatus /> <AIStatus />

@ -1,4 +1,5 @@
import EventEmitter from 'events' import EventEmitter from 'events'
import { Plugin } from '@remixproject/engine'
export interface PluginProfile { export interface PluginProfile {
name: string name: string
displayName: string displayName: string

Loading…
Cancel
Save