diff --git a/apps/remix-ide/src/app/tabs/locales/en/filePanel.json b/apps/remix-ide/src/app/tabs/locales/en/filePanel.json index 6932ae3e04..98f4cd70e5 100644 --- a/apps/remix-ide/src/app/tabs/locales/en/filePanel.json +++ b/apps/remix-ide/src/app/tabs/locales/en/filePanel.json @@ -142,5 +142,7 @@ "filePanel.movingFolderFailedMsg": "Unexpected error while moving folder: {src}", "filePanel.workspaceActions": "Workspace actions", "filePanel.saveCodeSample": "This code-sample workspace will not be persisted. Click here to save it.", + "filePanel.logInGithub": "Log in to GitHub.", + "filePanel.gitHubLoggedAs": "Logged as {githubuser}", "filePanel.updateSubmodules": "Update all submodules of repository. Click to pull dependencies." } diff --git a/libs/remix-ui/git/src/components/github/devicecode.tsx b/libs/remix-ui/git/src/components/github/devicecode.tsx index cd611efe4d..583aeb98c0 100644 --- a/libs/remix-ui/git/src/components/github/devicecode.tsx +++ b/libs/remix-ui/git/src/components/github/devicecode.tsx @@ -4,8 +4,9 @@ import { gitPluginContext } from "../gitui"; import axios from "axios"; import { CopyToClipboard } from "@remix-ui/clipboard"; import { Card } from "react-bootstrap"; +import { IGitUi } from '../../types' -export const GetDeviceCode = () => { +export const GetDeviceCode = (props: IGitUi) => { const context = React.useContext(gitPluginContext) const actions = React.useContext(gitActionsContext) const pluginActions = React.useContext(pluginActionsContext) @@ -59,7 +60,6 @@ export const GetDeviceCode = () => { await pluginActions.saveToken(response.access_token) await actions.loadGitHubUserFromToken() } - } const disconnect = async () => { @@ -67,6 +67,7 @@ export const GetDeviceCode = () => { setGitHubResponse(null) await pluginActions.saveToken(null) await actions.loadGitHubUserFromToken() + props.plugin.emit('disconnectFromGithub') } return ( diff --git a/libs/remix-ui/git/src/components/gitui.tsx b/libs/remix-ui/git/src/components/gitui.tsx index 7bfbc661cf..65058f8533 100644 --- a/libs/remix-ui/git/src/components/gitui.tsx +++ b/libs/remix-ui/git/src/components/gitui.tsx @@ -31,17 +31,11 @@ import { SourceControl } from './panels/sourcontrol' import { GitHubCredentials } from './panels/githubcredentials' import { Setup } from './panels/setup' import { Init } from './panels/init' -import { CustomRemixApi } from "@remix-api"; -import { Plugin } from "@remixproject/engine"; import { Disabled } from './disabled' - +import { IGitUi } from '../types' export const gitPluginContext = React.createContext(defaultGitState) export const loaderContext = React.createContext(defaultLoaderState) -interface IGitUi { - plugin: Plugin -} - export const GitUI = (props: IGitUi) => { const plugin = props.plugin const [gitState, gitDispatch] = useReducer(gitReducer, defaultGitState) @@ -59,6 +53,7 @@ export const GitUI = (props: IGitUi) => { }) setTimeout(() => { setAppLoaded(true) + plugin.on('filePanel', 'requestGitHubSignIn' as any, () => setActivePanel('0')) }, 2000) }, []) @@ -171,21 +166,29 @@ export const GitUI = (props: IGitUi) => { - {setup && !needsInit ? : null} + {setup && !needsInit ? : null} {needsInit ? : null} {!setup && !needsInit ? - - - + + + <> + +
+ + +
+
+ + <>
- - + + <> @@ -198,8 +201,8 @@ export const GitUI = (props: IGitUi) => {
- - + + <> @@ -211,23 +214,14 @@ export const GitUI = (props: IGitUi) => {
- - + + <>
- + - <> - -
- - -
-
- - <> diff --git a/libs/remix-ui/git/src/components/panels/githubcredentials.tsx b/libs/remix-ui/git/src/components/panels/githubcredentials.tsx index 300e6797f0..7c8c6cf127 100644 --- a/libs/remix-ui/git/src/components/panels/githubcredentials.tsx +++ b/libs/remix-ui/git/src/components/panels/githubcredentials.tsx @@ -5,8 +5,9 @@ import { CustomTooltip } from "@remix-ui/helper"; import { useIntl, FormattedMessage } from "react-intl"; import { CopyToClipboard } from "@remix-ui/clipboard"; +import { IGitUi } from '../../types' -export const GitHubCredentials = () => { +export const GitHubCredentials = (props: IGitUi) => { const context = React.useContext(gitPluginContext) const pluginactions = React.useContext(pluginActionsContext) const loader = React.useContext(loaderContext) @@ -52,6 +53,7 @@ export const GitHubCredentials = () => { setGithubToken(credentials.token || '') setGithubUsername(credentials.username || '') setGithubEmail(credentials.email || '') + props.plugin.emit('loggedInGithubChanged') } function removeToken(): void { @@ -63,6 +65,7 @@ export const GitHubCredentials = () => { email: '', token: '' }) + props.plugin.emit('disconnectFromGithub') } return ( diff --git a/libs/remix-ui/git/src/components/panels/setup.tsx b/libs/remix-ui/git/src/components/panels/setup.tsx index 42a68014ae..6c3a08f438 100644 --- a/libs/remix-ui/git/src/components/panels/setup.tsx +++ b/libs/remix-ui/git/src/components/panels/setup.tsx @@ -1,8 +1,9 @@ import React, { useEffect, useState } from 'react' import { GetDeviceCode } from '../github/devicecode' import { GitHubCredentials } from './githubcredentials' +import { IGitUi } from '../../types' -export const Setup = () => { +export const Setup = (props: IGitUi) => { const [screen, setScreen] = useState(0) @@ -15,9 +16,9 @@ export const Setup = () => { To ensure that your commits are properly attributed in Git, you need to configure a username and email address. These will be used to identify the author of the commit. - +
- + ) @@ -28,7 +29,7 @@ export const Setup = () => {
Step 2
To ensure that your commits are properly attributed in Git, you need to configure your username and email address. - +
) diff --git a/libs/remix-ui/git/src/types/index.ts b/libs/remix-ui/git/src/types/index.ts index 9ed9a292ed..03e28a9bb2 100644 --- a/libs/remix-ui/git/src/types/index.ts +++ b/libs/remix-ui/git/src/types/index.ts @@ -2,9 +2,16 @@ import { Endpoints } from "@octokit/types" import { IRemixApi } from "@remixproject/plugin-api" import { LibraryProfile, StatusEvents } from "@remixproject/plugin-utils" import { CommitObject, ReadBlobResult, ReadCommitResult, StatusRow } from "isomorphic-git" +import { CustomRemixApi } from "@remix-api"; +import { Plugin } from "@remixproject/engine"; + export type GitHubUser = Partial export type userEmails = Endpoints["GET /user/emails"]["response"]["data"] +export interface IGitUi { + plugin: Plugin +} + export interface IGitApi { events: { "checkout": () => void diff --git a/libs/remix-ui/workspace/src/lib/css/file-explorer.css b/libs/remix-ui/workspace/src/lib/css/file-explorer.css index 16f0ffca51..aff221c205 100644 --- a/libs/remix-ui/workspace/src/lib/css/file-explorer.css +++ b/libs/remix-ui/workspace/src/lib/css/file-explorer.css @@ -69,3 +69,7 @@ ul { .remixui_icons:hover { color: var(--text); } + +.remixui_avatar_user { + border-radius: 50% !important; +} diff --git a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx index 03d807808a..e0df989650 100644 --- a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx +++ b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx @@ -17,7 +17,7 @@ import { customAction } from '@remixproject/plugin-api' import { appPlatformTypes, platformContext } from '@remix-ui/app' import { ElectronMenu } from './components/electron-menu' import { ElectronWorkspaceName } from './components/electron-workspace-name' -import { branch } from '@remix-ui/git' +import { branch, GitHubUser, userEmails } from '@remix-ui/git' const _paq = (window._paq = window._paq || []) @@ -72,9 +72,37 @@ export function Workspace() { showContextMenu: false, reservedKeywords: [ROOT_PATH], copyElement: [], - dragStatus: false + 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', 'disconnectFromGithub', () => { + setState((prevState) => { + return { ...prevState, loggedInGithub: false, githubUser: null } + }) + }) + global.plugin.on('dgit', 'loggedInGithubChanged', () => { + run() + }) + run() + }, []) + useEffect(() => { if (canPaste) { addMenuItems([ @@ -1053,6 +1081,14 @@ 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'); + _paq.push(['trackEvent', 'Workspace', 'GIT', 'login']) + } + return (
{(platform !== appPlatformTypes.desktop) ? ( diff --git a/libs/remix-ui/workspace/src/lib/types/index.ts b/libs/remix-ui/workspace/src/lib/types/index.ts index aff1b70bd8..34f9df189d 100644 --- a/libs/remix-ui/workspace/src/lib/types/index.ts +++ b/libs/remix-ui/workspace/src/lib/types/index.ts @@ -6,7 +6,7 @@ import { RemixAppManager } from 'libs/remix-ui/plugin-manager/src/types' import { ViewPlugin } from '@remixproject/engine-web' import { appPlatformTypes } from '@remix-ui/app' import { Placement } from 'react-bootstrap/esm/Overlay' -import { branch } from '@remix-ui/git' +import { branch, GitHubUser } from '@remix-ui/git' export type action = { name: string, type?: Array, path?: string[], extension?: string[], pattern?: string[], id: string, multiselect: boolean, label: string, sticky?: boolean, group: number, platform?: appPlatformTypes } export interface JSONStandardInput { @@ -225,6 +225,8 @@ export interface WorkSpaceState { reservedKeywords: string[] copyElement: CopyElementType[] dragStatus: boolean + loggedInGithub: boolean + githubUser: GitHubUser } export type FileFocusContextType = {