Kanban board (#8346)

Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: jaqra <48099350+jaqra@users.noreply.github.com>
Co-authored-by: Kerry <flatline-studios@users.noreply.github.com>
Co-authored-by: Jaqra <jaqra@hotmail.com>
Co-authored-by: Kyle Evans <kevans91@users.noreply.github.com>
Co-authored-by: Tsakiridis Ilias <TsakiDev@users.noreply.github.com>
Co-authored-by: Ilias Tsakiridis <ilias.tsakiridis@outlook.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>

12 files changed, 547 insertions, 3 deletions

diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl
index 0760354e43..8c14ccfb6d 100644
--- a/templates/base/head.tmpl
+++ b/templates/base/head.tmpl
@@ -44,6 +44,7 @@
 				MaxTimeout: {{NotificationSettings.MaxTimeout}},
 				EventSourceUpdateTime: {{NotificationSettings.EventSourceUpdateTime}},
 			},
+			PageIsProjects: {{if .PageIsProjects }}true{{else}}false{{end}},
       {{if .RequireTribute}}
 			tributeValues: Array.from(new Map([
 				{{ range .Participants }}
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index 494d54b428..1cfdb7287b 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -99,6 +99,15 @@
 					</a>
 				{{end}}
 
+				{{ if and (not .UnitProjectsGlobalDisabled) (.Permission.CanRead $.UnitTypeProjects)}}
+					<a href="{{.RepoLink}}/projects" class="{{ if .IsProjectsPage }}active{{end}} item">
+						{{svg "octicon-project" 16}} {{.i18n.Tr "repo.project_board"}}
+						<span class="ui {{if not .Repository.NumOpenProjects}}gray{{else}}blue{{end}} small label">
+							{{.Repository.NumOpenProjects}}
+						</span>
+					</a>
+				{{ end }}
+
 				{{if and (.Permission.CanRead $.UnitTypeReleases) (not .IsEmptyRepo) }}
 				<a class="{{if .PageIsReleaseList}}active{{end}} item" href="{{.RepoLink}}/releases">
 					{{svg "octicon-tag" 16}} {{.i18n.Tr "repo.releases"}} <span class="ui {{if not .NumReleases}}gray{{else}}blue{{end}} small label">{{.NumReleases}}</span>
diff --git a/templates/repo/issue/new_form.tmpl b/templates/repo/issue/new_form.tmpl
index 38ccccaf7b..8d7b3902e4 100644
--- a/templates/repo/issue/new_form.tmpl
+++ b/templates/repo/issue/new_form.tmpl
@@ -136,6 +136,64 @@
 				</div>
 			</div>
 
+			{{if .IsProjectsEnabled}}
+			<div class="ui divider"></div>
+
+			<input id="project_id" name="project_id" type="hidden" value="{{.project_id}}">
+			<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating jump select-project dropdown">
+			  <span class="text">
+			    <strong>{{.i18n.Tr "repo.issues.new.projects"}}</strong>
+			    {{if .HasIssuesOrPullsWritePermission}}
+			      {{svg "octicon-gear" 16}}
+			    {{end}}
+			  </span>
+			  <div class="menu">
+			    <div class="header" style="text-transform: none;font-size:16px;">{{.i18n.Tr "repo.issues.new.add_project_title"}}</div>
+			    {{if or .OpenProjects .ClosedProjects}}
+			    <div class="ui icon search input">
+			      <i class="search icon"></i>
+			      <input type="text" placeholder="{{.i18n.Tr "repo.issues.filter_projects"}}">
+			    </div>
+			    {{end}}
+			    <div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_projects"}}</div>
+			    {{if and (not .OpenProjects) (not .ClosedProjects)}}
+			      <div class="header" style="text-transform: none;font-size:14px;">
+			        {{.i18n.Tr "repo.issues.new.no_items"}}
+			      </div>
+			    {{else}}
+			      {{if .OpenProjects}}
+			        <div class="divider"></div>
+			        <div class="header">
+			          {{svg "octicon-project" 16}}
+			          {{.i18n.Tr "repo.issues.new.open_projects"}}
+			        </div>
+			        {{range .OpenProjects}}
+			          <div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</div>
+			        {{end}}
+			      {{end}}
+			      {{if .ClosedProjects}}
+			        <div class="divider"></div>
+			        <div class="header">
+			          {{svg "octicon-project" 16}}
+			          {{.i18n.Tr "repo.issues.new.closed_projects"}}
+			        </div>
+			        {{range .ClosedProjects}}
+			          <a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</a>
+			        {{end}}
+			      {{end}}
+			    {{end}}
+			  </div>
+			</div>
+			<div class="ui select-project list">
+			  <span class="no-select item {{if .Project}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_projects"}}</span>
+			  <div class="selected">
+			    {{if .Project}}
+			      <a class="item" href="{{.RepoLink}}/projects/{{.Project.ID}}">{{.Project.Title}}</a>
+			    {{end}}
+			  </div>
+			</div>
+			{{end}}
+
 			<div class="ui divider"></div>
 
 				<input id="assignee_ids" name="assignee_ids" type="hidden" value="{{.assignee_ids}}">
@@ -176,4 +234,3 @@
 		</div>
 	</div>
 </form>
-
diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl
index 8e7829bf7c..850c5b9157 100644
--- a/templates/repo/issue/view_content/comments.tmpl
+++ b/templates/repo/issue/view_content/comments.tmpl
@@ -8,7 +8,7 @@
 	 18 = REMOVED_DEADLINE, 19 = ADD_DEPENDENCY, 20 = REMOVE_DEPENDENCY, 21 = CODE,
 	 22 = REVIEW, 23 = ISSUE_LOCKED, 24 = ISSUE_UNLOCKED, 25 = TARGET_BRANCH_CHANGED,
 	 26 = DELETE_TIME_MANUAL, 27 = REVIEW_REQUEST, 28 = MERGE_PULL_REQUEST,
-	 29 = PULL_PUSH_EVENT -->
+	 29 = PULL_PUSH_EVENT, 30 = PROJECT_CHANGED, 31 = PROJECT_BOARD_CHANGED -->
 	{{if eq .Type 0}}
 		<div class="timeline-item comment" id="{{.HashTag}}">
 		{{if .OriginalAuthor }}
@@ -616,5 +616,26 @@
 		{{if not .IsForcePush}}
 			{{template "repo/commits_list_small" dict "comment" . "root" $}}
 		{{end}}
+	{{else if eq .Type 30}}
+		{{if not $.UnitProjectsGlobalDisabled}}
+		<div class="timeline-item event" id="{{.HashTag}}">
+			<span class="badge">{{svg "octicon-project" 16}}</span>
+			<a class="ui avatar image" href="{{.Poster.HomeLink}}">
+				<img src="{{.Poster.RelAvatarLink}}">
+			</a>
+			<span class="text grey">
+				<a class="author" href="{{.Poster.HomeLink}}">{{.Poster.GetDisplayName}}</a>
+				{{if gt .OldProjectID 0}}
+					{{if gt .ProjectID 0}}
+						{{$.i18n.Tr "repo.issues.change_project_at" (.OldProject.Title|Escape) (.Project.Title|Escape) $createdStr | Safe}}
+					{{else}}
+						{{$.i18n.Tr "repo.issues.remove_project_at" (.OldProject.Title|Escape) $createdStr | Safe}}
+					{{end}}
+				{{else if gt .ProjectID 0}}
+					{{$.i18n.Tr "repo.issues.add_project_at" (.Project.Title|Escape) $createdStr | Safe}}
+				{{end}}
+			</span>
+		</div>
+		{{end}}
 	{{end}}
 {{end}}
diff --git a/templates/repo/issue/view_content/sidebar.tmpl b/templates/repo/issue/view_content/sidebar.tmpl
index 9d897ad473..71e84de2fa 100644
--- a/templates/repo/issue/view_content/sidebar.tmpl
+++ b/templates/repo/issue/view_content/sidebar.tmpl
@@ -192,6 +192,48 @@
 			</div>
 		</div>
 
+		{{if .IsProjectsEnabled}}
+		<div class="ui divider"></div>
+		
+		<div class="ui {{if or (not .HasIssuesOrPullsWritePermission) .Repository.IsArchived}}disabled{{end}} floating jump select-project dropdown">
+			<span class="text">
+				<strong>{{.i18n.Tr "repo.issues.new.projects"}}</strong>
+				{{svg "octicon-gear" 16}}
+			</span>
+			<div class="menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/projects">
+				<div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_projects"}}</div>
+				{{if .OpenProjects}}
+					<div class="divider"></div>
+					<div class="header">
+						{{svg "octicon-project" 16}}
+						{{.i18n.Tr "repo.issues.new.open_projects"}}
+					</div>
+					{{range .OpenProjects}}
+						<div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{svg "octicon-project" 16}} {{.Title}}</div>
+					{{end}}
+				{{end}}
+				{{if .ClosedProjects}}
+					<div class="divider"></div>
+					<div class="header">
+						{{svg "octicon-project" 16}}
+						{{.i18n.Tr "repo.issues.new.closed_projects"}}
+					</div>
+					{{range .ClosedProjects}}
+						<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{svg "octicon-project" 16}} {{.Title}}</a>
+					{{end}}
+				{{end}}
+			</div>
+		</div>
+		<div class="ui select-project list">
+			<span class="no-select item {{if .Issue.ProjectID}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_projects"}}</span>
+			<div class="selected">
+				{{if .Issue.ProjectID}}
+					<a class="item" href="{{.RepoLink}}/projects/{{.Issue.ProjectID}}">{{svg "octicon-project" 16}} {{.Issue.Project.Title}}</a>
+				{{end}}
+			</div>
+		</div>
+		{{end}}
+
 		<div class="ui divider"></div>
 
 		<input id="assignee_id" name="assignee_id" type="hidden" value="{{.assignee_id}}">
