Skip to content

Commit edeff6b

Browse files
authored
WIP: Clone repository (#7)
* Create cloneRepository.vue * Create state, mutation & action for clone repository * Create git clone command * Import cloneRepository to app.vue * Toggle clone repository from menubar * Return a boolean value on successful clone * Remove pre-define static values * Toggle cloneRepository modal after success clone * Adding repository after clone is done
1 parent 75f6422 commit edeff6b

File tree

4 files changed

+180
-2
lines changed

4 files changed

+180
-2
lines changed

src/renderer/App.vue

+4-1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
<about />
1010
<exportCommitData />
1111
<newRemote />
12+
<cloneRepository />
1213
</div>
1314
</div>
1415
</div>
@@ -21,6 +22,7 @@ import addLocalRepository from "./components/model/addLocalRepository";
2122
import about from "./components/model/about";
2223
import exportCommitData from "./components/model/exportCommitData";
2324
import newRemote from "./components/model/newRemote";
25+
import cloneRepository from './components/model/cloneRepository';
2426
2527
export default {
2628
name: "App",
@@ -30,7 +32,8 @@ export default {
3032
addLocalRepository,
3133
about,
3234
exportCommitData,
33-
newRemote
35+
newRemote,
36+
cloneRepository
3437
},
3538
beforeCreate() {
3639
this.$store.commit("repository/getRepositoryList");
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
<template>
2+
<div
3+
v-show="this.$store.state.model.model.cloneRepository"
4+
class="model--medium"
5+
>
6+
<div v-if="!cloning">
7+
<div class="model__section model__header">
8+
<h6 class="model__header__title">
9+
Clone a repository
10+
</h6>
11+
<div
12+
class="model__header__close"
13+
@click="closeModel"
14+
>
15+
<closeIcon />
16+
</div>
17+
</div>
18+
<div class="model__section model__body flex-column">
19+
<inputTextLabel
20+
v-model="repositoryName"
21+
name="repositoryName"
22+
label="Name"
23+
placeholder="Name of repository"
24+
margin-bottom=".8rem"
25+
/>
26+
<inputTextLabel
27+
v-model="remoteUrl"
28+
name="remoteUrl"
29+
label="Remote url"
30+
placeholder="Paste remote url"
31+
margin-bottom=".8rem"
32+
/>
33+
<div style="display: flex; align-items: flex-end">
34+
<inputTextLabel
35+
v-model="repositoryLocation"
36+
name="repositoryLocation"
37+
label="Path"
38+
placeholder="Repository path"
39+
style="flex-grow: 2"
40+
/>
41+
<input
42+
ref="folderSelector"
43+
type="file"
44+
name="folderSelector"
45+
webkitdirectory
46+
style="display: none"
47+
@change="folderSelectorInput"
48+
>
49+
<Button
50+
text="Select"
51+
appearance="primary"
52+
margin-left=".4rem"
53+
@click.native="$refs.folderSelector.click()"
54+
/>
55+
</div>
56+
</div>
57+
<div class="model__section model__footer">
58+
<Button
59+
margin-left="auto"
60+
text="Clone"
61+
appearance="primary"
62+
@click.native="cloneRepository"
63+
/>
64+
<Button
65+
text="Cancel"
66+
appearance="outline"
67+
margin-left=".5rem"
68+
@click.native="closeModel"
69+
/>
70+
</div>
71+
</div>
72+
<div
73+
v-else
74+
class="clone__progress"
75+
>
76+
<h1>Cloning the repository</h1>
77+
<progressBar
78+
:value="cloneProgress"
79+
margin-top="2rem"
80+
/>
81+
</div>
82+
</div>
83+
</template>
84+
85+
<script>
86+
import inputTextLabel from "../input/inputTextLabel";
87+
import closeIcon from "../icon/close";
88+
import Button from "../buttons/Button";
89+
import progressBar from "../progress/progressBar";
90+
import gitClone from "../../git/clone";
91+
import addRepository from "../../mixins/addRepository";
92+
93+
export default {
94+
name: "CloneRepository",
95+
components: {
96+
inputTextLabel,
97+
Button,
98+
progressBar,
99+
closeIcon
100+
},
101+
mixins: [addRepository],
102+
data() {
103+
return {
104+
repositoryName: "",
105+
remoteUrl: "",
106+
repositoryLocation: "",
107+
cloning: false,
108+
cloneProgress: 0
109+
};
110+
},
111+
methods: {
112+
folderSelectorInput() {
113+
this.repositoryLocation = event.target.files[0].path
114+
.split("\\")
115+
.join("/");
116+
},
117+
cloneRepository() {
118+
const repositoryPath =
119+
this.repositoryLocation + "/" + this.repositoryName;
120+
this.cloning = true;
121+
gitClone(this.remoteUrl, repositoryPath)
122+
.then(result => {
123+
if (result) {
124+
this.cloning = false;
125+
this.closeModel();
126+
}
127+
this.addRepository(repositoryPath);
128+
});
129+
},
130+
addRepository(path) {
131+
this.localRepository(path);
132+
},
133+
closeModel() {
134+
this.$store.dispatch("model/showCloneRepository");
135+
}
136+
}
137+
};
138+
</script>
139+
140+
<style lang='sass' scoped>
141+
.clone__progress
142+
padding: 3rem
143+
text-align: center
144+
</style>

src/renderer/git/clone.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import git from "simple-git/promise";
2+
3+
const clone = async (remoteUrl, localPath) => {
4+
let cloneStatus;
5+
let cloneRepository = git()
6+
.outputHandler((command, stdout, stderr) => {
7+
stderr.on('end', () => {
8+
cloneStatus = true;
9+
});
10+
});
11+
try {
12+
await cloneRepository.clone(remoteUrl, localPath, ['--progress']);
13+
return cloneStatus;
14+
} catch (error) {
15+
console.log(error);
16+
}
17+
};
18+
19+
export default clone;

src/renderer/store/modules/model.js

+13-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ const state = {
55
newRepository: false,
66
about: false,
77
exportCommitData: false,
8-
newRemote: false
8+
newRemote: false,
9+
cloneRepository: false
910
}
1011
};
1112

@@ -29,6 +30,9 @@ const mutations = {
2930
},
3031
toggleNewRepository(state) {
3132
state.model.newRepository = !state.model.newRepository;
33+
},
34+
toggleCloneRepository(state) {
35+
state.model.cloneRepository = !state.model.cloneRepository;
3236
}
3337
};
3438

@@ -72,6 +76,14 @@ const actions = {
7276
commit({
7377
type: "toggleNewRepository"
7478
});
79+
},
80+
showCloneRepository: ({ commit }) => {
81+
commit({
82+
type: "toggleModelPlaceholder"
83+
});
84+
commit({
85+
type: "toggleCloneRepository"
86+
});
7587
}
7688
};
7789

0 commit comments

Comments
 (0)