Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

sn-2813 search toolbar improvements #194

Merged
merged 1 commit into from
Sep 8, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -49,14 +49,14 @@ import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Path
import androidx.compose.ui.graphics.PathOperation
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.Dimension
import jp.co.soramitsu.common.R
import jp.co.soramitsu.common.presentation.compose.uikit.tokens.ScreenStatus
import jp.co.soramitsu.common.presentation.compose.uikit.tokens.Text
import jp.co.soramitsu.common.presentation.compose.uikit.tokens.retrieveString
import jp.co.soramitsu.ui_core.component.button.BleachedButton
import jp.co.soramitsu.ui_core.component.button.FilledButton
import jp.co.soramitsu.ui_core.component.button.properties.Order
Expand All @@ -71,15 +71,6 @@ data class QRCodeScannerScreenState(
val screenStatus: ScreenStatus,
val throwable: Throwable?
) {

val toolbarTitleText: Text = Text.StringRes(id = R.string.common_scan_qr)

val uploadFromGalleryButtonText: Text = Text.StringRes(id = R.string.common_upload_from_library)

val showMyQrButtonText: Text = Text.StringRes(id = R.string.scan_qr_show_my_qr)

val isErrorTextVisible: Boolean = screenStatus === ScreenStatus.ERROR

val errorText: Text
get() = throwable?.message?.let {
Text.SimpleText(it)
Expand All @@ -88,7 +79,6 @@ data class QRCodeScannerScreenState(

@Composable
fun QrCodeScannerScreen(
state: QRCodeScannerScreenState,
onNavIconClick: () -> Unit,
onUploadFromGalleryClick: () -> Unit,
onShowUserQrClick: () -> Unit
Expand Down Expand Up @@ -122,14 +112,14 @@ fun QrCodeScannerScreen(
SoramitsuToolbar(
state = SoramitsuToolbarState(
basic = BasicToolbarState(
title = state.toolbarTitleText.retrieveString(),
title = R.string.common_scan_qr,
navIcon = R.drawable.ic_close,
),
type = SoramitsuToolbarType.SmallCentered()
),
backgroundColor = blurCameraBackground,
elevation = Dp(0f),
onNavigate = onNavIconClick
elevation = 0.dp,
onNavigate = onNavIconClick,
)
}

Expand Down Expand Up @@ -262,7 +252,7 @@ fun QrCodeScannerScreen(
),
size = Size.Large,
order = Order.SECONDARY,
text = state.uploadFromGalleryButtonText.retrieveString(),
text = stringResource(id = R.string.common_upload_from_library),
onClick = onUploadFromGalleryClick
)

Expand All @@ -283,7 +273,7 @@ fun QrCodeScannerScreen(
),
size = Size.Large,
order = Order.SECONDARY,
text = state.showMyQrButtonText.retrieveString(),
text = stringResource(id = R.string.scan_qr_show_my_qr),
onClick = onShowUserQrClick
)
}
Expand All @@ -301,10 +291,6 @@ private fun PreviewQrCodeScannerScreen() {
contentDescription = ""
)
QrCodeScannerScreen(
state = QRCodeScannerScreenState(
screenStatus = ScreenStatus.READY_TO_RENDER,
throwable = null
),
onNavIconClick = {},
onUploadFromGalleryClick = {},
onShowUserQrClick = {}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -55,13 +55,14 @@ import androidx.compose.foundation.verticalScroll
import androidx.compose.material.Divider
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.fragment.app.viewModels
import androidx.lifecycle.compose.collectAsStateWithLifecycle
import androidx.navigation.NavGraphBuilder
import androidx.navigation.NavHostController
import com.google.accompanist.navigation.animation.composable
Expand All @@ -72,10 +73,6 @@ import jp.co.soramitsu.common.base.theOnlyRoute
import jp.co.soramitsu.common.domain.BottomBarController
import jp.co.soramitsu.common_wallet.presentation.compose.components.AssetItem
import jp.co.soramitsu.feature_assets_impl.presentation.components.compose.assetslist.CommonAssetsList
import jp.co.soramitsu.ui_core.component.toolbar.BasicToolbarState
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbar
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbarState
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbarType
import jp.co.soramitsu.ui_core.resources.Dimens
import jp.co.soramitsu.ui_core.theme.customColors
import jp.co.soramitsu.ui_core.theme.customTypography
Expand All @@ -86,6 +83,9 @@ class FullAssetListFragment : SoraBaseFragment<FullAssetListViewModel>() {
override val viewModel: FullAssetListViewModel by viewModels()
override fun backgroundColor(): Int = R.attr.baseBackgroundSecond

@Composable
override fun backgroundColorComposable() = MaterialTheme.customColors.bgSurface

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
(activity as BottomBarController).hideBottomBar()
Expand All @@ -104,23 +104,7 @@ class FullAssetListFragment : SoraBaseFragment<FullAssetListViewModel>() {
.background(MaterialTheme.customColors.bgSurface)
.fillMaxSize()
) {
SoramitsuToolbar(
state = SoramitsuToolbarState(
basic = BasicToolbarState(
title = "",
navIcon = jp.co.soramitsu.ui_core.R.drawable.ic_cross_24,
actionLabel = R.string.common_edit,
searchValue = "",
),
type = SoramitsuToolbarType.Small(),
),
backgroundColor = MaterialTheme.customColors.bgSurface,
elevation = 0.dp,
onAction = viewModel::onAction,
onNavigate = viewModel::onNavIcon,
onSearch = viewModel::searchAssets,
)
val state = viewModel.state
val state = viewModel.state.collectAsStateWithLifecycle()
Row(
modifier = Modifier
.padding(
Expand All @@ -142,7 +126,7 @@ class FullAssetListFragment : SoraBaseFragment<FullAssetListViewModel>() {
)
Text(
modifier = Modifier.weight(1f),
text = state.fiatSum,
text = state.value.fiatSum,
textAlign = TextAlign.End,
style = MaterialTheme.customTypography.headline2,
color = MaterialTheme.customColors.fgPrimary,
Expand All @@ -154,7 +138,7 @@ class FullAssetListFragment : SoraBaseFragment<FullAssetListViewModel>() {
.fillMaxSize()
) {
androidx.compose.animation.AnimatedVisibility(
visible = state.searchMode.not(),
visible = state.value.searchMode.not(),
enter = fadeIn(),
exit = fadeOut(),
) {
Expand All @@ -164,32 +148,32 @@ class FullAssetListFragment : SoraBaseFragment<FullAssetListViewModel>() {
.verticalScroll(scrollState),
) {
CommonAssetsList(
state = state,
state = state.value,
onAssetClick = viewModel::onAssetClick,
)
}
}
androidx.compose.animation.AnimatedVisibility(
visible = state.searchMode,
visible = state.value.searchMode,
enter = fadeIn(),
exit = fadeOut(),
) {
val listState = rememberLazyListState()
LazyColumn(state = listState, modifier = Modifier.fillMaxSize()) {
items(
count = state.topList.size + state.bottomList.size + 1,
count = state.value.topList.size + state.value.bottomList.size + 1,
key = null,
contentType = { p -> if (p == state.topList.size) 0 else 1 },
contentType = { p -> if (p == state.value.topList.size) 0 else 1 },
) { position ->
if (position == state.topList.size) {
if (position == state.value.topList.size) {
Text(
text = stringResource(id = R.string.global_results).uppercase(),
style = MaterialTheme.customTypography.headline4,
color = MaterialTheme.customColors.fgSecondary,
)
} else {
val item =
if (position < state.topList.size) state.topList[position] else state.bottomList[position - state.topList.size - 1]
if (position < state.value.topList.size) state.value.topList[position] else state.value.bottomList[position - state.value.topList.size - 1]
AssetItem(
assetState = item,
testTag = "",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,6 @@ USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
package jp.co.soramitsu.feature_assets_impl.presentation.screens.fullassetlist

import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue
import androidx.lifecycle.viewModelScope
import dagger.hilt.android.lifecycle.HiltViewModel
Expand All @@ -49,7 +48,12 @@ import jp.co.soramitsu.common_wallet.presentation.compose.states.mapAssetsToCard
import jp.co.soramitsu.feature_assets_api.domain.AssetsInteractor
import jp.co.soramitsu.feature_assets_api.presentation.AssetsRouter
import jp.co.soramitsu.feature_assets_impl.presentation.states.FullAssetListState
import jp.co.soramitsu.ui_core.R
import jp.co.soramitsu.ui_core.component.toolbar.BasicToolbarState
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbarState
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbarType
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.asStateFlow
import kotlinx.coroutines.flow.catch
import kotlinx.coroutines.flow.collectLatest
import kotlinx.coroutines.flow.debounce
Expand All @@ -68,10 +72,20 @@ class FullAssetListViewModel @Inject constructor(
private val visAssets = mutableListOf<Asset>()
private val filter = MutableStateFlow("")

var state by mutableStateOf(FullAssetListState(false, "", emptyList(), emptyList()))
private set
private val _state = MutableStateFlow(FullAssetListState(false, "", emptyList(), emptyList()))
val state = _state.asStateFlow()

init {
_toolbarState.value = SoramitsuToolbarState(
basic = BasicToolbarState(
title = "",
navIcon = R.drawable.ic_cross_24,
actionLabel = jp.co.soramitsu.common.R.string.common_edit,
searchValue = "",
searchEnabled = true,
),
type = SoramitsuToolbarType.Small(),
)
viewModelScope.launch {
allAssets.addAll(assetsInteractor.getWhitelistAssets())
launch {
Expand All @@ -92,6 +106,10 @@ class FullAssetListViewModel @Inject constructor(
}
}

override fun onToolbarSearch(value: String) {
filter.value = value
}

private fun calcState(filter: String) {
val idMap = visAssets.map { t -> t.token.id }
val excluded = allAssets.filter { it.token.id !in idMap }
Expand All @@ -101,7 +119,7 @@ class FullAssetListViewModel @Inject constructor(
val group = visAssets.groupBy {
(it.fiat ?: 0.0) >= thresholdBalance
}
state = state.copy(
_state.value = _state.value.copy(
searchMode = false,
topList = mapAssetsToCardState(
group[true] ?: emptyList(),
Expand All @@ -122,7 +140,7 @@ class FullAssetListViewModel @Inject constructor(
val bottomFilter = invisibleAssets.filter { it.token.isMatchFilter(filter) }
val topSum = topFilter.fiatSum()
val bottomSum = bottomFilter.fiatSum()
state = state.copy(
_state.value = _state.value.copy(
searchMode = true,
topList = mapAssetsToCardState(topFilter, numbersFormatter),
bottomList = mapAssetsToCardState(bottomFilter, numbersFormatter),
Expand All @@ -135,10 +153,6 @@ class FullAssetListViewModel @Inject constructor(
}
}

fun searchAssets(search: String) {
filter.value = search
}

override fun onAction() {
assetsRouter.showFullAssetsSettings()
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,14 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import androidx.compose.ui.viewinterop.AndroidView
import androidx.core.content.ContextCompat
import androidx.fragment.app.viewModels
import androidx.lifecycle.compose.collectAsStateWithLifecycle
import androidx.navigation.NavGraphBuilder
import androidx.navigation.NavHostController
import androidx.recyclerview.widget.DividerItemDecoration
Expand All @@ -63,10 +64,6 @@ import jp.co.soramitsu.common.presentation.view.WrappedRecyclerView
import jp.co.soramitsu.common.view.CustomItemTouchHelperCallback
import jp.co.soramitsu.common_wallet.R as polkaswapR
import jp.co.soramitsu.feature_assets_impl.presentation.components.classic.AssetsManagementAdapter
import jp.co.soramitsu.ui_core.component.toolbar.BasicToolbarState
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbar
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbarState
import jp.co.soramitsu.ui_core.component.toolbar.SoramitsuToolbarType
import jp.co.soramitsu.ui_core.resources.Dimens
import jp.co.soramitsu.ui_core.theme.customColors
import jp.co.soramitsu.ui_core.theme.customTypography
Expand All @@ -77,6 +74,9 @@ class FullAssetSettingsFragment : SoraBaseFragment<FullAssetSettingsViewModel>()
override val viewModel: FullAssetSettingsViewModel by viewModels()
override fun backgroundColor(): Int = R.attr.baseBackgroundSecond

@Composable
override fun backgroundColorComposable() = MaterialTheme.customColors.bgSurface

private val itemTouchHelperCallback = CustomItemTouchHelperCallback { from, to ->
viewModel.assetPositionChanged(from, to)
}
Expand All @@ -95,25 +95,6 @@ class FullAssetSettingsFragment : SoraBaseFragment<FullAssetSettingsViewModel>()
.background(MaterialTheme.customColors.bgSurface)
.fillMaxSize()
) {
SoramitsuToolbar(
state = SoramitsuToolbarState(
basic = BasicToolbarState(
title = "",
navIcon = jp.co.soramitsu.ui_core.R.drawable.ic_cross_24,
actionLabel = R.string.common_done,
searchValue = "",
),
type = SoramitsuToolbarType.Small(),
),
backgroundColor = MaterialTheme.customColors.bgSurface,
elevation = 0.dp,
onAction = viewModel::onCloseClick,
onNavigate = viewModel::onCloseClick,
onSearch = {
viewModel.searchAssets(it)
itemTouchHelperCallback.isDraggable = it.isBlank()
},
)
Row(
modifier = Modifier
.padding(
Expand All @@ -134,7 +115,7 @@ class FullAssetSettingsFragment : SoraBaseFragment<FullAssetSettingsViewModel>()
)
Text(
modifier = Modifier,
text = viewModel.fiatSum,
text = viewModel.fiatSum.collectAsStateWithLifecycle().value,
style = MaterialTheme.customTypography.headline2,
color = MaterialTheme.customColors.fgPrimary,
)
Expand Down Expand Up @@ -170,6 +151,9 @@ class FullAssetSettingsFragment : SoraBaseFragment<FullAssetSettingsViewModel>()
viewModel::onFavoriteClick,
viewModel::onVisibilityClick,
)
viewModel.dragList.observe {
itemTouchHelperCallback.isDraggable = it
}
viewModel.settingsState.observe {
(view.list.adapter as AssetsManagementAdapter).submitList(
buildList {
Expand Down
Loading