diff --git a/templates/repo/projects/list.tmpl b/templates/repo/projects/list.tmpl
new file mode 100644
index 0000000000..f48cf400ba
--- /dev/null
+++ b/templates/repo/projects/list.tmpl
@@ -0,0 +1,99 @@
+{{template "base/head" .}}
+<div class="repository milestones">
+	{{template "repo/header" .}}
+	<div class="ui container">
+		<div class="navbar">
+			{{template "repo/issue/navbar" .}}
+			{{if and (or .CanWriteIssues .CanWritePulls) (not .Repository.IsArchived)}}
+			<div class="ui right">
+				<a class="ui green button" href="{{$.Link}}/new">{{.i18n.Tr "repo.projects.new"}}</a>
+			</div>
+			{{end}}
+		</div>
+		<div class="ui divider"></div>
+		{{template "base/alert" .}}
+		<div class="ui tiny basic buttons">
+			<a class="ui {{if not .IsShowClosed}}green active{{end}} basic button" href="{{.RepoLink}}/projects?state=open">
+				{{svg "octicon-project" 16}}
+				{{.i18n.Tr "repo.issues.open_tab" .OpenCount}}
+			</a>
+			<a class="ui {{if .IsShowClosed}}red active{{end}} basic button" href="{{.RepoLink}}/projects?state=closed">
+				{{svg "octicon-check" 16}}
+				{{.i18n.Tr "repo.milestones.close_tab" .ClosedCount}}
+			</a>
+		</div>
+
+		<div class="ui right floated secondary filter menu">
+			<!-- Sort -->
+			<div class="ui dropdown type jump item">
+				<span class="text">
+					{{.i18n.Tr "repo.issues.filter_sort"}}
+					<i class="dropdown icon"></i>
+				</span>
+				<div class="menu">
+					<a class="{{if eq .SortType "oldest"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&sort=oldest&state={{$.State}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a>
+					<a class="{{if eq .SortType "recentupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&sort=recentupdate&state={{$.State}}">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</a>
+					<a class="{{if eq .SortType "leastupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&sort=leastupdate&state={{$.State}}">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</a>
+				</div>
+			</div>
+		</div>
+		<div class="milestone list">
+			{{range .Projects}}
+			<li class="item">
+				{{svg "octicon-project" 16}} <a href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</a>
+				<div class="meta">
+					{{ $closedDate:= TimeSinceUnix .ClosedDateUnix $.Lang }}
+					{{if .IsClosed }}
+						{{svg "octicon-clock" 16}} {{$.i18n.Tr "repo.milestones.closed" $closedDate|Str2html}}
+					{{end}}
+					<span class="issue-stats">
+						{{svg "octicon-issue-opened" 16}} {{$.i18n.Tr "repo.issues.open_tab" .NumOpenIssues}}
+						{{svg "octicon-issue-closed" 16}} {{$.i18n.Tr "repo.issues.close_tab" .NumClosedIssues}}
+					</span>
+				</div>
+				{{if and (or $.CanWriteIssues $.CanWritePulls) (not $.Repository.IsArchived)}}
+				<div class="ui right operate">
+					<a href="{{$.Link}}/{{.ID}}/edit" data-id={{.ID}} data-title={{.Title}}>{{svg "octicon-pencil" 16}} {{$.i18n.Tr "repo.issues.label_edit"}}</a>
+					{{if .IsClosed}}
+						<a class="link-action" href data-url="{{$.Link}}/{{.ID}}/open">{{svg "octicon-check" 16}} {{$.i18n.Tr "repo.projects.open"}}</a>
+					{{else}}
+						<a class="link-action" href data-url="{{$.Link}}/{{.ID}}/close">{{svg "octicon-x" 16}} {{$.i18n.Tr "repo.projects.close"}}</a>
+					{{end}}
+					<a class="delete-button" href="#" data-url="{{$.RepoLink}}/projects/{{.ID}}/delete" data-id="{{.ID}}">{{svg "octicon-trashcan" 16}} {{$.i18n.Tr "repo.issues.label_delete"}}</a>
+				</div>
+				{{end}}
+				{{if .Description}}
+				<div class="content">
+					{{.RenderedContent|Str2html}}
+				</div>
+				{{end}}
+			</li>
+			{{end}}
+
+			{{template "base/paginate" .}}
+		</div>
+	</div>
+</div>
+
+{{if or .CanWriteIssues .CanWritePulls}}
+<div class="ui small basic delete modal">
+	<div class="ui icon header">
+		<i class="trash icon"></i>
+		{{.i18n.Tr "repo.projects.deletion"}}
+	</div>
+	<div class="content">
+		<p>{{.i18n.Tr "repo.projects.deletion_desc"}}</p>
+	</div>
+	<div class="actions">
+		<div class="ui red basic inverted cancel button">
+			<i class="remove icon"></i>
+			{{.i18n.Tr "modal.no"}}
+		</div>
+		<div class="ui green basic inverted ok button">
+			<i class="checkmark icon"></i>
+			{{.i18n.Tr "modal.yes"}}
+		</div>
+	</div>
+</div>
+{{end}}
+{{template "base/footer" .}}
diff --git a/templates/repo/projects/new.tmpl b/templates/repo/projects/new.tmpl
new file mode 100644
index 0000000000..2da722bf9e
--- /dev/null
+++ b/templates/repo/projects/new.tmpl
@@ -0,0 +1,70 @@
+{{template "base/head" .}}
+<div class="repository new milestone">
+	{{template "repo/header" .}}
+	<div class="ui container">
+		<div class="navbar">
+			{{template "repo/issue/navbar" .}}
+			{{if and (or .CanWriteIssues .CanWritePulls) .PageIsEditProject}}
+			<div class="ui right floated secondary menu">
+				<a class="ui green button" href="{{$.RepoLink}}/projects/new">{{.i18n.Tr "repo.milestones.new"}}</a>
+			</div>
+			{{end}}
+		</div>
+		<div class="ui divider"></div>
+		<h2 class="ui dividing header">
+			{{if .PageIsEditProjects}}
+			{{.i18n.Tr "repo.projects.edit"}}
+			<div class="sub header">{{.i18n.Tr "repo.projects.edit_subheader"}}</div>
+			{{else}}
+				{{.i18n.Tr "repo.projects.new"}}
+				<div class="sub header">{{.i18n.Tr "repo.projects.new_subheader"}}</div>
+				{{end}}
+		</h2>
+		{{template "base/alert" .}}
+		<form class="ui form grid" action="{{.Link}}" method="post">
+			{{.CsrfTokenHtml}}
+			<div class="eleven wide column">
+				<div class="field {{if .Err_Title}}error{{end}}">
+					<label>{{.i18n.Tr "repo.projects.title"}}</label>
+					<input name="title" placeholder="{{.i18n.Tr "repo.projects.title"}}" value="{{.title}}" autofocus required>
+				</div>
+				<div class="field">
+					<label>{{.i18n.Tr "repo.projects.desc"}}</label>
+					<textarea name="content">{{.content}}</textarea>
+				</div>
+
+				{{if not .PageIsEditProjects}}
+					<label>{{.i18n.Tr "repo.projects.template.desc"}}</label>
+					<div class="ui selection dropdown">
+						<input type="hidden" name="board_type" value="{{.type}}">
+						<div class="default text">{{.i18n.Tr "repo.projects.template.desc_helper"}}</div>
+						<div class="menu">
+							{{range $element := .ProjectTypes}}
+								<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.i18n.Tr $element.Translation}}</div>
+							{{end}}
+						</div>
+					</div>
+				{{end}}
+			</div>
+			<div class="ui container">
+				<div class="ui divider"></div>
+				<div class="ui left">
+					{{if .PageIsEditProjects}}
+					<a class="ui blue basic button" href="{{.RepoLink}}/projects">
+						{{.i18n.Tr "repo.milestones.cancel"}}
+					</a>
+					<button class="ui green button">
+						{{.i18n.Tr "repo.projects.modify"}}
+					</button>
+					{{else}}
+						<button class="ui green button">
+							{{.i18n.Tr "repo.projects.create"}}
+						</button>
+					{{end}}
+				</div>
+			</div>
+
+		</form>
+	</div>
+</div>
+{{template "base/footer" .}}
diff --git a/templates/repo/projects/view.tmpl b/templates/repo/projects/view.tmpl
new file mode 100644
index 0000000000..21c6f01733
--- /dev/null
+++ b/templates/repo/projects/view.tmpl
@@ -0,0 +1,153 @@
+{{template "base/head" .}}
+<div class="repository">
+	{{template "repo/header" .}}
+	<div class="ui container">
+		<div class="ui three column stackable grid">
+			<div class="column">
+				{{template "repo/issue/navbar" .}}
+			</div>
+			<div class="column center aligned">
+				{{template "repo/issue/search" .}}
+			</div>
+			<div class="column right aligned">
+				{{if .PageIsProjects}}
+				<a class="ui green button show-modal item" data-modal="#new-board-item">{{.i18n.Tr "new_project_board"}}</a>
+				{{end}}
+
+				<div class="ui small modal" id="new-board-item">
+					<div class="header">
+						{{$.i18n.Tr "repo.projects.board.new"}}
+					</div>
+					<div class="content">
+						<form class="ui form">
+							<div class="required field">
+								<label for="new_board">{{$.i18n.Tr "repo.projects.board.new_title"}}</label>
+								<input class="new-board" id="new_board" name="title" required>
+							</div>
+
+							<div class="text right actions">
+								<div class="ui cancel button">{{$.i18n.Tr "settings.cancel"}}</div>
+								<button data-url="{{$.RepoLink}}/projects/{{$.Project.ID}}" class="ui green button" id="new_board_submit">{{$.i18n.Tr "repo.projects.board.new_submit"}}</button>
+							</div>
+						</form>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="ui divider"></div>
+	</div>
+
+	<div class="ui container fluid padded" id="project-board">
+
+		<div class="board">
+			{{ range $board := .Boards }}
+
+			<div class="ui segment board-column">
+				<div class="board-column-header">
+					<div class="ui large label board-label">{{.Title}}</div>
+
+					{{ if $.IsSigned }}
+					{{ if not (eq .ID 0) }}
+					<div class="ui dropdown jump item poping up right" data-variation="tiny inverted">
+						<span class="ui text">
+							<img class="ui tiny avatar image" width="24" height="24">
+							<span class="fitted not-mobile" tabindex="-1">{{svg "octicon-kebab-horizontal" 24}}</span>
+						</span>
+						<div class="menu user-menu" tabindex="-1">
+							<a class="item show-modal button" data-modal="#edit-project-board-modal-{{.ID}}">
+								{{svg "octicon-pencil" 16}}
+								{{$.i18n.Tr "repo.projects.board.edit"}}
+							</a>
+							<a class="item show-modal button" data-modal="#delete-board-modal-{{.ID}}">
+								{{svg "octicon-trashcan" 16}}
+								{{$.i18n.Tr "repo.projects.board.delete"}}
+							</a>
+
+							<div class="ui small modal edit-project-board" id="edit-project-board-modal-{{.ID}}">
+								<div class="header">
+									{{$.i18n.Tr "repo.projects.board.edit"}}
+								</div>
+								<div class="content">
+									<form class="ui form">
+										<div class="required field">
+											<label for="new_board_title">{{$.i18n.Tr "repo.projects.board.edit_title"}}</label>
+											<input class="project-board-title" id="new_board_title" name="title" value="{{.Title}}" required>
+										</div>
+
+										<div class="text right actions">
+											<div class="ui cancel button">{{$.i18n.Tr "settings.cancel"}}</div>
+											<button data-url="{{$.RepoLink}}/projects/{{$.Project.ID}}/{{.ID}}" class="ui red button">{{$.i18n.Tr "repo.projects.board.edit"}}</button>
+										</div>
+									</form>
+								</div>
+							</div>
+
+							<div class="ui basic modal" id="delete-board-modal-{{.ID}}">
+								<div class="ui icon header">
+									{{$.i18n.Tr "repo.projects.board.delete"}}
+								</div>
+								<div class="content center">
+									<input type="hidden" name="action" value="delete">
+									<div class="field">
+										<label>
+											{{$.i18n.Tr "repo.projects.board.deletion_desc"}}
+										</label>
+									</div>
+								</div>
+								<form class="ui form" method="post">
+									<div class="text right actions">
+										<div class="ui cancel button">{{$.i18n.Tr "settings.cancel"}}</div>
+										<button class="ui red button delete-project-board" data-url="{{$.RepoLink}}/projects/{{$.Project.ID}}/{{.ID}}">{{$.i18n.Tr "repo.projects.board.delete"}}</button>
+									</div>
+								</form>
+							</div>
+						</div>
+					</div>
+					{{ end }}
+					{{ end }}
+				</div>
+				<div class="ui divider"></div>
+
+				<div class="ui cards board" data-url="{{$.RepoLink}}/projects/{{$.Project.ID}}/{{.ID}}" data-project="{{$.Project.ID}}" data-board="{{.ID}}" id="board_{{.ID}}">
+
+					{{ range .Issues }}
+
+					<!-- start issue card -->
+					<div class="card board-card" data-issue="{{.ID}}">
+						<div class="content">
+							<div class="header">
+								<span class="{{if .IsClosed}}red{{else}}green{{end}}">
+									{{if .IsPull}}{{svg "octicon-git-merge" 16}}
+									{{else if .IsClosed}}{{svg "octicon-issue-closed" 16}}
+									{{else}}{{svg "octicon-issue-opened" 16}}
+									{{end}}
+								</span>
+								<a class="project-board-title" href="{{$.RepoLink}}/issues/{{.Index}}">#{{.Index}} {{.Title}}</a>
+							</div>
+							<div class="meta">
+								{{ if .MilestoneID }}
+								<a class="milestone" href="{{$.RepoLink}}/milestone/{{ .MilestoneID}}">
+									{{svg "octicon-milestone" 16}} {{ .Milestone.Name }}
+								</a>
+								{{ end }}
+							</div>
+						</div>
+						<div class="extra content">
+							{{ range .Labels }}
+							<a class="ui label has-emoji" href="{{$.RepoLink}}/issues?labels={{.ID}}" style="color: {{.ForegroundColor}}; background-color: {{.Color}}; margin-bottom: 3px;" title="{{.Description}}">{{.Name}}</a>
+							{{ end }}
+						</div>
+					</div>
+					<!-- stop issue card -->
+
+					{{ end }}
+				</div>
+			</div>
+			{{ end }}
+		</div>
+
+	</div>
+
+</div>
+
+{{template "base/footer" .}}
diff --git a/templates/repo/settings/options.tmpl b/templates/repo/settings/options.tmpl
index 5666b8f956..d2d51fe6ea 100644
--- a/templates/repo/settings/options.tmpl
+++ b/templates/repo/settings/options.tmpl
@@ -269,6 +269,21 @@
 					</div>
 				</div>
 
