git4refactor
filip mertens 7 months ago
parent 02e1d29084
commit 9024f6e558
  1. 13
      apps/remix-ide/src/app/files/dgitProvider.ts
  2. 24
      libs/remix-ui/git/src/components/buttons/gituibutton.tsx
  3. 85
      libs/remix-ui/git/src/components/buttons/sourcecontrolbuttons.tsx
  4. 4
      libs/remix-ui/git/src/components/gitui.tsx
  5. 1
      libs/remix-ui/git/src/components/navigation/branchedetails.tsx
  6. 21
      libs/remix-ui/git/src/components/navigation/commands.tsx
  7. 31
      libs/remix-ui/git/src/components/navigation/commits.tsx
  8. 7
      libs/remix-ui/git/src/components/navigation/remotesdetails.tsx
  9. 7
      libs/remix-ui/git/src/components/navigation/sourcecontrol.tsx
  10. 5
      libs/remix-ui/git/src/components/panels/branches.tsx
  11. 17
      libs/remix-ui/git/src/components/panels/branches/branchdifferencedetails.tsx
  12. 4
      libs/remix-ui/git/src/components/panels/branches/branchdifferences.tsx
  13. 40
      libs/remix-ui/git/src/components/panels/branches/localbranchdetails.tsx
  14. 51
      libs/remix-ui/git/src/components/panels/branches/remotebranchedetails.tsx
  15. 5
      libs/remix-ui/git/src/components/panels/clone.tsx
  16. 14
      libs/remix-ui/git/src/components/panels/commands/fetch.tsx
  17. 4
      libs/remix-ui/git/src/components/panels/commands/merge.tsx
  18. 12
      libs/remix-ui/git/src/components/panels/commands/pushpull.tsx
  19. 17
      libs/remix-ui/git/src/components/panels/commits.tsx
  20. 8
      libs/remix-ui/git/src/components/panels/commits/commitdetails.tsx
  21. 42
      libs/remix-ui/git/src/lib/gitactions.ts
  22. 1
      libs/remix-ui/git/src/lib/listeners.ts
  23. 4
      libs/remix-ui/git/src/state/context.tsx
  24. 2
      package.json
  25. 8
      yarn.lock

