update git statusbar section

pull/5370/head
Joseph Izang 6 months ago
parent d071594506
commit 7da3e6dd30
  1. 13
      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. 64
      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: [
'createNewFile',
'uploadFile',
'echoCall',
'getCurrentWorkspace',
'getAvailableWorkspaceName',
'getWorkspaces',
@ -43,7 +44,7 @@ const profile = {
'registerContextMenuItem',
'renameWorkspace',
'deleteWorkspace',
'loadTemplate',
'loadTemplate',
'clone',
'isExpanded',
'isGist'
@ -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[] }
* typically:
@ -147,6 +153,7 @@ module.exports = class Filepanel extends ViewPlugin {
}
getCurrentWorkspace() {
console.log('getCurrentWorkspace', this.currentWorkspaceMetadata)
return this.currentWorkspaceMetadata
}
@ -154,10 +161,10 @@ module.exports = class Filepanel extends ViewPlugin {
return this.workspaces
}
getAvailableWorkspaceName(name) {
getAvailableWorkspaceName(name) {
if (!this.workspaces) return name
let index = 1
let workspace = this.workspaces.find((workspace) => workspace.name === name + ' - ' + index)
let workspace = this.workspaces.find((workspace) => workspace.name === name + ' - ' + index)
while (workspace) {
index++
workspace = this.workspaces.find((workspace) => workspace.name === name + ' - ' + index)

@ -168,7 +168,7 @@ const RemixApp = (props: IRemixAppUi) => {
}
}
console.log('statusbar', props.app.statusBar)
return (
//@ts-ignore
<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 (
<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="small mx-1">dev-updates</span>
<span className="small mx-1">{`${workspaceName}`}</span>
<span className="fa-solid fa-arrows-rotate fa-1"></span>
</div>
)

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

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

Loading…
Cancel
Save