mirror of
https://github.com/FranP-code/Pomodoro-Timer-with-Clockify-integration.git
synced 2025-10-12 23:52:30 +00:00
added default value to task description input
This commit is contained in:
@@ -18,6 +18,7 @@ const ClockifyTaskForm = ({timerOn, setTimerOn, signedIn, apiKey, setApiKey, tas
|
||||
const descriptionInput = useRef("")
|
||||
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [suggestProjectName, setSuggestProjectName] = useState()
|
||||
|
||||
let newTask = useRef("")
|
||||
const [addingNewTask, setAddingNewTask] = useState(false)
|
||||
@@ -242,7 +243,10 @@ const ClockifyTaskForm = ({timerOn, setTimerOn, signedIn, apiKey, setApiKey, tas
|
||||
</select>
|
||||
|
||||
<select
|
||||
onChange={(e) => changeClockifyData({taskID: e.target.value})}
|
||||
onChange={(e) => {
|
||||
setSuggestProjectName(e.target.options[e.target.selectedIndex].text)
|
||||
changeClockifyData({taskID: e.target.value})
|
||||
}}
|
||||
className={`project-selector ${(!clockifyData.projectID || (clockifyData.tasks && clockifyData.tasks.length === 0)) && 'disabled'}`}
|
||||
>
|
||||
<option value="0">Select a Task</option>
|
||||
@@ -296,13 +300,24 @@ const ClockifyTaskForm = ({timerOn, setTimerOn, signedIn, apiKey, setApiKey, tas
|
||||
type="text"
|
||||
ref={descriptionInput}
|
||||
onChange={(e) => changeClockifyData({description: e.target.value})}
|
||||
placeholder="Add task description"
|
||||
className={!clockifyData.projectID && 'disabled'}
|
||||
onKeyPress={event => {
|
||||
placeholder={suggestProjectName ? false : "Add task description"}
|
||||
disabled={!clockifyData.projectID }
|
||||
className={suggestProjectName && 'suggestion-placeholder'}
|
||||
onKeyDown={event => {
|
||||
if (event.key === 'Enter') {
|
||||
if (event.target.value === suggestProjectName) {
|
||||
setSuggestProjectName(undefined)
|
||||
}
|
||||
setTimerOn(true)
|
||||
event.target.blur()
|
||||
return
|
||||
}
|
||||
if (suggestProjectName) {
|
||||
event.target.value = ''
|
||||
setSuggestProjectName(undefined)
|
||||
}
|
||||
}}
|
||||
value={suggestProjectName}
|
||||
/>
|
||||
</div>
|
||||
: null
|
||||
|
||||
@@ -57,7 +57,11 @@
|
||||
padding: 1px 2px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.clockify-tasks-display-container .clockify-task-form.disabled, .clockify-tasks-display-container .clockify-task-form .disabled {
|
||||
.clockify-tasks-display-container .clockify-task-form input[type=text].suggestion-placeholder {
|
||||
color: #bbb;
|
||||
font-weight: bold;
|
||||
}
|
||||
.clockify-tasks-display-container .clockify-task-form.disabled, .clockify-tasks-display-container .clockify-task-form .disabled, .clockify-tasks-display-container .clockify-task-form *:disabled {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sources":["clockify-task-form.scss","clockify-task-form.css"],"names":[],"mappings":"AAAA;EACI,WAAA;EACA,kBAAA;EAEA,SAAA;EACA,WAAA;ACAJ;ADGQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADIQ;EACI,WAAA;EACA,YAAA;EACA,gBAAA;ACFZ;ADKQ;EACI,WAAA;EACA,WAAA;ACHZ;ADKY;EACI,WAAA;EACA,mBAAA;EACA,gBAAA;EACA,iBAAA;ACHhB;ADOQ;EACI,YAAA;EACA,aAAA;EAEA,kBAAA;EAEA,eAAA;EAEA,qCAAA;EACA,mBAAA;EAEA,WAAA;EAEA,eAAA;ACVZ;ADYY;EACI,uBAAA;ACVhB;ADaY;EACI,wBAAA;ACXhB;ADeQ;EACI,gBAAA;EACA,mBAAA;EACA,uBAAA;ACbZ;ADgBQ;EACI,WAAA;EACA,WAAA;EAEA,eAAA;EAEA,aAAA;EACA,gBAAA;EAEA,sBAAA;ACjBZ;ADoBQ;EACI,yBAAA;KAAA,sBAAA;MAAA,qBAAA;UAAA,iBAAA;EACA,eAAA;EACA,oBAAA;EACA,YAAA;AClBZ;;ADuBA;EAEI;IACI,gBAAA;IACA,WAAA;IAEA,gBAAA;ECtBN;EDwBM;IACI,aAAA;IACA,mBAAA;IACA,eAAA;IACA,8BAAA;IAEA,gBAAA;ECvBV;EDyBU;IACI,WAAA;IACA,gBAAA;IACA,WAAA;IACA,gBAAA;ECvBd;ED0BU;IACI,kBAAA;ECxBd;ED2BU;IACI,eAAA;ECzBd;ED4BU;IACI,WAAA;IACA,kBAAA;IACA,gBAAA;EC1Bd;AACF;AD+BA;EAEI;IACI,iBAAA;IACA,WAAA;IAEA,aAAA;IACA,sBAAA;IACA,mBAAA;EC/BN;EDiCM;IACI,UAAA;IACA,YAAA;EC/BV;EDkCM;IACI,UAAA;IACA,WAAA;IACA,eAAA;EChCV;AACF","file":"clockify-task-form.css"}
|
||||
{"version":3,"sources":["clockify-task-form.scss","clockify-task-form.css"],"names":[],"mappings":"AAAA;EACI,WAAA;EACA,kBAAA;EAEA,SAAA;EACA,WAAA;ACAJ;ADGQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADAQ;EACI,gCAAA;ACDZ;ADIQ;EACI,WAAA;EACA,YAAA;EACA,gBAAA;ACFZ;ADKQ;EACI,WAAA;EACA,WAAA;ACHZ;ADKY;EACI,WAAA;EACA,mBAAA;EACA,gBAAA;EACA,iBAAA;ACHhB;ADOQ;EACI,YAAA;EACA,aAAA;EAEA,kBAAA;EAEA,eAAA;EAEA,qCAAA;EACA,mBAAA;EAEA,WAAA;EAEA,eAAA;ACVZ;ADYY;EACI,uBAAA;ACVhB;ADaY;EACI,wBAAA;ACXhB;ADeQ;EACI,gBAAA;EACA,mBAAA;EACA,uBAAA;ACbZ;ADgBQ;EACI,WAAA;EACA,WAAA;EAEA,eAAA;EAEA,aAAA;EACA,gBAAA;EAEA,sBAAA;ACjBZ;ADmBY;EACI,WAAA;EACA,iBAAA;ACjBhB;ADqBQ;EACI,yBAAA;KAAA,sBAAA;MAAA,qBAAA;UAAA,iBAAA;EACA,eAAA;EACA,oBAAA;EACA,YAAA;ACnBZ;;ADwBA;EAEI;IACI,gBAAA;IACA,WAAA;IAEA,gBAAA;ECvBN;EDyBM;IACI,aAAA;IACA,mBAAA;IACA,eAAA;IACA,8BAAA;IAEA,gBAAA;ECxBV;ED0BU;IACI,WAAA;IACA,gBAAA;IACA,WAAA;IACA,gBAAA;ECxBd;ED2BU;IACI,kBAAA;ECzBd;ED4BU;IACI,eAAA;EC1Bd;ED6BU;IACI,WAAA;IACA,kBAAA;IACA,gBAAA;EC3Bd;AACF;ADgCA;EAEI;IACI,iBAAA;IACA,WAAA;IAEA,aAAA;IACA,sBAAA;IACA,mBAAA;EChCN;EDkCM;IACI,UAAA;IACA,YAAA;EChCV;EDmCM;IACI,UAAA;IACA,WAAA;IACA,eAAA;ECjCV;AACF","file":"clockify-task-form.css"}
|
||||
@@ -68,9 +68,14 @@
|
||||
padding: 1px 2px;
|
||||
|
||||
box-sizing: border-box;
|
||||
|
||||
&.suggestion-placeholder {
|
||||
color: #bbb;
|
||||
font-weight: bold
|
||||
}
|
||||
}
|
||||
|
||||
&.disabled, .disabled {
|
||||
&.disabled, .disabled, *:disabled {
|
||||
user-select: none;
|
||||
cursor: initial;
|
||||
pointer-events: none;
|
||||
|
||||
Reference in New Issue
Block a user