Changed menu UI

This commit is contained in:
Abdelilah El Aissaoui 2022-10-27 17:23:12 +02:00
parent 94be23b872
commit 1d98491f71
7 changed files with 79 additions and 102 deletions

View File

@ -0,0 +1,4 @@
package com.jetpackduba.gitnuro.exceptions
class RevertCommitException {
}

View File

@ -8,8 +8,6 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.* import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDropDown
import androidx.compose.runtime.* import androidx.compose.runtime.*
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.ExperimentalComposeUiApi import androidx.compose.ui.ExperimentalComposeUiApi
@ -33,9 +31,10 @@ fun Menu(
modifier: Modifier, modifier: Modifier,
menuViewModel: MenuViewModel = gitnuroViewModel(), menuViewModel: MenuViewModel = gitnuroViewModel(),
onCreateBranch: () -> Unit, onCreateBranch: () -> Unit,
onGoToWorkspace: () -> Unit, onOpenAnotherRepository: () -> Unit,
onStashWithMessage: () -> Unit, onStashWithMessage: () -> Unit,
onQuickActions: () -> Unit, onQuickActions: () -> Unit,
onShowSettingsDialog: () -> Unit,
) { ) {
Row( Row(
modifier = modifier, modifier = modifier,
@ -45,28 +44,29 @@ fun Menu(
MenuButton( MenuButton(
modifier = Modifier modifier = Modifier
.padding(start = 16.dp), .padding(start = 16.dp),
title = "Workspace", title = "Open",
icon = painterResource("computer.svg"), icon = painterResource("open.svg"),
onClick = onGoToWorkspace, onClick = onOpenAnotherRepository,
fixedWidth = false,
) )
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
MenuButton(
modifier = Modifier.padding(end = 4.dp),
title = "Fetch",
icon = painterResource("download.svg"),
onClick = { menuViewModel.fetchAll() },
)
ExtendedMenuButton( ExtendedMenuButton(
modifier = Modifier.padding(end = 8.dp), modifier = Modifier.padding(end = 4.dp),
title = "Pull", title = "Pull",
icon = painterResource("download.svg"), icon = painterResource("download.svg"),
onClick = { menuViewModel.pull() }, onClick = { menuViewModel.pull() },
extendedListItems = pullContextMenuItems( extendedListItems = pullContextMenuItems {
onPullRebase = {
menuViewModel.pull(true) menuViewModel.pull(true)
},
onFetchAll = {
menuViewModel.fetchAll()
} }
) )
)
ExtendedMenuButton( ExtendedMenuButton(
title = "Push", title = "Push",
@ -82,20 +82,27 @@ fun Menu(
) )
) )
Spacer(modifier = Modifier.width(24.dp)) Spacer(modifier = Modifier.width(32.dp))
MenuButton( MenuButton(
modifier = Modifier.padding(end = 4.dp),
title = "Branch", title = "Branch",
icon = painterResource("branch.svg"), icon = painterResource("branch.svg"),
onClick = { ) {
onCreateBranch() onCreateBranch()
}, }
)
Spacer(modifier = Modifier.width(24.dp)) MenuButton(
title = "Merge",
icon = painterResource("merge.svg"),
) {
onCreateBranch()
}
Spacer(modifier = Modifier.width(32.dp))
ExtendedMenuButton( ExtendedMenuButton(
modifier = Modifier.padding(end = 8.dp), modifier = Modifier.padding(end = 4.dp),
title = "Stash", title = "Stash",
icon = painterResource("stash.svg"), icon = painterResource("stash.svg"),
onClick = { menuViewModel.stash() }, onClick = { menuViewModel.stash() },
@ -107,18 +114,30 @@ fun Menu(
MenuButton( MenuButton(
title = "Pop", title = "Pop",
icon = painterResource("apply_stash.svg"), icon = painterResource("apply_stash.svg"),
onClick = { menuViewModel.popStash() }, ) { menuViewModel.popStash() }
)
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
// MenuButton(
// modifier = Modifier.padding(end = 4.dp),
// title = "Terminal",
// icon = painterResource("terminal.svg"),
// onClick = onQuickActions,
// )
MenuButton( MenuButton(
title = "Quick actions", modifier = Modifier.padding(end = 4.dp),
modifier = Modifier.padding(end = 16.dp), title = "Actions",
icon = painterResource("bolt.svg"), icon = painterResource("bolt.svg"),
fixedWidth = false,
onClick = onQuickActions, onClick = onQuickActions,
) )
MenuButton(
modifier = Modifier.padding(end = 16.dp),
title = "Settings",
icon = painterResource("settings.svg"),
onClick = onShowSettingsDialog,
)
} }
} }
@ -128,36 +147,28 @@ fun MenuButton(
enabled: Boolean = true, enabled: Boolean = true,
title: String, title: String,
icon: Painter, icon: Painter,
fixedWidth: Boolean = true,
onClick: () -> Unit onClick: () -> Unit
) { ) {
Row( Column(
modifier = modifier modifier = modifier
.ignoreKeyEvents() .ignoreKeyEvents()
.clip(RoundedCornerShape(4.dp)) .clip(RoundedCornerShape(4.dp))
.background(MaterialTheme.colors.primary) .background(MaterialTheme.colors.surface)
.handMouseClickable { if (enabled) onClick() } .handMouseClickable { if (enabled) onClick() }
.run { .size(56.dp),
return@run if (fixedWidth) { horizontalAlignment = Alignment.CenterHorizontally,
this.width(92.dp) verticalArrangement = Arrangement.Center,
} else
this.padding(horizontal = 8.dp)
},
horizontalArrangement = Arrangement.Center,
verticalAlignment = Alignment.CenterVertically,
) { ) {
Icon( Icon(
painter = icon, painter = icon,
contentDescription = title, contentDescription = title,
modifier = Modifier modifier = Modifier
.padding(vertical = 2.dp) .size(24.dp),
.size(20.dp),
tint = MaterialTheme.colors.onPrimary, tint = MaterialTheme.colors.onPrimary,
) )
Text( Text(
text = title, text = title,
style = MaterialTheme.typography.body2, style = MaterialTheme.typography.caption,
modifier = Modifier.padding(start = 2.dp, top = 8.dp, bottom = 8.dp),
maxLines = 1, maxLines = 1,
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
color = MaterialTheme.colors.onPrimary, color = MaterialTheme.colors.onPrimary,
@ -178,29 +189,29 @@ fun ExtendedMenuButton(
Row( Row(
modifier = modifier modifier = modifier
.height(IntrinsicSize.Min) .size(width = 64.dp, height = 56.dp)
.ignoreKeyEvents() .ignoreKeyEvents()
.clip(RoundedCornerShape(4.dp)) .clip(RoundedCornerShape(4.dp))
.background(MaterialTheme.colors.primary) .background(MaterialTheme.colors.surface)
) { ) {
Row( Column(
modifier = Modifier modifier = Modifier
.width(84.dp) .fillMaxHeight()
.weight(1f)
.handMouseClickable { if (enabled) onClick() }, .handMouseClickable { if (enabled) onClick() },
horizontalArrangement = Arrangement.Center, verticalArrangement = Arrangement.Center,
verticalAlignment = Alignment.CenterVertically, horizontalAlignment = Alignment.CenterHorizontally,
) { ) {
Icon( Icon(
painter = icon, painter = icon,
contentDescription = title, contentDescription = title,
modifier = Modifier modifier = Modifier
.size(20.dp), .size(24.dp),
tint = MaterialTheme.colors.onPrimary, tint = MaterialTheme.colors.onPrimary,
) )
Text( Text(
text = title, text = title,
modifier = Modifier.padding(start = 2.dp, top = 8.dp, bottom = 8.dp), style = MaterialTheme.typography.caption,
style = MaterialTheme.typography.body2,
color = MaterialTheme.colors.onPrimary, color = MaterialTheme.colors.onPrimary,
maxLines = 1, maxLines = 1,
) )
@ -208,13 +219,6 @@ fun ExtendedMenuButton(
Box( Box(
modifier = Modifier modifier = Modifier
.fillMaxHeight()
.background(MaterialTheme.colors.onPrimary.copy(alpha = 0.3f))
.width(2.dp)
)
Box(
modifier = Modifier
.width(24.dp)
.fillMaxHeight() .fillMaxHeight()
.ignoreKeyEvents() .ignoreKeyEvents()
.handMouseClickable { .handMouseClickable {
@ -224,9 +228,10 @@ fun ExtendedMenuButton(
) { ) {
Icon( Icon(
Icons.Default.ArrowDropDown, painterResource("expand_more.svg"),
contentDescription = null, contentDescription = null,
tint = MaterialTheme.colors.onPrimary, tint = MaterialTheme.colors.onPrimary,
modifier = Modifier.size(16.dp)
) )
DropdownMenu( DropdownMenu(

View File

@ -2,11 +2,9 @@
package com.jetpackduba.gitnuro.ui package com.jetpackduba.gitnuro.ui
import androidx.compose.foundation.ScrollState
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.focusable import androidx.compose.foundation.focusable
import androidx.compose.foundation.layout.* import androidx.compose.foundation.layout.*
import androidx.compose.foundation.rememberScrollState
import androidx.compose.material.Icon import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text import androidx.compose.material.Text
@ -19,7 +17,6 @@ import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.onKeyEvent import androidx.compose.ui.input.key.onKeyEvent
import androidx.compose.ui.input.pointer.PointerIcon import androidx.compose.ui.input.pointer.PointerIcon
import androidx.compose.ui.input.pointer.pointerHoverIcon import androidx.compose.ui.input.pointer.pointerHoverIcon
import androidx.compose.ui.layout.onSizeChanged
import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.text.style.TextOverflow
@ -28,7 +25,6 @@ import com.jetpackduba.gitnuro.extensions.handMouseClickable
import com.jetpackduba.gitnuro.git.DiffEntryType import com.jetpackduba.gitnuro.git.DiffEntryType
import com.jetpackduba.gitnuro.keybindings.KeybindingOption import com.jetpackduba.gitnuro.keybindings.KeybindingOption
import com.jetpackduba.gitnuro.keybindings.matchesBinding import com.jetpackduba.gitnuro.keybindings.matchesBinding
import com.jetpackduba.gitnuro.theme.onBackgroundSecondary
import com.jetpackduba.gitnuro.ui.components.ScrollableColumn import com.jetpackduba.gitnuro.ui.components.ScrollableColumn
import com.jetpackduba.gitnuro.ui.dialogs.* import com.jetpackduba.gitnuro.ui.dialogs.*
import com.jetpackduba.gitnuro.ui.diff.Diff import com.jetpackduba.gitnuro.ui.diff.Diff
@ -98,6 +94,7 @@ fun RepositoryOpenPage(
when (it) { when (it) {
QuickActionType.OPEN_DIR_IN_FILE_MANAGER -> tabViewModel.openFolderInFileExplorer() QuickActionType.OPEN_DIR_IN_FILE_MANAGER -> tabViewModel.openFolderInFileExplorer()
QuickActionType.CLONE -> onShowCloneDialog() QuickActionType.CLONE -> onShowCloneDialog()
QuickActionType.REFRESH -> tabViewModel.refreshAll()
} }
}, },
) )
@ -132,13 +129,14 @@ fun RepositoryOpenPage(
Menu( Menu(
modifier = Modifier modifier = Modifier
.padding( .padding(
vertical = 12.dp vertical = 4.dp
) )
.fillMaxWidth(), .fillMaxWidth(),
onCreateBranch = { showNewBranchDialog = true }, onCreateBranch = { showNewBranchDialog = true },
onStashWithMessage = { showStashWithMessageDialog = true }, onStashWithMessage = { showStashWithMessageDialog = true },
onGoToWorkspace = { tabViewModel.selectUncommitedChanges() }, onOpenAnotherRepository = { openRepositoryDialog(tabViewModel) },
onQuickActions = { showQuickActionsDialog = true } onQuickActions = { showQuickActionsDialog = true },
onShowSettingsDialog = onShowSettingsDialog
) )
RepoContent( RepoContent(
@ -148,7 +146,6 @@ fun RepositoryOpenPage(
repositoryState = repositoryState, repositoryState = repositoryState,
blameState = blameState, blameState = blameState,
showHistory = showHistory, showHistory = showHistory,
onShowSettingsDialog = onShowSettingsDialog
) )
} }
} }
@ -201,7 +198,6 @@ fun RepoContent(
repositoryState: RepositoryState, repositoryState: RepositoryState,
blameState: BlameState, blameState: BlameState,
showHistory: Boolean, showHistory: Boolean,
onShowSettingsDialog: () -> Unit,
) { ) {
if (showHistory) { if (showHistory) {
val historyViewModel = tabViewModel.historyViewModel val historyViewModel = tabViewModel.historyViewModel
@ -221,7 +217,6 @@ fun RepoContent(
selectedItem, selectedItem,
repositoryState, repositoryState,
blameState, blameState,
onShowSettingsDialog,
) )
} }
} }
@ -267,24 +262,13 @@ fun MainContentView(
selectedItem: SelectedItem, selectedItem: SelectedItem,
repositoryState: RepositoryState, repositoryState: RepositoryState,
blameState: BlameState, blameState: BlameState,
onShowSettingsDialog: () -> Unit,
) { ) {
HorizontalSplitPane( HorizontalSplitPane(
splitPaneState = rememberSplitPaneState(initialPositionPercentage = 0.20f) splitPaneState = rememberSplitPaneState(initialPositionPercentage = 0.20f)
) { ) {
first(minSize = 180.dp) { first(minSize = 180.dp) {
Column { Column {
val state: ScrollState = rememberScrollState()
val canBeScrolled by remember {
derivedStateOf {
state.maxValue > 0
}
}
ScrollableColumn( ScrollableColumn(
state = state,
modifier = Modifier modifier = Modifier
.weight(1f), .weight(1f),
) { ) {
@ -294,20 +278,6 @@ fun MainContentView(
Stashes() Stashes()
// TODO: Enable on 1.2.0 when fully implemented Submodules() // TODO: Enable on 1.2.0 when fully implemented Submodules()
} }
Column {
if (canBeScrolled) {
Box(
Modifier
.fillMaxWidth()
.height(2.dp)
.background(MaterialTheme.colors.onBackgroundSecondary.copy(alpha = 0.2f))
)
}
SidePanelOption("Open another repository", "open.svg") { openRepositoryDialog(tabViewModel = tabViewModel) }
SidePanelOption("Refresh", "refresh.svg") { tabViewModel.refreshAll() }
SidePanelOption("Settings", "settings.svg", onShowSettingsDialog)
}
} }
} }

View File

@ -2,19 +2,13 @@ package com.jetpackduba.gitnuro.ui.context_menu
import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.ExperimentalFoundationApi
@OptIn(ExperimentalFoundationApi::class)
fun pullContextMenuItems( fun pullContextMenuItems(
onPullRebase: () -> Unit, onPullRebase: () -> Unit,
onFetchAll: () -> Unit,
): List<DropDownContentData> { ): List<DropDownContentData> {
return mutableListOf( return mutableListOf(
DropDownContentData( DropDownContentData(
label = "Pull with rebase", label = "Pull with rebase",
onClick = onPullRebase, onClick = onPullRebase,
), ),
DropDownContentData(
label = "Fetch all",
onClick = onFetchAll,
),
) )
} }

View File

@ -35,6 +35,7 @@ fun QuickActionsDialog(
listOf( listOf(
QuickAction("code.svg", "Open repository in file manager", QuickActionType.OPEN_DIR_IN_FILE_MANAGER), QuickAction("code.svg", "Open repository in file manager", QuickActionType.OPEN_DIR_IN_FILE_MANAGER),
QuickAction("download.svg", "Clone new repository", QuickActionType.CLONE), QuickAction("download.svg", "Clone new repository", QuickActionType.CLONE),
QuickAction("refresh.svg", "Refresh repository data", QuickActionType.REFRESH),
) )
} }
@ -124,5 +125,6 @@ data class QuickAction(val icon: String, val title: String, val type: QuickActio
enum class QuickActionType { enum class QuickActionType {
OPEN_DIR_IN_FILE_MANAGER, OPEN_DIR_IN_FILE_MANAGER,
CLONE; CLONE,
REFRESH;
} }

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M6.41,21L5,19.59l4.83-4.83c0.75-0.75,1.17-1.77,1.17-2.83v-5.1L9.41,8.41L8,7l4-4l4,4l-1.41,1.41L13,6.83v5.1 c0,1.06,0.42,2.08,1.17,2.83L19,19.59L17.59,21L12,15.41L6.41,21z"/></g></svg>

After

Width:  |  Height:  |  Size: 380 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M20,4H4C2.89,4,2,4.9,2,6v12c0,1.1,0.89,2,2,2h16c1.1,0,2-0.9,2-2V6C22,4.9,21.11,4,20,4z M20,18H4V8h16V18z M18,17h-6v-2 h6V17z M7.5,17l-1.41-1.41L8.67,13l-2.59-2.59L7.5,9l4,4L7.5,17z"/></g></svg>

After

Width:  |  Height:  |  Size: 390 B