<div class="ui depending">
	{{if (and (not .BlockedByDependencies) (not .BlockedByDependenciesNotPermitted) (not .BlockingDependencies) (not .BlockingDependenciesNotPermitted))}}
		<span class="text"><strong>{{ctx.Locale.Tr "repo.issues.dependency.title"}}</strong></span>
		<br>
		<p>
			{{if .Issue.IsPull}}
				{{ctx.Locale.Tr "repo.issues.dependency.pr_no_dependencies"}}
			{{else}}
				{{ctx.Locale.Tr "repo.issues.dependency.issue_no_dependencies"}}
			{{end}}
		</p>
	{{end}}

	{{if or .BlockingDependencies .BlockingDependenciesNotPermitted}}
		<span class="text" data-tooltip-content="{{if .Issue.IsPull}}{{ctx.Locale.Tr "repo.issues.dependency.pr_close_blocks"}}{{else}}{{ctx.Locale.Tr "repo.issues.dependency.issue_close_blocks"}}{{end}}">
			<strong>{{ctx.Locale.Tr "repo.issues.dependency.blocks_short"}}</strong>
		</span>
		<div class="ui relaxed divided list">
			{{range .BlockingDependencies}}
				<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} tw-flex tw-items-center tw-justify-between">
					<div class="item-left tw-flex tw-justify-center tw-flex-col tw-flex-1 gt-ellipsis">
						<a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{RenderRefIssueTitle $.Context .Issue.Title}}">
							#{{.Issue.Index}} {{RenderRefIssueTitle $.Context .Issue.Title}}
						</a>
						<div class="text small gt-ellipsis" data-tooltip-content="{{.Repository.OwnerName}}/{{.Repository.Name}}">
							{{.Repository.OwnerName}}/{{.Repository.Name}}
						</div>
					</div>
					<div class="item-right tw-flex tw-items-center tw-m-1">
						{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
							<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
								{{svg "octicon-trash" 16}}
							</a>
						{{end}}
					</div>
				</div>
			{{end}}
			{{if .BlockingDependenciesNotPermitted}}
				<div class="item tw-flex tw-items-center tw-justify-between gt-ellipsis">
					<span>{{ctx.Locale.TrN (len .BlockingDependenciesNotPermitted) "repo.issues.dependency.no_permission_1" "repo.issues.dependency.no_permission_n" (len .BlockingDependenciesNotPermitted)}}</span>
				</div>
			{{end}}
		</div>
	{{end}}

	{{if or .BlockedByDependencies .BlockedByDependenciesNotPermitted}}
		<span class="text" data-tooltip-content="{{if .Issue.IsPull}}{{ctx.Locale.Tr "repo.issues.dependency.pr_closing_blockedby"}}{{else}}{{ctx.Locale.Tr "repo.issues.dependency.issue_closing_blockedby"}}{{end}}">
			<strong>{{ctx.Locale.Tr "repo.issues.dependency.blocked_by_short"}}</strong>
		</span>
		<div class="ui relaxed divided list">
			{{range .BlockedByDependencies}}
				<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} tw-flex tw-items-center tw-justify-between">
					<div class="item-left tw-flex tw-justify-center tw-flex-col tw-flex-1 gt-ellipsis">
						{{$title := RenderRefIssueTitle $.Context .Issue.Title}}
						<a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{RenderRefIssueTitle $.Context .Issue.Title}}">
							#{{.Issue.Index}} {{RenderRefIssueTitle $.Context .Issue.Title}}
						</a>
						<div class="text small gt-ellipsis" data-tooltip-content="{{.Repository.OwnerName}}/{{.Repository.Name}}">
							{{.Repository.OwnerName}}/{{.Repository.Name}}
						</div>
					</div>
					<div class="item-right tw-flex tw-items-center tw-m-1">
						{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
							<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blockedBy" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
								{{svg "octicon-trash" 16}}
							</a>
						{{end}}
					</div>
				</div>
			{{end}}
			{{if $.CanCreateIssueDependencies}}
				{{range .BlockedByDependenciesNotPermitted}}
					<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} tw-flex tw-items-center tw-justify-between">
						<div class="item-left tw-flex tw-justify-center tw-flex-col tw-flex-1 gt-ellipsis">
							<div class="gt-ellipsis">
								<span data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.no_permission.can_remove"}}">{{svg "octicon-lock" 16}}</span>
								<span class="title" data-tooltip-content="#{{.Issue.Index}} {{RenderRefIssueTitle $.Context .DependentIssue.Title}}">
									#{{.Issue.Index}} {{RenderRefIssueTitle $.Context .DependentIssue.Title}}
								</span>
							</div>
							<div class="text small gt-ellipsis" data-tooltip-content="{{.Repository.OwnerName}}/{{.Repository.Name}}">
								{{.Repository.OwnerName}}/{{.Repository.Name}}
							</div>
						</div>
						<div class="item-right tw-flex tw-items-center tw-m-1">
							{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
								<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
									{{svg "octicon-trash" 16}}
								</a>
							{{end}}
						</div>
					</div>
				{{end}}
			{{else if .BlockedByDependenciesNotPermitted}}
				<div class="item tw-flex tw-items-center tw-justify-between gt-ellipsis">
					<span>{{ctx.Locale.TrN (len .BlockedByDependenciesNotPermitted) "repo.issues.dependency.no_permission_1" "repo.issues.dependency.no_permission_n" (len .BlockedByDependenciesNotPermitted)}}</span>
				</div>
			{{end}}
		</div>
	{{end}}

	{{if and .CanCreateIssueDependencies (not .Repository.IsArchived)}}
		<div>
			<form method="post" action="{{.Issue.Link}}/dependency/add" id="addDependencyForm">
				{{$.CsrfTokenHtml}}
				<div class="ui fluid action input">
					<div class="ui search selection dropdown" id="new-dependency-drop-list" data-issue-id="{{.Issue.ID}}">
						<input name="newDependency" type="hidden">
						{{svg "octicon-triangle-down" 14 "dropdown icon"}}
						<input type="text" class="search">
						<div class="default text">{{ctx.Locale.Tr "repo.issues.dependency.add"}}</div>
					</div>
					<button class="ui icon button">
						{{svg "octicon-plus"}}
					</button>
				</div>
			</form>
		</div>
	{{end}}
</div>

{{if and .CanCreateIssueDependencies (not .Repository.IsArchived)}}
	<input type="hidden" id="crossRepoSearch" value="{{.AllowCrossRepositoryDependencies}}">

	<div class="ui g-modal-confirm modal remove-dependency">
		<div class="header">
			{{svg "octicon-trash"}}
			{{ctx.Locale.Tr "repo.issues.dependency.remove_header"}}
		</div>
		<div class="content">
			<form method="post" action="{{.Issue.Link}}/dependency/delete" id="removeDependencyForm">
				{{$.CsrfTokenHtml}}
				<input type="hidden" value="" name="removeDependencyID" id="removeDependencyID">
				<input type="hidden" value="" name="dependencyType" id="dependencyType">
			</form>
			<p>{{if .Issue.IsPull}}
				{{ctx.Locale.Tr "repo.issues.dependency.pr_remove_text"}}
			{{else}}
				{{ctx.Locale.Tr "repo.issues.dependency.issue_remove_text"}}
			{{end}}</p>
		</div>
		{{$ModalButtonCancelText := ctx.Locale.Tr "repo.issues.dependency.cancel"}}
		{{$ModalButtonOkText := ctx.Locale.Tr "repo.issues.dependency.remove"}}
		{{template "base/modal_actions_confirm" (dict "." . "ModalButtonCancelText" $ModalButtonCancelText "ModalButtonOkText" $ModalButtonOkText)}}
	</div>
{{end}}
