FilesExpand file tree

 master

/

githubbutton.tsx

Copy path

Blame

More file actions

Blame

More file actions

Latest commit

 

History

History

History

94 lines (81 loc) · 3.82 KB

 master

/

githubbutton.tsx

Top

File metadata and controls

• Code
• Blame

94 lines (81 loc) · 3.82 KB

Raw

Copy raw file

Download raw file

Open symbols panel

Edit and raw actions

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

import * as React from "react";

import * as sui from "./sui";

import * as pkg from "./package";

import * as cloudsync from "./cloudsync";

import * as workspace from "./workspace";

interface GithubButtonProps extends pxt.editor.ISettingsProps {

className?: string;

}

interface GithubButtonState {

pushPulling?: boolean;

}

export class GithubButton extends sui.UIElement<GithubButtonProps, GithubButtonState> {

constructor(props: GithubButtonProps) {

super(props);

this.state = {};

this.handleClick = this.handleClick.bind(this);

this.handleButtonKeydown = this.handleButtonKeydown.bind(this);

this.createRepository = this.createRepository.bind(this);

}

private handleButtonKeydown(e: React.KeyboardEvent<HTMLElement>) {

e.stopPropagation();

}

private createRepository(e: React.MouseEvent<HTMLElement>) {

pxt.tickEvent("github.button.create", undefined, { interactiveConsent: true });

this.props.parent.createGitHubRepositoryAsync();

}

private handleClick(e: React.MouseEvent<HTMLElement>) {

e.stopPropagation();

const { header } = this.props.parent.state;

if (!header) return;

const { githubId } = header;

if (!githubId) return;

pxt.tickEvent("github.button.nav")

const gitf = pkg.mainEditorPkg().lookupFile("this/" + pxt.github.GIT_JSON);

if (gitf)

this.props.parent.setSideFile(gitf);

}

renderCore() {

const header = this.props.parent.state.header;

if (!header) return <div />;

const { githubId } = header;

const ghid = pxt.github.parseRepoId(githubId);

const defaultCls = "ui icon button editortools-btn editortools-github-btn"

// new github repo

if (!ghid)

return <sui.Button key="githubcreatebtn" className={`${defaultCls} ${this.props.className || ""}`}

icon="github" title={lf("create GitHub repository")} ariaLabel={lf("create GitHub repository")}

onClick={this.createRepository} />

// existing repo

const meta: pkg.PackageGitStatus = this.getData("pkg-git-status:" + header.id);

const pullStatus = meta && this.getData("pkg-git-pull-status:" + header.id);

const hasissue = pullStatus == workspace.PullStatus.BranchNotFound;

const haspull = pullStatus == workspace.PullStatus.GotChanges;

const modified = meta && !!meta.modified;

const repoName = ghid.project && ghid.tag ? `${ghid.project}${ghid.tag == "master" ? "" : `#${ghid.tag}`}` : ghid.fullName;

// shrink name...

const maxLength = 20;

let displayName = ghid.tag && ghid.tag != "master" ? `#${ghid.tag}` : "";

if (displayName.length > maxLength)

displayName = displayName.slice(0, maxLength - 2) + '..';

const title =

hasissue ? lf("{0}: there is an issue with your GitHub connection.", repoName)

: haspull ? lf("{0}: remote changes are ready to be pulled.", repoName)

: modified ? lf("{0}: review, commit & push local changes to GitHub.", repoName)

: lf("{0}: local changes are synchronized with GitHub.", repoName)

return <div key="githubeditorbtn" role="button" className={`${defaultCls}

${this.props.className || ""}`}

title={title}

onClick={this.handleClick} onKeyDown={sui.fireClickOnEnter}

tabIndex={0}

>

<i className="github icon" />

<span className="ui mobile hide">{displayName}</span>

<i className={`ui long ${

hasissue ? "exclamation circle"

: haspull ? "arrow alternate down"

: modified ? "arrow alternate up"

: "check"} icon mobile hide`} />

</div>;

}

}