+				<div class="ui divider"></div>
+
+				{{$isProjectsEnabled := .Repository.UnitEnabled $.UnitTypeProjects}}
+				<div class="inline field">
+					<label>{{.i18n.Tr "repo.project_board"}}</label>
+					{{if .UnitTypeProjects.UnitGlobalDisabled}}
+					<div class="ui checkbox poping up disabled" data-content="{{.i18n.Tr "repo.unit_disabled"}}">
+					{{else}}
+					<div class="ui checkbox">
+					{{end}}
+						<input class="enable-system" name="enable_projects" type="checkbox" {{if $isProjectsEnabled}}checked{{end}}>
+						<label>{{.i18n.Tr "repo.settings.projects_desc"}}</label>
+					</div>
+				</div>
+
 				{{if .Repository.CanEnablePulls}}
 					<div class="ui divider"></div>
 					{{$pullRequestEnabled := .Repository.UnitEnabled $.UnitTypePullRequests}}
diff --git a/templates/swagger/v1_json.tmpl b/templates/swagger/v1_json.tmpl
index d5e5c86cd8..ec4570b488 100644
--- a/templates/swagger/v1_json.tmpl
+++ b/templates/swagger/v1_json.tmpl
@@ -12487,6 +12487,11 @@
           "type": "boolean",
           "x-go-name": "HasIssues"
         },