@ -736,6 +736,7 @@ class DGitProvider extends Plugin {
} }
async push(input) { async push(input) {
console.log('push input', input)
const cmd = { const cmd = {
force: input.force, force: input.force,
ref: input.ref, ref: input.ref,
@ -752,11 +753,12 @@ class DGitProvider extends Plugin {
...cmd, ...cmd,
...await this.addIsomorphicGitConfig(input), ...await this.addIsomorphicGitConfig(input),
} }
console.log('push cmd', cmd2)
const result = await git.push({ const result = await git.push({
...await this.addIsomorphicGitConfigFS(), ...await this.addIsomorphicGitConfigFS(),
...cmd2 ...cmd2
}) })
console.log('push result', result) console.log('push result', cmd2, result)
return result return result
} }
@ -797,6 +799,9 @@ class DGitProvider extends Plugin {
remoteRef: input.remoteRef, remoteRef: input.remoteRef,
author: await this.getCommandUser(input), author: await this.getCommandUser(input),
remote: input.remote, remote: input.remote,
depth: input.depth || 5,
singleBranch: input.singleBranch,
relative: input.relative,
input input
} }
let result let result
@ -811,11 +816,7 @@ class DGitProvider extends Plugin {
...await this.addIsomorphicGitConfigFS(), ...await this.addIsomorphicGitConfigFS(),
...cmd2 ...cmd2
}) })
console.log('fetch result', result) console.log('fetch result', cmd2, result)
console.log({
...await this.addIsomorphicGitConfigFS(),
...cmd2
})
} }
setTimeout(async () => { setTimeout(async () => {

@ -0,0 +1,24 @@
import React, { useContext } from 'react'
import { gitPluginContext } from '../gitui'
interface ButtonWithContextProps {
onClick: React.MouseEventHandler<HTMLButtonElement>;
children: React.ReactNode;
disabledCondition?: boolean; // Optional additional disabling condition
// You can add other props if needed, like 'type', 'className', etc.
[key: string]: any; // Allow additional props to be passed
}
// This component extends a button, disabling it when loading is true
const GitUIButton = ({children, disabledCondition = false, ...rest }:ButtonWithContextProps) => {
const { loading } = React.useContext(gitPluginContext)
const isDisabled = loading || disabledCondition
return (
<button disabled={loading} {...rest}>
{children}
</button>
);
};
export default GitUIButton;

@ -1,9 +1,11 @@
import { faArrowDown, faArrowUp, faArrowsUpDown, faArrowRotateRight } from "@fortawesome/free-solid-svg-icons" import { faArrowDown, faArrowUp, faArrowsUpDown, faArrowRotateRight } from "@fortawesome/free-solid-svg-icons"
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome" import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import { CustomTooltip } from "@remix-ui/helper" import { CustomTooltip } from "@remix-ui/helper"
import React, { useState } from "react" import React, { useEffect, useState } from "react"
import { FormattedMessage } from "react-intl" import { FormattedMessage } from "react-intl"
import { gitActionsContext } from "../../state/context"
import { branch, remote } from "../../types" import { branch, remote } from "../../types"
import { gitPluginContext } from "../gitui"
interface SourceControlButtonsProps { interface SourceControlButtonsProps {
remote?: remote, remote?: remote,
@ -11,17 +13,88 @@ interface SourceControlButtonsProps {
} }
export const SourceControlButtons = (props: SourceControlButtonsProps) => { export const SourceControlButtons = (props: SourceControlButtonsProps) => {
const { remote, branch } = props const [branch, setBranch] = useState(props.branch)
const [remote, setRemote] = useState(props.remote)
const context = React.useContext(gitPluginContext)
const actions = React.useContext(gitActionsContext)
const [commitsAhead, setCommitsAhead] = useState([])
const [commitsBehind, setCommitsBehind] = useState([])
return (<span className='d-flex justify-content-end align-items-center w-25'>
useEffect(() => {
console.log('BRANCH DIFF SourceControlButtons', context.branchDifferences, remote, branch)
setDefaultRemote()
if (remote && branch && context.branchDifferences && context.branchDifferences[`${remote.remote}/${branch.name}`]) {
setCommitsAhead(context.branchDifferences[`${remote.remote}/${branch.name}`]?.uniqueHeadCommits)
setCommitsBehind(context.branchDifferences[`${remote.remote}/${branch.name}`]?.uniqueRemoteCommits)
}
}, [context.branchDifferences, branch, remote])
const setDefaultRemote = () => {
if (context.remotes.length > 0) {
// find remote called origin
const origin = context.remotes.find(remote => remote.remote === 'origin')
if (origin) {
setRemote(origin)
} else {
setRemote(context.remotes[0])
}
}
}
useEffect(() => {
if (!props.branch) {
setBranch(context.currentBranch)
}
if (!props.remote) {
setRemote(context.defaultRemote)
}else{
setDefaultRemote()
}
}, [])
useEffect(() => {
console.log('context', context.defaultRemote, context.currentBranch)
if (!props.branch) {
setBranch(context.currentBranch)
}
if (!props.remote) {
setRemote(context.defaultRemote)
}else{
setDefaultRemote()
}
}, [context.defaultRemote, context.currentBranch])
useEffect(() => {
console.log('SC BUTTONS', branch, remote)
}, [])
const pull = async () => {
await actions.pull(remote.remote, branch.name)
}
const push = async () => {
await actions.pull(remote.remote, branch.name)
}
const sync = async () => {
await actions.pull(remote.remote, branch.name)
await actions.push(remote.remote, branch.name)
}
return (<span className='d-flex justify-content-end align-items-center'>
<CustomTooltip tooltipText={<FormattedMessage id="git.pull" />}> <CustomTooltip tooltipText={<FormattedMessage id="git.pull" />}>
<button onClick={async () => { }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowDown} className="" /></button> <>{commitsBehind.length}<button onClick={pull} className='btn btn-sm'><FontAwesomeIcon icon={faArrowDown} className="" /></button></>
</CustomTooltip> </CustomTooltip>
<CustomTooltip tooltipText={<FormattedMessage id="git.push" />}> <CustomTooltip tooltipText={<FormattedMessage id="git.push" />}>
<button onClick={async () => { }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowUp} className="" /></button> <>{commitsAhead.length}<button onClick={push} className='btn btn-sm'><FontAwesomeIcon icon={faArrowUp} className="" /></button></>
</CustomTooltip> </CustomTooltip>
<CustomTooltip tooltipText={<FormattedMessage id="git.sync" />}> <CustomTooltip tooltipText={<FormattedMessage id="git.sync" />}>
<button onClick={async () => { }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowsUpDown} className="" /></button> <button onClick={sync} className='btn btn-sm'><FontAwesomeIcon icon={faArrowsUpDown} className="" /></button>
</CustomTooltip> </CustomTooltip>
<CustomTooltip tooltipText={<FormattedMessage id="git.refresh" />}> <CustomTooltip tooltipText={<FormattedMessage id="git.refresh" />}>
<button onClick={async () => { }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowRotateRight} className="" /></button> <button onClick={async () => { }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowRotateRight} className="" /></button>

@ -133,8 +133,6 @@ export const GitUI = (props: IGitUi) => {
<loaderContext.Provider value={loaderState}> <loaderContext.Provider value={loaderState}>
<gitActionsContext.Provider value={gitActionsProviderValue}> <gitActionsContext.Provider value={gitActionsProviderValue}>
<pluginActionsContext.Provider value={pluginActionsProviderValue}> <pluginActionsContext.Provider value={pluginActionsProviderValue}>
{gitState.loading && <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div>}
{!gitState.loading &&
<Accordion activeKey={activePanel} defaultActiveKey="0"> <Accordion activeKey={activePanel} defaultActiveKey="0">
<SourceControlNavigation eventKey="0" activePanel={activePanel} callback={setActivePanel} /> <SourceControlNavigation eventKey="0" activePanel={activePanel} callback={setActivePanel} />
@ -188,7 +186,7 @@ export const GitUI = (props: IGitUi) => {
</Accordion>} </Accordion>
</pluginActionsContext.Provider> </pluginActionsContext.Provider>
</gitActionsContext.Provider> </gitActionsContext.Provider>
</loaderContext.Provider> </loaderContext.Provider>

@ -46,7 +46,6 @@ export const BrancheDetailsNavigation = (props: BrancheDetailsNavigationProps) =
} }
{branch.remote?.url && <> {branch.remote?.url && <>
<FontAwesomeIcon className='ml-auto pointer' icon={faSync} onClick={() => checkout(branch)}></FontAwesomeIcon>
<FontAwesomeIcon className='ml-2 pointer' icon={faGlobe} onClick={() => openRemote()}></FontAwesomeIcon></>} <FontAwesomeIcon className='ml-2 pointer' icon={faGlobe} onClick={() => openRemote()}></FontAwesomeIcon></>}
</div> </div>
</> </>

@ -1,10 +1,8 @@
import { faCaretUp, faCaretDown, faArrowUp, faArrowDown, faArrowRotateRight, faCaretRight, faCircleCheck, faArrowsUpDown } from "@fortawesome/free-solid-svg-icons"; import { faCaretUp, faCaretDown, faArrowUp, faArrowDown, faArrowRotateRight, faCaretRight, faCircleCheck, faArrowsUpDown } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { CustomTooltip } from "@remix-ui/helper";
import React, { useContext, useEffect } from "react"; import React, { useContext, useEffect } from "react";
import { FormattedMessage } from "react-intl";
import { pluginActionsContext } from "../../state/context"; import { pluginActionsContext } from "../../state/context";
import { SourceControlMenu } from "./menu/sourcecontrolmenu"; import { SourceControlButtons } from "../buttons/sourcecontrolbuttons";
export const CommandsNavigation = ({ eventKey, activePanel, callback }) => { export const CommandsNavigation = ({ eventKey, activePanel, callback }) => {
const pluginactions = React.useContext(pluginActionsContext) const pluginactions = React.useContext(pluginActionsContext)
@ -26,24 +24,7 @@ export const CommandsNavigation = ({ eventKey, activePanel, callback }) => {
activePanel === eventKey ? <FontAwesomeIcon className='' icon={faCaretDown}></FontAwesomeIcon> : <FontAwesomeIcon className='' icon={faCaretRight}></FontAwesomeIcon> activePanel === eventKey ? <FontAwesomeIcon className='' icon={faCaretDown}></FontAwesomeIcon> : <FontAwesomeIcon className='' icon={faCaretRight}></FontAwesomeIcon>
} }
<label className="pl-1 nav form-check-label">COMMANDS</label> <label className="pl-1 nav form-check-label">COMMANDS</label>
</span> </span>
{
activePanel === eventKey ?
<span className='d-flex justify-content-end align-items-center w-25'>
<CustomTooltip tooltipText={<FormattedMessage id="git.pull" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowDown} className="" /></button>
</CustomTooltip>
<CustomTooltip tooltipText={<FormattedMessage id="git.push" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowUp} className="" /></button>
</CustomTooltip>
<CustomTooltip tooltipText={<FormattedMessage id="git.sync" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowsUpDown} className="" /></button>
</CustomTooltip>
</span> : null
}
</div> </div>
</> </>
); );

@ -4,7 +4,8 @@ import { CustomTooltip } from "@remix-ui/helper";
import React, { useEffect } from "react"; import React, { useEffect } from "react";
import { FormattedMessage } from "react-intl"; import { FormattedMessage } from "react-intl";
import { pluginActionsContext } from "../../state/context"; import { pluginActionsContext } from "../../state/context";
import { branch } from "../../types"; import { branch, remote } from "../../types";
import { SourceControlButtons } from "../buttons/sourcecontrolbuttons";
import { gitPluginContext } from "../gitui"; import { gitPluginContext } from "../gitui";
export interface CommitsNavigationProps { export interface CommitsNavigationProps {
@ -13,9 +14,10 @@ export interface CommitsNavigationProps {
activePanel: string, activePanel: string,
callback: (eventKey: string) => void callback: (eventKey: string) => void
branch?: branch, branch?: branch,
remote?: remote
} }
export const CommitsNavigation = ({ eventKey, activePanel, callback, title }: CommitsNavigationProps) => { export const CommitsNavigation = ({ eventKey, activePanel, callback, title, branch, remote }: CommitsNavigationProps) => {
const pluginactions = React.useContext(pluginActionsContext) const pluginactions = React.useContext(pluginActionsContext)
const [pullEnabled, setPullEnabled] = React.useState(true) const [pullEnabled, setPullEnabled] = React.useState(true)
const [pushEnabled, setPushEnabled] = React.useState(true) const [pushEnabled, setPushEnabled] = React.useState(true)
@ -43,28 +45,9 @@ export const CommitsNavigation = ({ eventKey, activePanel, callback, title }: Co
</span> </span>
{ <SourceControlButtons branch={branch} remote={remote}></SourceControlButtons>
activePanel === eventKey ?
<span className='d-flex justify-content-end align-items-center w-25'>
{pullEnabled ?
<CustomTooltip tooltipText={<FormattedMessage id="git.pull" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowDown} className="" /></button>
</CustomTooltip>: null}
{pushEnabled ?
<CustomTooltip tooltipText={<FormattedMessage id="git.push" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowUp} className="" /></button>
</CustomTooltip>: null}
{syncEnabled ?
<CustomTooltip tooltipText={<FormattedMessage id="git.sync" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowsUpDown} className="" /></button>
</CustomTooltip>: null}
{fetchEnabled ?
<CustomTooltip tooltipText={<FormattedMessage id="git.fetch" />}>
<button onClick={async () => { await pluginactions.loadFiles() }} className='btn btn-sm'><FontAwesomeIcon icon={faArrowRotateRight} className="" /></button>
</CustomTooltip>: null}
</span> : null
}
</div> </div>
</> </>

@ -1,4 +1,4 @@
import { faCaretDown, faCaretRight, faArrowRightArrowLeft, faGlobe, faToggleOff, faToggleOn, faTrash, faCheck } from "@fortawesome/free-solid-svg-icons"; import { faCaretDown, faCaretRight, faArrowRightArrowLeft, faGlobe, faToggleOff, faToggleOn, faTrash, faCheck, faSync } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import React, { useContext, useEffect } from "react"; import React, { useContext, useEffect } from "react";
import { gitActionsContext } from "../../state/context"; import { gitActionsContext } from "../../state/context";
@ -51,7 +51,10 @@ export const RemotesDetailsNavigation = (props: RemotesDetailsNavigationProps) =
: :
<FontAwesomeIcon className='ml-auto mr-1 pointer' icon={faToggleOn} onClick={setAsDefault} ></FontAwesomeIcon> <FontAwesomeIcon className='ml-auto mr-1 pointer' icon={faToggleOn} onClick={setAsDefault} ></FontAwesomeIcon>
} }
<FontAwesomeIcon className='ml-auto mr-1 pointer' icon={faTrash} onClick={() => actions.removeRemote(remote)}></FontAwesomeIcon> <FontAwesomeIcon className='ml-auto pointer mr-1' icon={faSync} onClick={async () => {
await actions.fetch(remote.remote)
}}></FontAwesomeIcon>
<FontAwesomeIcon className='ml-auto mr-1 pointer text-danger' icon={faTrash} onClick={() => actions.removeRemote(remote)}></FontAwesomeIcon>
{remote?.url && <FontAwesomeIcon className='ml-2 pointer' icon={faGlobe} onClick={() => openRemote()}></FontAwesomeIcon>} {remote?.url && <FontAwesomeIcon className='ml-2 pointer' icon={faGlobe} onClick={() => openRemote()}></FontAwesomeIcon>}
</div> </div>
</> </>

@ -30,10 +30,9 @@ export const SourceControlNavigation = ({ eventKey, activePanel, callback }) =>
</span> </span>
{
activePanel === eventKey ? <SourceControlButtons />
<SourceControlButtons/> : null
}
</div> </div>
</> </>

@ -2,6 +2,7 @@ import React, { useState } from "react";
import { Alert } from "react-bootstrap"; import { Alert } from "react-bootstrap";
import { gitActionsContext } from "../../state/context"; import { gitActionsContext } from "../../state/context";
import { remote } from "../../types"; import { remote } from "../../types";
import GitUIButton from "../buttons/gituibutton";
import { gitPluginContext } from "../gitui"; import { gitPluginContext } from "../gitui";
import { LocalBranchDetails } from "./branches/localbranchdetails"; import { LocalBranchDetails } from "./branches/localbranchdetails";
import { RemoteBranchDetails } from "./branches/remotebranchedetails"; import { RemoteBranchDetails } from "./branches/remotebranchedetails";
@ -44,13 +45,13 @@ export const Branches = () => {
id="newbranchname" id="newbranchname"
/> />
</div> </div>
<button <GitUIButton
onClick={async () => actions.createBranch(newBranch.value)} onClick={async () => actions.createBranch(newBranch.value)}
className="btn w-md-25 w-100 btn-primary" className="btn w-md-25 w-100 btn-primary"
id="createbranch-btn" id="createbranch-btn"
> >
create new branch create new branch
</button> </GitUIButton>
</div> : <div className="text-muted">No branches</div>} </div> : <div className="text-muted">No branches</div>}
</div> </div>
</> </>

@ -3,26 +3,35 @@ import { Accordion } from "react-bootstrap";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { CommitDetails } from "../commits/commitdetails"; import { CommitDetails } from "../commits/commitdetails";
import { CommitsNavigation } from "../../navigation/commits"; import { CommitsNavigation } from "../../navigation/commits";
import { branch, remote } from "../../../types";
import { gitActionsContext } from "../../../state/context";
export interface BrancheDifferenceProps { export interface BrancheDifferenceProps {
commits: ReadCommitResult[]; commits: ReadCommitResult[];
title: string title: string,
remote?: remote,
branch?: branch
} }
export const BranchDifferenceDetails = (props: BrancheDifferenceProps) => { export const BranchDifferenceDetails = (props: BrancheDifferenceProps) => {
const { commits, title } = props; const { commits, title, branch, remote } = props;
const [activePanel, setActivePanel] = useState<string>(""); const [activePanel, setActivePanel] = useState<string>("");
const actions = React.useContext(gitActionsContext)
if (commits.length === 0) return null if (commits.length === 0) return null
const getCommitChanges = async (commit: ReadCommitResult) => {
await actions.getCommitChanges(commit.oid, commit.commit.parent[0])
}
return ( return (
<Accordion activeKey={activePanel} defaultActiveKey=""> <Accordion activeKey={activePanel} defaultActiveKey="">
<CommitsNavigation title={title} eventKey="0" activePanel={activePanel} callback={setActivePanel} /> <CommitsNavigation branch={branch} remote={remote} title={title} eventKey="0" activePanel={activePanel} callback={setActivePanel} />
<Accordion.Collapse className="pl-2 border-left ml-1" eventKey="0"> <Accordion.Collapse className="pl-2 border-left ml-1" eventKey="0">
<div className="ml-1"> <div className="ml-1">
{commits && commits.map((commit, index) => { {commits && commits.map((commit, index) => {
return ( return (
<CommitDetails key={index} checkout={()=>{}} commit={commit}></CommitDetails> <CommitDetails getCommitChanges={getCommitChanges} key={index} checkout={()=>{}} commit={commit}></CommitDetails>
); );
})} })}
</div> </div>

@ -35,8 +35,8 @@ export const BranchDifferences = (props: BrancheDetailsProps) => {
{!showSummary && context.remotes.map((remote, index) => { {!showSummary && context.remotes.map((remote, index) => {
return ( return (
<div key={index}> <div key={index}>
<BranchDifferenceDetails title={`ahead of ${remote.remote} by ${commitsAhead(remote).length} commit(s)`} commits={commitsAhead(remote)}></BranchDifferenceDetails> <BranchDifferenceDetails branch={branch} remote={remote} title={`ahead of ${remote.remote} by ${commitsAhead(remote).length} commit(s)`} commits={commitsAhead(remote)}></BranchDifferenceDetails>
<BranchDifferenceDetails title={`behind ${remote.remote} by ${commitsBehind(remote).length} commit(s)`} commits={commitsBehind(remote)}></BranchDifferenceDetails> <BranchDifferenceDetails branch={branch} remote={remote} title={`behind ${remote.remote} by ${commitsBehind(remote).length} commit(s)`} commits={commitsBehind(remote)}></BranchDifferenceDetails>
{commitsAhead(remote).length === 0 && commitsBehind(remote).length === 0? null: <hr></hr>} {commitsAhead(remote).length === 0 && commitsBehind(remote).length === 0? null: <hr></hr>}
</div> </div>
); );

@ -25,7 +25,7 @@ export const LocalBranchDetails = (props: BrancheDetailsProps) => {
useEffect(() => { useEffect(() => {
if (activePanel === "0") { if (activePanel === "0") {
console.log('GET BRANCH COMMITS', branch) console.log('GET BRANCH COMMITS', branch)
if(lastPageNumber === 0) if (lastPageNumber === 0)
actions.getBranchCommits(branch, 1) actions.getBranchCommits(branch, 1)
} }
}, [activePanel]) }, [activePanel])
@ -40,37 +40,41 @@ export const LocalBranchDetails = (props: BrancheDetailsProps) => {
} }
const loadNextPage = () => { const loadNextPage = () => {
console.log('LOAD NEXT PAGE', lastPageNumber+1) console.log('LOAD NEXT PAGE', lastPageNumber + 1)
actions.getBranchCommits(branch, lastPageNumber+1) actions.getBranchCommits(branch, lastPageNumber + 1)
} }
const checkoutCommit = async (oid: string) => { const checkoutCommit = async (oid: string) => {
try { try {
//await ModalRef.current?.show(); //await ModalRef.current?.show();
actions.checkout({ ref: oid }) actions.checkout({ ref: oid })
//Utils.log("yes"); //Utils.log("yes");
} catch (e) { } catch (e) {
//Utils.log("no"); //Utils.log("no");
} }
}; };
const getCommitChanges = async (commit: ReadCommitResult) => {
await actions.getCommitChanges(commit.oid, commit.commit.parent[0])
}
return (<Accordion activeKey={activePanel} defaultActiveKey=""> return (<Accordion activeKey={activePanel} defaultActiveKey="">
<BrancheDetailsNavigation checkout={checkout} branch={branch} eventKey="0" activePanel={activePanel} callback={setActivePanel} /> <BrancheDetailsNavigation checkout={checkout} branch={branch} eventKey="0" activePanel={activePanel} callback={setActivePanel} />
<Accordion.Collapse className="pl-2 border-left ml-1" eventKey="0"> <Accordion.Collapse className="pl-2 border-left ml-1" eventKey="0">
<> <>
<div className="ml-1"> <div className="ml-1">
<BranchDifferences branch={branch}></BranchDifferences> <BranchDifferences branch={branch}></BranchDifferences>
{context.localBranchCommits && Object.entries(context.localBranchCommits).map(([key, value]) => { {context.localBranchCommits && Object.entries(context.localBranchCommits).map(([key, value]) => {
if(key == branch.name){ if (key == branch.name) {
return value.map((commit, index) => { return value.map((commit, index) => {
return(<CommitDetails key={index} checkout={checkoutCommit} commit={commit}></CommitDetails>) return (<CommitDetails key={index} getCommitChanges={getCommitChanges} checkout={checkoutCommit} commit={commit}></CommitDetails>)
}) })
} }
})} })}
</div> </div>
{hasNextPage && <a href="#" className="cursor-pointer mb-1 ml-2" onClick={loadNextPage}>Load more</a>} {hasNextPage && <a href="#" className="cursor-pointer mb-1 ml-2" onClick={loadNextPage}>Load more</a>}
</> </>
</Accordion.Collapse> </Accordion.Collapse>
</Accordion>) </Accordion>)

@ -24,7 +24,7 @@ export const RemoteBranchDetails = (props: BrancheDetailsProps) => {
useEffect(() => { useEffect(() => {
if (activePanel === "0") { if (activePanel === "0") {
console.log('GET BRANCH COMMITS', branch) console.log('GET BRANCH COMMITS', branch)
if(lastPageNumber === 0) if (lastPageNumber === 0)
actions.getBranchCommits(branch, 1) actions.getBranchCommits(branch, 1)
} }
}, [activePanel]) }, [activePanel])
@ -34,7 +34,7 @@ export const RemoteBranchDetails = (props: BrancheDetailsProps) => {
let lastPageNumber = 0 let lastPageNumber = 0
console.log('BRANCH COMMITS', context.remoteBranchCommits) console.log('BRANCH COMMITS', context.remoteBranchCommits)
context.remoteBranchCommits && Object.entries(context.remoteBranchCommits).map(([key, value]) => { context.remoteBranchCommits && Object.entries(context.remoteBranchCommits).map(([key, value]) => {
if(key == branch.name){ if (key == branch.name) {
value.map((page, index) => { value.map((page, index) => {
hasNextPage = page.hasNextPage hasNextPage = page.hasNextPage
lastPageNumber = page.page lastPageNumber = page.page
@ -53,38 +53,47 @@ export const RemoteBranchDetails = (props: BrancheDetailsProps) => {
} }
const loadNextPage = () => { const loadNextPage = () => {
console.log('LOAD NEXT PAGE', lastPageNumber+1) console.log('LOAD NEXT PAGE', lastPageNumber + 1)
actions.getBranchCommits(branch, lastPageNumber+1) actions.getBranchCommits(branch, lastPageNumber + 1)
} }
const checkoutCommit = async (oid: string) => { const checkoutCommit = async (oid: string) => {
try { try {
//await ModalRef.current?.show(); //await ModalRef.current?.show();
actions.checkout({ ref: oid }) actions.checkout({ ref: oid })
//Utils.log("yes"); //Utils.log("yes");
} catch (e) { } catch (e) {
//Utils.log("no"); //Utils.log("no");
} }
}; };
const getCommitChanges = async (commit: ReadCommitResult) => {
const changes = await actions.getCommitChanges(commit.oid, commit.commit.parent[0], branch, branch.remote)
console.log('CHANGES', changes)
if(!changes) {
// try to fetch the data
await actions.fetch(branch.remote.remote, branch.name,null,20, true, false, true)
}
}
return (<Accordion activeKey={activePanel} defaultActiveKey=""> return (<Accordion activeKey={activePanel} defaultActiveKey="">
<BrancheDetailsNavigation checkout={checkout} branch={branch} eventKey="0" activePanel={activePanel} callback={setActivePanel} /> <BrancheDetailsNavigation checkout={checkout} branch={branch} eventKey="0" activePanel={activePanel} callback={setActivePanel} />
<Accordion.Collapse className="pl-2 border-left ml-1" eventKey="0"> <Accordion.Collapse className="pl-2 border-left ml-1" eventKey="0">
<> <>
<div className="ml-1"> <div className="ml-1">
{context.remoteBranchCommits && Object.entries(context.remoteBranchCommits).map(([key, value]) => { {context.remoteBranchCommits && Object.entries(context.remoteBranchCommits).map(([key, value]) => {
if(key == branch.name){ if (key == branch.name) {
return value.map((page, index) => { return value.map((page, index) => {
return page.commits.map((commit, index) => { return page.commits.map((commit, index) => {
return(<CommitDetails key={index} checkout={checkoutCommit} commit={commit}></CommitDetails>) return (<CommitDetails getCommitChanges={getCommitChanges} key={index} checkout={checkoutCommit} commit={commit}></CommitDetails>)
})
}) })
}) }
} })}
})}
</div> </div>
{hasNextPage && <a href="#" className="cursor-pointer mb-1 ml-2" onClick={loadNextPage}>Load more</a>} {hasNextPage && <a href="#" className="cursor-pointer mb-1 ml-2" onClick={loadNextPage}>Load more</a>}
</> </>
</Accordion.Collapse> </Accordion.Collapse>
</Accordion>) </Accordion>)

@ -6,6 +6,7 @@ import { gitActionsContext } from "../../state/context";
import { gitPluginContext } from "../gitui"; import { gitPluginContext } from "../gitui";
import { Repositories } from "./repositories"; import { Repositories } from "./repositories";
import { RemixUiCheckbox } from "@remix-ui/checkbox"; import { RemixUiCheckbox } from "@remix-ui/checkbox";
import GitUIButton from "../buttons/gituibutton";
export const Clone = () => { export const Clone = () => {
const context = React.useContext(gitPluginContext) const context = React.useContext(gitPluginContext)
@ -68,9 +69,9 @@ export const Clone = () => {
<input name='clonebranch' onChange={e => onCloneBranchChange(e.target.value)} value={cloneBranch} className="form-control mb-1 mt-2" placeholder="branch" type="text" id="clonebranch" /> <input name='clonebranch' onChange={e => onCloneBranchChange(e.target.value)} value={cloneBranch} className="form-control mb-1 mt-2" placeholder="branch" type="text" id="clonebranch" />
<button disabled={!cloneUrl || !cloneBranch} data-id='clonebtn' className='btn btn-primary mt-1 w-100' onClick={async () => { <GitUIButton disabledCondition={!cloneUrl || !cloneBranch} data-id='clonebtn' className='btn btn-primary mt-1 w-100' onClick={async () => {
clone() clone()
}}>clone</button> }}>clone</GitUIButton>
<hr /> <hr />
<Repositories cloneAllBranches={cloneAllBranches} cloneDepth={cloneDepth} /> <Repositories cloneAllBranches={cloneAllBranches} cloneDepth={cloneDepth} />
<hr /> <hr />

@ -1,16 +1,18 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { gitActionsContext } from "../../../state/context"; import { gitActionsContext } from "../../../state/context";
import GitUIButton from "../../buttons/gituibutton";
import { gitPluginContext } from "../../gitui";
export const Fetch = () => { export const Fetch = () => {
const actions = React.useContext(gitActionsContext) const actions = React.useContext(gitActionsContext)
const fetch = async () => { const context = React.useContext(gitPluginContext)
await actions.fetch()
}
return ( return (
<> <>
<button type="button" onClick={async () => fetch()} className="btn btn-primary w-100">Fetch</button> <div className="btn-group w-100" role="group">
<GitUIButton type="button" onClick={async () => actions.fetch()} className="btn btn-primary mr-1">Fetch {context.upstream}</GitUIButton>
<GitUIButton type="button" onClick={async () => actions.fetch(null, null, context.currentBranch.name, null, true )} className="btn btn-primary">Fetch {context.currentBranch.name}</GitUIButton>
</div>
</>) </>)
} }

@ -3,6 +3,7 @@ import { gitActionsContext } from "../../../state/context";
import { gitPluginContext } from "../../gitui"; import { gitPluginContext } from "../../gitui";
import { selectStyles, selectTheme } from "../../../types/styles"; import { selectStyles, selectTheme } from "../../../types/styles";
import Select from 'react-select' import Select from 'react-select'
import GitUIButton from "../../buttons/gituibutton";
export const Merge = () => { export const Merge = () => {
const context = React.useContext(gitPluginContext) const context = React.useContext(gitPluginContext)
@ -46,8 +47,7 @@ export const Merge = () => {
<div className="btn-group w-100" role="group" aria-label="Basic example"> <div className="btn-group w-100" role="group" aria-label="Basic example">
<button type="button" onClick={async () => merge()} className="btn btn-primary mr-1">Merge</button> <GitUIButton type="button" onClick={async () => merge()} className="btn btn-primary mr-1">Merge</GitUIButton>
</div> </div>

@ -4,6 +4,7 @@ import { gitPluginContext } from "../../gitui";
import { selectStyles, selectTheme } from "../../../types/styles"; import { selectStyles, selectTheme } from "../../../types/styles";
import Select, { Options, OptionsOrGroups } from 'react-select' import Select, { Options, OptionsOrGroups } from 'react-select'
import { setUpstream } from "../../../state/gitpayload"; import { setUpstream } from "../../../state/gitpayload";
import GitUIButton from "../../buttons/gituibutton";
export const PushPull = () => { export const PushPull = () => {
const context = React.useContext(gitPluginContext) const context = React.useContext(gitPluginContext)
@ -50,11 +51,12 @@ export const PushPull = () => {
} }
const push = async () => { const push = async () => {
actions.push() console.log('PUSH', context.upstream, localBranch, remoteBranch, force)
actions.push(context.upstream, localBranch, remoteBranch, force)
} }
const pull = async () => { const pull = async () => {
actions.pull() actions.pull(context.upstream, localBranch, remoteBranch)
} }
@ -96,10 +98,10 @@ export const PushPull = () => {
<div className="btn-group w-100" role="group" aria-label="Basic example"> <div className="btn-group w-100" role="group">
<button type="button" onClick={async () => pull()} className="btn btn-primary mr-1">Pull</button> <GitUIButton type="button" onClick={async () => pull()} className="btn btn-primary mr-1">Pull</GitUIButton>
<button type="button" onClick={async () => push()} className="btn btn-primary">Push</button> <GitUIButton type="button" onClick={async () => push()} className="btn btn-primary">Push</GitUIButton>
</div> </div>

@ -8,6 +8,7 @@ import { CommitSummary } from "./commits/commitsummary";
export const Commits = () => { export const Commits = () => {
const [hasNextPage, setHasNextPage] = React.useState(true)
const context = React.useContext(gitPluginContext) const context = React.useContext(gitPluginContext)
const actions = React.useContext(gitActionsContext) const actions = React.useContext(gitActionsContext)
@ -21,6 +22,16 @@ export const Commits = () => {
} }
}; };
const loadNextPage = () => {
console.log('LOAD NEXT PAGE', context.commits.length)
actions.fetch(null, context.currentBranch.name, null, 5, true, true)
//actions.getBranchCommits(branch, lastPageNumber+1)
}
const getCommitChanges = async (commit: ReadCommitResult) => {
await actions.getCommitChanges(commit.oid, commit.commit.parent[0])
}
return ( return (
<> <>
@ -29,11 +40,13 @@ export const Commits = () => {
<div className="pt-1"> <div className="pt-1">
{context.commits && context.commits.map((commit, index) => { {context.commits && context.commits.map((commit, index) => {
return ( return (
<CommitDetails key={index} checkout={checkout} commit={commit}></CommitDetails> <CommitDetails getCommitChanges={getCommitChanges} key={index} checkout={checkout} commit={commit}></CommitDetails>
); );
})} })}
</div> </div>
</div></> </div>
{hasNextPage && <a href="#" className="cursor-pointer mb-1 ml-2" onClick={loadNextPage}>Load more</a>}
</>
: <div className="text-muted">No commits</div>} : <div className="text-muted">No commits</div>}
</> </>
) )

@ -9,19 +9,19 @@ import { CommitDetailsItems } from "./commitdetailsitem";
export interface CommitDetailsProps { export interface CommitDetailsProps {
commit: ReadCommitResult; commit: ReadCommitResult;
checkout: (oid: string) => void; checkout: (oid: string) => void;
getCommitChanges: (commit: ReadCommitResult) => void;
} }
export const CommitDetails = (props: CommitDetailsProps) => { export const CommitDetails = (props: CommitDetailsProps) => {
const { commit, checkout } = props; const { commit, checkout, getCommitChanges } = props;
const actions = React.useContext(gitActionsContext) const actions = React.useContext(gitActionsContext)
const context = React.useContext(gitPluginContext) const context = React.useContext(gitPluginContext)
const [activePanel, setActivePanel] = useState<string>(""); const [activePanel, setActivePanel] = useState<string>("");
useEffect(() => { useEffect(() => {
console.log(commit)
if (activePanel === "0") { if (activePanel === "0") {
console.log(commit.oid, commit.commit.parent) console.log(context)
actions.getCommitChanges(commit.oid, commit.commit.parent[0]) getCommitChanges(commit)
} }
}, [activePanel]) }, [activePanel])

@ -373,31 +373,46 @@ export const clone = async (url: string, branch: string, depth: number, singleBr
dispatch(setLoading(false)) dispatch(setLoading(false))
} }
export const fetch = async (remote?: string, ref?: string, remoteRef?: string) => { export const fetch = async (remote?: string, ref?: string, remoteRef?: string, depth?: number, singleBranch?: boolean, relative?: boolean, quiet?: boolean) => {
dispatch(setLoading(true))
await disableCallBacks()
await plugin.call('notification', 'toast', `Fetching ${remote || ''} ${ref || ''} ${remoteRef || ''}`)
try { try {
await plugin.call('dGitProvider' as any, 'fetch', { remote, ref, remoteRef }) await plugin.call('dGitProvider' as any, 'fetch', { remote, ref, remoteRef, depth, singleBranch, relative });
await gitlog() if(!quiet){
await getBranches() await gitlog()
await getBranches()
}
} catch (e: any) { } catch (e: any) {
await parseError(e) await parseError(e)
} }
dispatch(setLoading(false))
await enableCallBacks()
} }
export const pull = async (remote?: string, ref?: string, remoteRef?: string) => { export const pull = async (remote?: string, ref?: string, remoteRef?: string) => {
dispatch(setLoading(true))
await disableCallBacks()
try { try {
await plugin.call('dGitProvider' as any, 'pull', { remote, ref, remoteRef }) await plugin.call('dGitProvider' as any, 'pull', { remote, ref, remoteRef })
await gitlog() await gitlog()
} catch (e: any) { } catch (e: any) {
await parseError(e) await parseError(e)
} }
dispatch(setLoading(false))
await enableCallBacks()
} }
export const push = async (remote?: string, ref?: string, remoteRef?: string, force?: boolean) => { export const push = async (remote?: string, ref?: string, remoteRef?: string, force?: boolean) => {
dispatch(setLoading(true))
await disableCallBacks()
try { try {
await plugin.call('dGitProvider' as any, 'push', { remote, ref, remoteRef, force }) await plugin.call('dGitProvider' as any, 'push', { remote, ref, remoteRef, force })
} catch (e: any) { } catch (e: any) {
await parseError(e) await parseError(e)
} }
dispatch(setLoading(false))
await enableCallBacks()
} }
const tokenWarning = async () => { const tokenWarning = async () => {
@ -690,10 +705,16 @@ export const diff = async (commitChange: commitChange) => {
*/ */
} }
export const getCommitChanges = async (oid1: string, oid2: string) => { export const getCommitChanges = async (oid1: string, oid2: string, branch?: branch, remote?: remote) => {
const result: commitChange[] = await plugin.call('dGitProvider', 'getCommitChanges', oid1, oid2) console.log(oid1, oid2, branch, remote)
dispatch(setCommitChanges(result)) try{
return result const result: commitChange[] = await plugin.call('dGitProvider', 'getCommitChanges', oid1, oid2)
dispatch(setCommitChanges(result))
return result
}catch(e){
console.log(e)
return false
}
} }
async function getRepoDetails(url: string) { async function getRepoDetails(url: string) {
@ -709,6 +730,7 @@ async function getRepoDetails(url: string) {
export const fetchBranch = async (branch: branch, page: number) => { export const fetchBranch = async (branch: branch, page: number) => {
if(!branch.remote || !branch.remote.url) return
const token = await tokenWarning(); const token = await tokenWarning();
console.log('fetch', branch) console.log('fetch', branch)
const { owner, repo } = await getRepoDetails(branch.remote.url); const { owner, repo } = await getRepoDetails(branch.remote.url);
@ -772,7 +794,7 @@ export const getBranchCommits = async (branch: branch, page: number) => {
const commits: ReadCommitResult[] = await plugin.call('dGitProvider', 'log', { const commits: ReadCommitResult[] = await plugin.call('dGitProvider', 'log', {
ref: branch.name, ref: branch.name,
}) })
const branchDifference: branchDifference = await plugin.call('dGitProvider', 'compareBranches', { const branchDifference: branchDifference = await plugin.call('dGitProvider', 'compareBranches', {
branch, branch,
remote: { remote: {
@ -787,7 +809,7 @@ export const getBranchCommits = async (branch: branch, page: number) => {
remote: remote:
{ remote: 'origin', url: '' }, { remote: 'origin', url: '' },
branchDifference: branchDifference branchDifference: branchDifference
})) }))
dispatch(setLocalBranchCommits({ branch, commits })) dispatch(setLocalBranchCommits({ branch, commits }))
} else { } else {
await fetchBranch(branch, page) await fetchBranch(branch, page)

@ -184,6 +184,7 @@ export const enableCallBacks = async () => {
} }
const synTimerStart = async () => { const synTimerStart = async () => {
console.trace('synTimerStart')
if (!callBackEnabled) return if (!callBackEnabled) return
clearTimeout(syncTimer) clearTimeout(syncTimer)
syncTimer = setTimeout(async () => { syncTimer = setTimeout(async () => {

@ -11,13 +11,13 @@ export interface gitActions {
addall(): Promise<void> addall(): Promise<void>
push(remote?: string, ref?: string, remoteRef?: string, force?: boolean): Promise<void> push(remote?: string, ref?: string, remoteRef?: string, force?: boolean): Promise<void>
pull(remote?: string, ref?: string, remoteRef?: string): Promise<void> pull(remote?: string, ref?: string, remoteRef?: string): Promise<void>
fetch(remote?: string, ref?: string, remoteRef?: string): Promise<void> fetch(remote?: string, ref?: string, remoteRef?: string, depth?: number, singleBranch?: boolean, relative?: boolean, quiet?: boolean): Promise<void>
repositories(): Promise<any> repositories(): Promise<any>
checkoutfile(file: string): Promise<void> checkoutfile(file: string): Promise<void>
checkout(cmd: any): Promise<void> checkout(cmd: any): Promise<void>
createBranch(branch: string): Promise<void> createBranch(branch: string): Promise<void>
remoteBranches(owner: string, repo: string): Promise<any> remoteBranches(owner: string, repo: string): Promise<any>
getCommitChanges(oid1: string, oid2: string): Promise<commitChange[]> getCommitChanges(oid1: string, oid2: string, branch?: branch, remote?: remote): Promise<commitChange[] | boolean>
getBranchCommits(branch: branch, page: number): Promise<void> getBranchCommits(branch: branch, page: number): Promise<void>
getGitHubUser(): Promise<any> getGitHubUser(): Promise<any>
diff(commitChange: commitChange): Promise<void> diff(commitChange: commitChange): Promise<void>

@ -158,7 +158,7 @@
"http-server": "^14.1.1", "http-server": "^14.1.1",
"intro.js": "^4.1.0", "intro.js": "^4.1.0",
"isbinaryfile": "^3.0.2", "isbinaryfile": "^3.0.2",
"isomorphic-git": "^1.25.0", "isomorphic-git": "^1.25.7",
"jquery": "^3.3.1", "jquery": "^3.3.1",
"js-yaml": "^4.1.0", "js-yaml": "^4.1.0",
"jspdf": "^2.5.1", "jspdf": "^2.5.1",

@ -19155,10 +19155,10 @@ isobject@^3.0.0, isobject@^3.0.1:
resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df" resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8= integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8=
isomorphic-git@^1.25.0: isomorphic-git@^1.25.7:
version "1.25.0" version "1.25.7"
resolved "https://registry.yarnpkg.com/isomorphic-git/-/isomorphic-git-1.25.0.tgz#3a04d7e70f75ebdbb991f9fa87cfec90e3742c9f" resolved "https://registry.yarnpkg.com/isomorphic-git/-/isomorphic-git-1.25.7.tgz#f6f6fae81ee67d3982edad8c90ca0f096e39267c"
integrity sha512-F8X7z74gL+jN4bd6qB6a3Z0QQzonWPkiQ3nK/oFWlrc2pIwVM9Uksl3YMFh99ltswsqoCoOthgasybX08/fiGg== integrity sha512-KE10ejaIsEpQ+I/apS33qqTjyzCXgOniEaL32DwNbXtboKG8H3cu+RiBcdp3G9w4MpOOTQfGPsWp4i8UxRfDLg==
dependencies: dependencies:
async-lock "^1.1.0" async-lock "^1.1.0"
clean-git-ref "^2.0.1" clean-git-ref "^2.0.1"

Loading…
Cancel
Save