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

[🔁] Cancel Pledge redesign #594

Merged
merged 1 commit into from Aug 23, 2019
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.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
Expand Up @@ -484,7 +484,7 @@ class ProjectActivity : BaseActivity<ProjectViewModel.ViewModel>(), CancelPledge
val tag = CancelPledgeFragment::class.java.simpleName
supportFragmentManager
.beginTransaction()
.setCustomAnimations(R.anim.slide_up, 0, 0, R.anim.slide_down)
.setCustomAnimations(R.anim.slide_in_right, 0, 0, R.anim.slide_out_right)
.add(R.id.fragment_container, cancelPledgeFragment, tag)
.addToBackStack(tag)
.commit()
Expand Down
@@ -1,14 +1,18 @@
package com.kickstarter.ui.fragments

import android.graphics.Typeface
import android.os.Bundle
import android.text.Spannable
import android.text.SpannableString
import android.text.style.StyleSpan
import android.util.Pair
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.FragmentManager
import com.google.android.material.snackbar.Snackbar
import com.kickstarter.KSApplication
import com.kickstarter.R
import com.kickstarter.extensions.snackbar
import com.kickstarter.extensions.text
import com.kickstarter.libs.BaseFragment
import com.kickstarter.libs.qualifiers.RequiresFragmentViewModel
Expand Down Expand Up @@ -42,12 +46,12 @@ class CancelPledgeFragment : BaseFragment<CancelPledgeViewModel.ViewModel>() {
this.viewModel.outputs.showServerError()
.compose(bindToLifecycle())
.compose(Transformers.observeForUI())
.subscribe { Snackbar.make(snackbar_anchor, R.string.Something_went_wrong_please_try_again, Snackbar.LENGTH_SHORT).show() }
.subscribe { snackbar(cancel_pledge_root, getString(R.string.Something_went_wrong_please_try_again)).show() }

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🍿

<3 functions as first class citizens in Kotlin! 🎆


this.viewModel.outputs.showCancelError()
.compose(bindToLifecycle())
.compose(Transformers.observeForUI())
.subscribe { Snackbar.make(snackbar_anchor, it, Snackbar.LENGTH_SHORT).show() }
.subscribe { snackbar(cancel_pledge_root, it).show() }

this.viewModel.outputs.dismiss()
.compose(bindToLifecycle())
Expand Down Expand Up @@ -76,10 +80,11 @@ class CancelPledgeFragment : BaseFragment<CancelPledgeViewModel.ViewModel>() {
no_cancel_pledge_button.setOnClickListener {
this.viewModel.inputs.goBackButtonClicked()
}
}

cancel_pledge_toolbar.setNavigationOnClickListener {
this.viewModel.inputs.closeButtonClicked()
}
private fun addBoldSpan(spannableString: SpannableString, substring: String) {
val indexOfAmount = spannableString.indexOf(substring)
spannableString.setSpan(StyleSpan(Typeface.BOLD), indexOfAmount, indexOfAmount + substring.length, Spannable.SPAN_INCLUSIVE_INCLUSIVE)
}

private fun dismiss() {
Expand All @@ -90,8 +95,15 @@ class CancelPledgeFragment : BaseFragment<CancelPledgeViewModel.ViewModel>() {
val ksString = (activity?.applicationContext as KSApplication).component().environment().ksString()
val amount = amountAndProjectName.first
val name = amountAndProjectName.second
cancel_prompt.text = ksString.format(getString(R.string.Are_you_sure_you_wish_to_cancel_your_amount_pledge_to_project_name),
val formattedString = ksString.format(getString(R.string.Are_you_sure_you_wish_to_cancel_your_amount_pledge_to_project_name),
"amount", amount, "project_name", name)

val spannableString = SpannableString(formattedString)

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah ok so at this point formatted string already has the data interpolated, and using SpannableString is really just to add bold-ness to the string for the amount and name of the project, right?

I'm getting it!

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

...I think

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes!


addBoldSpan(spannableString, amount)
addBoldSpan(spannableString, name)

cancel_prompt.text = spannableString
}

companion object {
Expand Down
Expand Up @@ -17,9 +17,6 @@ import java.math.RoundingMode

interface CancelPledgeViewModel {
interface Inputs {
/** Call when user clicks the close button. */
fun closeButtonClicked()

/** Call when user clicks the confirmation button. */
fun confirmCancellationClicked(note: String)

Expand Down Expand Up @@ -52,16 +49,15 @@ interface CancelPledgeViewModel {

class ViewModel(@NonNull val environment: Environment) : FragmentViewModel<CancelPledgeFragment>(environment), Inputs, Outputs {

private val closeButtonClicked = PublishSubject.create<Void>()
private val confirmCancellationClicked = PublishSubject.create<String>()
private val goBackButtonClicked = PublishSubject.create<Void>()

private val cancelButtonIsVisible = BehaviorSubject.create<Boolean>()
private val dismiss = BehaviorSubject.create<Void>()
private val pledgeAmountAndProjectName = BehaviorSubject.create<Pair<String, String>>()
private val progressBarIsVisible = PublishSubject.create<Boolean>()
private val showCancelError = BehaviorSubject.create<String>()
private val showServerError = BehaviorSubject.create<Void>()
private val progressBarIsVisible = BehaviorSubject.create<Boolean>()
private val showCancelError = PublishSubject.create<String>()
private val showServerError = PublishSubject.create<Void>()
private val success = BehaviorSubject.create<Void>()

private val apolloClient = environment.apolloClient()
Expand Down Expand Up @@ -117,7 +113,7 @@ interface CancelPledgeViewModel {
.compose(bindToLifecycle())
.subscribe(this.showCancelError)

Observable.merge(this.closeButtonClicked, this.goBackButtonClicked)
this.goBackButtonClicked
.compose(bindToLifecycle())
.subscribe(this.dismiss)
}
Expand All @@ -134,10 +130,6 @@ interface CancelPledgeViewModel {
}.materialize()
}

override fun closeButtonClicked() {
this.closeButtonClicked.onNext(null)
}

override fun confirmCancellationClicked(note: String) {
this.confirmCancellationClicked.onNext(note)
}
Expand Down
160 changes: 66 additions & 94 deletions app/src/main/res/layout/fragment_cancel_pledge.xml
@@ -1,130 +1,102 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView android:id="@+id/cancel_pledge_root"
style="@style/CardViewFragment"
xmlns:android="http://schemas.android.com/apk/res/android"
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/cancel_pledge_root"
android:layout_width="match_parent"
android:layout_height="wrap_content">
android:layout_height="match_parent"
android:background="@color/ksr_grey_300"
android:paddingTop="?android:attr/actionBarSize">

<androidx.coordinatorlayout.widget.CoordinatorLayout
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
android:layout_height="match_parent"
android:fillViewport="true"
android:overScrollMode="never"
android:scrollbars="none">

<com.google.android.material.appbar.AppBarLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp">

<androidx.appcompat.widget.Toolbar
android:id="@+id/cancel_pledge_toolbar"
style="@style/Toolbar"
android:layout_width="match_parent"
android:gravity="center"
android:orientation="vertical"
android:paddingStart="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingEnd="@dimen/activity_horizontal_margin"
android:paddingBottom="@dimen/activity_vertical_margin">

<TextView
android:id="@+id/cancel_prompt"
style="@style/CalloutPrimary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/white"
app:navigationIcon="@drawable/ic_close"
app:tint="@color/ksr_soft_black"
app:title="@string/Cancel_your_pledge" />

</com.google.android.material.appbar.AppBarLayout>

<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:overScrollMode="never"
android:scrollbars="none"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
android:layout_marginBottom="@dimen/grid_5"
android:gravity="center"
tools:text="@string/Are_you_sure_you_wish_to_cancel_your_amount_pledge_to_project_name" />

<LinearLayout
<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical"
android:paddingBottom="@dimen/grid_15"
android:paddingEnd="@dimen/grid_4"
android:paddingStart="@dimen/grid_4">

<TextView
android:id="@+id/cancel_prompt"
style="@style/CalloutPrimary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/grid_5"
android:layout_marginTop="@dimen/grid_14"
android:gravity="center"
tools:text="@string/Are_you_sure_you_wish_to_cancel_your_amount_pledge_to_project_name" />
android:hint="@string/Tell_us_why_optional">

<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
<com.google.android.material.textfield.TextInputEditText
android:id="@+id/cancellation_note"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="@string/Tell_us_why_optional">
android:inputType="textMultiLine|textCapSentences"
android:maxLines="3" />

<com.google.android.material.textfield.TextInputEditText
android:id="@+id/cancellation_note"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textMultiLine|textCapSentences"
android:maxLines="3" />
</com.google.android.material.textfield.TextInputLayout>

</com.google.android.material.textfield.TextInputLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/grid_1"
android:layout_marginBottom="@dimen/grid_10"
android:gravity="center"
android:text="@string/We_wont_share_this_with_the_creator" />

<TextView
android:layout_width="wrap_content"
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<Button
android:id="@+id/yes_cancel_pledge_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/grid_10"
android:layout_marginTop="@dimen/grid_1"
android:gravity="center"
android:text="@string/We_wont_share_this_with_the_creator" />
android:text="@string/Yes_cancel_my_pledge"
app:backgroundTint="@color/ksr_red_400" />

<FrameLayout
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<Button
android:id="@+id/yes_cancel_pledge_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/Yes_cancel_my_pledge"
android:stateListAnimator="@null"
app:backgroundTint="@color/ksr_red_400" />

<FrameLayout
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:stateListAnimator="@null"
app:backgroundTint="@color/ksr_red_400" />

<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminateTint="@color/white" />
</FrameLayout>

<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminateTint="@color/white" />
</FrameLayout>

<Button
android:id="@+id/no_cancel_pledge_button"
style="@style/TertiaryButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/grid_15"
android:text="@string/No_go_back" />
</FrameLayout>

</LinearLayout>
<Button
android:id="@+id/no_cancel_pledge_button"
style="@style/TertiaryButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/No_go_back" />

</ScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</LinearLayout>

<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="@+id/snackbar_anchor"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="@dimen/grid_5" />
</ScrollView>

</androidx.cardview.widget.CardView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Expand Up @@ -47,11 +47,8 @@ class CancelPledgeViewModelTest : KSRobolectricTestCase() {
fun testDismiss() {
setUpEnvironment(environment())

this.vm.inputs.closeButtonClicked()
this.dismiss.assertValueCount(1)

this.vm.inputs.goBackButtonClicked()
this.dismiss.assertValueCount(2)
this.dismiss.assertValueCount(1)
}

@Test
Expand Down