+        "has_projects": {
+          "description": "either `true` to enable project unit, or `false` to disable them.",
+          "type": "boolean",
+          "x-go-name": "HasProjects"
+        },
         "has_pull_requests": {
           "description": "either `true` to allow pull requests, or `false` to prevent pull request.",
           "type": "boolean",
@@ -14271,6 +14276,10 @@
           "type": "boolean",
           "x-go-name": "HasIssues"
         },
+        "has_projects": {
+          "type": "boolean",
+          "x-go-name": "HasProjects"
+        },
         "has_pull_requests": {
           "type": "boolean",
           "x-go-name": "HasPullRequests"
diff --git a/templates/user/profile.tmpl b/templates/user/profile.tmpl
index f453898f94..2de8dc95b5 100644
--- a/templates/user/profile.tmpl
+++ b/templates/user/profile.tmpl
@@ -82,7 +82,7 @@
 			</div>
 			<div class="ui eleven wide column">
 				<div class="ui secondary stackable pointing menu">
-					<a class='{{if and (ne .TabName "activity") (ne .TabName "following") (ne .TabName "followers") (ne .TabName "stars")}}active{{end}} item' href="{{.Owner.HomeLink}}">
+					<a class='{{if and (ne .TabName "activity") (ne .TabName "following") (ne .TabName "followers") (ne .TabName "stars") (ne .TabName "projects")}}active{{end}} item' href="{{.Owner.HomeLink}}">
 						{{svg "octicon-repo" 16}} {{.i18n.Tr "user.repositories"}}
 					</a>
 					<a class='{{if eq .TabName "activity"}}active{{end}} item' href="{{.Owner.HomeLink}}?tab=activity">
diff --git a/templates/user/project.tmpl b/templates/user/project.tmpl
new file mode 100644
index 0000000000..662544a366
--- /dev/null
+++ b/templates/user/project.tmpl
@@ -0,0 +1,68 @@
+{{template "base/head" .}}
+<div class="repository new repo">
+	<div class="ui middle very relaxed page grid">
+		<div class="column">
+			<form class="ui form" action="{{.Link}}" method="post">
+				{{.CsrfTokenHtml}}
+				<h3 class="ui top attached header">
+					{{.i18n.Tr "new_project"}}
+				</h3>
+				<div class="ui attached segment">
+					{{template "base/alert" .}}
+					<div class="inline required field {{if .Err_Owner}}error{{end}}">
+						<label>{{.i18n.Tr "repo.owner"}}</label>
+						<div class="ui selection owner dropdown">
+							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
+							<span class="text" title="{{.ContextUser.Name}}">
+								<img class="ui mini image" src="{{.ContextUser.RelAvatarLink}}">
+								{{.ContextUser.ShortName 20}}
+							</span>
+							<i class="dropdown icon"></i>
+							<div class="menu">
+								<div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}">
+									<img class="ui mini image" src="{{.SignedUser.RelAvatarLink}}"> {{.SignedUser.ShortName 20}}
+								</div>
+								{{range .Orgs}}
+								<div class="item" data-value="{{.ID}}" title="{{.Name}}">
+									<img class="ui mini image" src="{{.RelAvatarLink}}"> {{.ShortName 20}}
+								</div>
+								{{end}}
+							</div>
+						</div>
+					</div>
+
+					<div class="inline field {{if .Err_Title}}error{{end}}">
+						<label>{{.i18n.Tr "repo.projects.title"}}</label>
+						<input name="title" placeholder="{{.i18n.Tr "repo.projects.title"}}" value="{{.title}}" autofocus required>
+					</div>
+					<div class="inline field">
+						<label>{{.i18n.Tr "repo.projects.desc"}}</label>
+						<textarea name="content">{{.content}}</textarea>
+					</div>
+
+					<div class="inline field">
+						<label>{{.i18n.Tr "repo.projects.template.desc"}}</label>
+						<div class="ui selection dropdown">
+							<input type="hidden" name="board_type" value="{{.type}}">
+							<div class="default text">{{.i18n.Tr "repo.projects.template.desc_helper"}}</div>
+							<div class="menu">
+								{{range $element := .ProjectTypes}}
+								<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.i18n.Tr $element.Translation}}</div>
+								{{end}}
+							</div>
+						</div>
+					</div>
+
+					<div class="inline field">
+						<label></label>
+						<button class="ui green button">
+							{{.i18n.Tr "repo.projects.create" }}
+						</button>
+						<a class="ui button" href="{{AppSubUrl}}/">{{.i18n.Tr "cancel"}}</a>
+					</div>
+				</div>
+			</form>
+		</div>
+	</div>
+</div>
+{{template "base/footer" .}}