Skip to content

Commit

Permalink
feat(layout): Ticket Meta fields made inline editable
Browse files Browse the repository at this point in the history
ref: #42 #44 closes #12
  • Loading branch information
jon-nfc committed Jan 21, 2025
1 parent f08e88d commit e8eaab3
Show file tree
Hide file tree
Showing 3 changed files with 121 additions and 132 deletions.
5 changes: 3 additions & 2 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import History from "./layout/history";
import Settings from "./layout/Settings";
import urlBuilder from "./hooks/urlBuilder";
import { apiFetch } from "./hooks/apiFetch";
import { InlineFieldAction } from "./components/InlineFields";
import MainLayout from "./layout/Main";

const Login = () => {
Expand Down Expand Up @@ -105,10 +106,10 @@ function App() {
******************************************************** */}

<Route path=":common_model/:common_pk/project_task/:pk" element={<Ticket
/>} loader = {pagedLoader}/>
/>} loader = {pagedLoader} action={InlineFieldAction} />

<Route path="ticket/:model/:pk" element={<Ticket
/>} loader = {pagedLoader}/>
/>} loader = {pagedLoader} action={InlineFieldAction} />

{/* ********************************************************
Detail View
Expand Down
23 changes: 8 additions & 15 deletions src/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -464,6 +464,7 @@ div.content-header .column.right svg {
width: 30px;
}


svg.help {
fill: var(--contrasting-colour);
}
Expand Down Expand Up @@ -570,6 +571,13 @@ article div.ticket div.metadata div {
border: none;
}

.ticket .metadata fieldset input,
.ticket .metadata fieldset select {
padding: 0px;
margin: 0px;
width: 100%;
}

.ticket .metadata fieldset label {
display: block;
font-weight: bold;
Expand Down Expand Up @@ -1814,21 +1822,6 @@ div.submit-dropdown-button div.button svg {
display:block;
}

button.form {
background-color: var(--contrasting-colour);
color: var(--text-colour-button);
border: none;
font-size: inherit;
height: 30px;
margin: 5px;
padding: 0px 20px;
}

form button.inverse {
background-color: var(--background-colour-active);
color: var(--contrasting-colour);
}

footer {
background-color: var(--background-colour-active);
display: grid;
Expand Down
225 changes: 110 additions & 115 deletions src/layout/Ticket.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import LinkedItems from "../components/page/ticket/LinkedItems";
import RelatedTickets from "../components/page/ticket/RelatedTickets";
import TicketComments from "../components/page/ticket/TicketComments";
import MarkdownEditor from "../components/MarkdownEditor";
import InlineField from "../components/InlineFields";
import ContentHeader from "../components/page/ContentHeader";


Expand Down Expand Up @@ -175,19 +176,19 @@ const Ticket = () => {
<FieldData
metadata={metadata}
field_name='opened_by'
data={page_data}
data={ticket_data}
/>&nbsp;
<span class="sub-script">on&nbsp;</span>
<FieldData
metadata={metadata}
field_name='created'
data={page_data}
data={ticket_data}
/>&nbsp;
<span class="sub-script">Updated&nbsp;</span>
<FieldData
metadata={metadata}
field_name='modified'
data={page_data}
data={ticket_data}
/>
</h3>
<div className="markdown">
Expand All @@ -201,7 +202,7 @@ const Ticket = () => {
</section>
}

<div>
<div>
{ page_data['_urls']['related_tickets'] &&
<RelatedTickets
data_url={String(page_data['_urls']['related_tickets']).split('api/v2')[1]}
Expand All @@ -224,124 +225,118 @@ const Ticket = () => {
comments_url = {String(page_data['_urls']['comments']).split('api/v2')[1] + '?page[size]=500'}
ticket_id = {page_data['id']}
/>}
</div>
</div>
</div>

<div className="sidebar">
<div className="sidebar">

<div className="metadata">
<div>
<div className="metadata">
<div>

<h3 className={"metadata ticket-type-" + ticket_type}>
Ticket&nbsp;#
<FieldData
metadata={metadata}
field_name='id'
data={page_data}
/>
&nbsp;
{page_data['external_ref'] &&(
('( #') + page_data['external_ref'] + (')')
)}
</h3>

<fieldset>
<label>Assigned</label>
<span className="text">
<FieldData
metadata={metadata}
field_name='assigned_users'
data={page_data}
/>
</span>
</fieldset>
<fieldset>
<label>Status</label>
<span className="text">
<FieldData
metadata={metadata}
field_name='status_badge'
data={page_data}
/>
</span>
</fieldset>
<fieldset>
<label>Labels</label>
<span className="text">val</span>
</fieldset>

<fieldset>
<label>Category</label>
<span className="text">
<FieldData
metadata={metadata}
field_name='category'
data={page_data}
/>
</span>
</fieldset>

<fieldset>
<label>Project</label>
<span className="text">
<FieldData
metadata={metadata}
field_name='project'
data={page_data}
/>
</span>
</fieldset>

<fieldset>
<label>Milestone</label>
<span className="text">
<FieldData
metadata={metadata}
field_name='milestone'
data={page_data}
/>
</span>
</fieldset>

<fieldset>
<label>Priority</label>
<span className="text">U
<FieldData
metadata={metadata}
field_name='urgency'
data={page_data}
/>
/ I
<FieldData
metadata={metadata}
field_name='impact'
data={page_data}
/>
/ P
<FieldData
metadata={metadata}
field_name='priority'
data={page_data}
/>
</span>
</fieldset>

<fieldset>
<label>Duration</label>
<span className="text">
{secondsToTime(page_data['duration'])}
</span>
</fieldset>

<fieldset>
<label>Roadmap(s)</label>
<span className="text">val</span>
</fieldset>
<h3 className={"metadata ticket-type-" + ticket_type}>
Ticket&nbsp;#
<FieldData
metadata={metadata}
field_name='id'
data={ticket_data}
/>
&nbsp;
{ticket_data['external_ref'] &&(
('( #') + ticket_data['external_ref'] + (')')
)}
</h3>

</div>
<InlineField
data={ticket_data}
field_name='assigned_users'
metadata={metadata}
/>

</div>
<InlineField
data={ticket_data}
field_name='assigned_teams'
metadata={metadata}
/>

<InlineField
data={ticket_data}
field_name='status_badge'
metadata={metadata}
/>

<fieldset>
<label>Labels</label>
<span className="text">val</span>
</fieldset>

<InlineField
data={ticket_data}
field_name='category'
metadata={metadata}
/>

<InlineField
data={ticket_data}
field_name='project'
metadata={metadata}
/>

<InlineField
data={ticket_data}
field_name='milestone'
metadata={metadata}
/>

<fieldset>
<label>Duration</label>
<span className="text">
{secondsToTime(page_data['duration'])}
</span>
</fieldset>

<InlineField
data={ticket_data}
field_name='urgency'
metadata={metadata}
/>

<InlineField
data={ticket_data}
field_name='impact'
metadata={metadata}
/>

<InlineField
data={ticket_data}
field_name='priority'
metadata={metadata}
/>

<fieldset>
<label>Estimate</label>
<span className="text">
{secondsToTime(page_data['estimate'])}
</span>
</fieldset>

<InlineField
data={ticket_data}
field_name='subscribed_users'
metadata={metadata}
/>

<InlineField
data={ticket_data}
field_name='subscribed_teams'
metadata={metadata}
/>

<fieldset>
<label>Roadmap(s)</label>
<span className="text">val</span>
</fieldset>

</div>
</div>

</div>
Expand Down

0 comments on commit e8eaab3

Please sign in to comment.