|
10 | 10 | import { MODE_SERVICE } from '$lib/mode/modeService'; |
11 | 11 | import { handleAddProjectOutcome } from '$lib/project/project'; |
12 | 12 | import { PROJECTS_SERVICE } from '$lib/project/projectsService'; |
13 | | - import { ircPath, projectPath, isWorkspacePath } from '$lib/routes/routes.svelte'; |
14 | | - import { UI_STATE } from '$lib/state/uiState.svelte'; |
| 13 | + import { ircPath, projectPath } from '$lib/routes/routes.svelte'; |
15 | 14 | import { inject } from '@gitbutler/core/context'; |
16 | 15 | import { |
17 | 16 | Button, |
|
37 | 36 | const baseBranchService = inject(BASE_BRANCH_SERVICE); |
38 | 37 | const ircService = inject(IRC_SERVICE); |
39 | 38 | const settingsService = inject(SETTINGS_SERVICE); |
40 | | - const uiState = inject(UI_STATE); |
41 | 39 | const modeService = inject(MODE_SERVICE); |
42 | 40 | const baseReponse = $derived(projectId ? baseBranchService.baseBranch(projectId) : undefined); |
43 | 41 | const base = $derived(baseReponse?.response); |
44 | 42 | const settingsStore = $derived(settingsService.appSettings); |
45 | | - const isWorkspace = $derived(isWorkspacePath()); |
46 | | - const canUseActions = $derived($settingsStore?.featureFlags.actions ?? false); |
47 | 43 | const singleBranchMode = $derived($settingsStore?.featureFlags.singleBranch ?? false); |
48 | 44 | const useCustomTitleBar = $derived(!($settingsStore?.ui.useNativeTitleBar ?? false)); |
49 | 45 | const backend = inject(BACKEND); |
|
97 | 93 | function openModal() { |
98 | 94 | modal?.show(); |
99 | 95 | } |
100 | | -
|
101 | | - const projectState = $derived(uiState.project(projectId)); |
102 | | - const showingActions = $derived(projectState.showActions.current); |
103 | | -
|
104 | | - function toggleButActions() { |
105 | | - uiState.project(projectId).showActions.set(!showingActions); |
106 | | - } |
107 | 96 | </script> |
108 | 97 |
|
109 | 98 | {#if projectId} |
|
254 | 243 | }} |
255 | 244 | /> |
256 | 245 | {/if} |
257 | | - {#if canUseActions} |
258 | | - <Button |
259 | | - kind="outline" |
260 | | - class="actions-button" |
261 | | - reversedDirection |
262 | | - onclick={() => { |
263 | | - toggleButActions(); |
264 | | - }} |
265 | | - disabled={actionsDisabled || !isWorkspace} |
266 | | - > |
267 | | - {#snippet custom()} |
268 | | - <svg |
269 | | - width="20" |
270 | | - height="18" |
271 | | - class="actions-icon" |
272 | | - viewBox="0 0 20 18" |
273 | | - fill="none" |
274 | | - xmlns="http://www.w3.org/2000/svg" |
275 | | - class:activated={showingActions} |
276 | | - > |
277 | | - <path |
278 | | - class="actions-icon__monitor" |
279 | | - d="M4 16H16C17.6569 16 19 14.6569 19 13V11.8541C19 10.7178 18.358 9.679 17.3416 9.17082L15.5528 8.27639C15.214 8.107 15 7.76074 15 7.38197V5C15 3.34315 13.6569 2 12 2H4C2.34315 2 1 3.34315 1 5V13C1 14.6569 2.34315 16 4 16Z" |
280 | | - stroke-width="1.5" |
281 | | - /> |
282 | | - <path |
283 | | - class="actions-icon__star" |
284 | | - d="M7.65242 4.74446C7.76952 4.41851 8.23048 4.41851 8.34758 4.74446L8.98803 6.52723C9.23653 7.21894 9.78106 7.76348 10.4728 8.01197L12.2555 8.65242C12.5815 8.76952 12.5815 9.23048 12.2555 9.34758L10.4728 9.98803C9.78106 10.2365 9.23653 10.7811 8.98803 11.4728L8.34758 13.2555C8.23048 13.5815 7.76952 13.5815 7.65242 13.2555L7.01197 11.4728C6.76347 10.7811 6.21894 10.2365 5.52723 9.98803L3.74446 9.34758C3.41851 9.23048 3.41851 8.76952 3.74446 8.65242L5.52723 8.01197C6.21894 7.76347 6.76348 7.21894 7.01197 6.52723L7.65242 4.74446Z" |
285 | | - /> |
286 | | - |
287 | | - <svg |
288 | | - width="18" |
289 | | - height="14" |
290 | | - viewBox="0 0 18 14" |
291 | | - fill="none" |
292 | | - xmlns="http://www.w3.org/2000/svg" |
293 | | - > |
294 | | - <defs> |
295 | | - <linearGradient |
296 | | - id="activated-gradient" |
297 | | - x1="7.5" |
298 | | - y1="2" |
299 | | - x2="16.3281" |
300 | | - y2="10.6554" |
301 | | - gradientUnits="userSpaceOnUse" |
302 | | - > |
303 | | - <stop stop-color="#816BDA" /> |
304 | | - <stop offset="1" stop-color="#2EDBD2" /> |
305 | | - </linearGradient> |
306 | | - </defs> |
307 | | - </svg> |
308 | | - </svg> |
309 | | - {/snippet} |
310 | | - Actions |
311 | | - </Button> |
312 | | - {/if} |
313 | 246 | </div> |
314 | 247 | </div> |
315 | 248 |
|
|
322 | 255 | overflow: hidden; |
323 | 256 | gap: 12px; |
324 | 257 | } |
325 | | -
|
326 | | - .actions-icon { |
327 | | - opacity: var(--opacity-btn-icon-outline); |
328 | | - } |
329 | | -
|
330 | | - .actions-icon__star, |
331 | | - .actions-icon__monitor { |
332 | | - transform-box: fill-box; |
333 | | - transform-origin: center; |
334 | | - transition: transform 0.3s; |
335 | | - } |
336 | | -
|
337 | | - .actions-icon__star { |
338 | | - fill: var(--clr-text-1); |
339 | | - } |
340 | | -
|
341 | | - .actions-icon__monitor { |
342 | | - stroke: var(--clr-text-1); |
343 | | - } |
344 | | -
|
345 | | - :global(.chrome-header .actions-button) { |
346 | | - &:hover:not(:disabled) .actions-icon, |
347 | | - .actions-icon.activated { |
348 | | - opacity: 1; |
349 | | -
|
350 | | - & .actions-icon__star { |
351 | | - fill: #fff; |
352 | | - transform: rotate(90deg); |
353 | | - } |
354 | | - & .actions-icon__monitor { |
355 | | - fill: url(#activated-gradient); |
356 | | - stroke: url(#activated-gradient); |
357 | | - } |
358 | | - } |
359 | | - } |
360 | | -
|
361 | 258 | .chrome-selector-wrapper { |
362 | 259 | display: flex; |
363 | 260 | position: relative; |
|
0 commit comments