Status-react: Search bar animation behavior

[hesterbruikman]

Problem

The Status Home tab (soon to be Chat) has a searchbar implemented. This searchbar allows to find chats in the chat list and will in the near future also enable finding messages.

The searchbar was originally intended to behave like: https://www.dropbox.com/s/xyf77rl9jvesh1y/ScreenFlow%20copy%203.mp4?dl=0

For the most part this behavior has been implemented. There are a few issues that remain:

• Search bar does not appear second (or more) times after pull Home screen down gesture been done while Search bar is present on screen: https://github.com/status-im/status-react/issues/7676
• It's cumbersome to hide the searchbar during inactivity, after it's been pulled down in view: https://github.com/status-im/status-react/issues/7643
• More detailes on expected behavior https://github.com/status-im/status-react/issues/7643#issuecomment-468648407

To fix these issues the implementation needs to be adapted and potentially the searchbar needs to be reimplemented in full.

Implementation

[@yenda please edit]

Acceptance Criteria

Implementation solves issues above and behaves like example video when it comes to appear/disappear behavior.

Notes

Future Steps

[andmironov]

Hey, is it possible to put the search bar at the top of the recent chats list and "scroll out" the list "scrollTop: -50px" ( 50px is the search bar's height) to keep things simple? So if the user pulls the list down, the search bar will just appear at the top.

[andmironov]

Here's a very basic demo of what i described above @yenda https://www.dropbox.com/s/vycr23fzuiwc72r/search.mov?dl=0

[hesterbruikman]

@andmironov I think I see what you mean, so no fancy pull effect, but just another 'listitem' that becomes visible on scroll.

Works for me, although I would be eager to see if we can find someone through a bounty who has a lot of experience with nuanced gesture behaviors in React Native; As it might benefit us elsewhere. How do you feel about trying that route and resorting to the -50px solution if we can't find someone to get it to work according to the original design?

[errorists]

@hesterbruikman @andmironov that was our intention from the very beginning. The somewhat convoluted animation behaviour is where we arrived by trying to reverse engineer this in React Native. The desired behaviour can be observed in this crude prototype https://framer.cloud/bwcXm/

basically, it puts search at a negative -1 position in the list. I recall Eric wanting to bounty it out so someone else can take a stab at implementing it this way.

[hesterbruikman]

@StatusSceptre how we move this to Gitcoin?:)

Also, would appreciate a ping here if/once setup. Would like to share the bounty more widely as the issue has turned out to be pretty advanced React stuff.

[StatusSceptre]

Pinging you on Status to discuss bounty details.

[StatusSceptre]

@hesterbruikman any movement on the criteria here? I'm more than happy to discuss.

[StatusSceptre]

@hesterbruikman @andmironov @errorists are we still working on this criteria or is it still wanting to be put up for bounties?

[errorists]

@StatusSceptre the criteria are visible here -> https://framer.cloud/bwcXm/

to rephrase: we want to put the search bar in the -1 position of the chat list, meaning it's a bit like a basement. you can drag it from under there and tuck it away again. I think we're ready to bounty it up

[StatusSceptre]

For a bounty this large, there is additional criteria in order for it to be approved, namely a comment with the following:

• Proposed bounty amount
• Estimated time to completion
• Estimated required experience level
• Why we’re outsourcing it

When that happens, I need two more CCs to thumbs up it, and finance to give it a rocket. it will then be funded.

[hesterbruikman]

@StatusSceptre @flexsurfer provided an estimate. It's smaller than the original. Will replace the label.

• Proposed bounty amount
  _S_
• Estimated time to completion
  _?_
• Estimated required experience level
  _Experience with React Native animations_
• Why we’re outsourcing it
  _More pressing priorities. And leveraging the opportunity to connect with contributors who have experience developing animations on React Native._

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

__This issue now has a funding of 80.0 DAI (80.0 USD @ $1.0/DAI) attached to it.__

• If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
  
  
  
  • Want to chip in? Add your own contribution here.
  
  
  • Questions? Checkout Gitcoin Help or the Gitcoin Slack
  
  
  • $85,284.39 more funded OSS Work available on the Gitcoin Issue Explorer
  
  

[frankchen07]

hi @skeptycal - frank from gitcoin here - any movement or WIP PRs you'd like to put in for this issue?

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[skeptycal]

Sorry, I was out of town on a family emergency. I'm looking into this tonight. =)

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

@skeptycal Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

@skeptycal due to inactivity, we have escalated this issue to Gitcoin's moderation team. Let us know if you believe this has been done in error!

• [x] reminder (3 days)
• [x] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

@skeptycal due to inactivity, we have escalated this issue to Gitcoin's moderation team. Let us know if you believe this has been done in error!

• [x] reminder (3 days)
• [x] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Cancelled

---

__Workers have applied to start work__.

These users each claimed they can complete the work by 2 weeks, 5 days ago.
Please review their action plans below:

1) mikegsus has applied to start work _(Funders only: approve worker | reject worker)_.

Take a look over the source code, recognize the components to work and apply the changes to get the behavior expected.

Learn more on the Gitcoin Issue Details page.

[rachelhamlin]

Apologies for the long delay here @mikegsus and @keheira - I'm cleaning up bounties. Would one of you still want to take this one?

[Keheira]

@rachelhamlin I'll take it if it's still open

[rachelhamlin]

@keheira awesome. It is, so I just approved you for work. Let us know if you need any help getting set up.

[gitcoinbot]

@keheira Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[Keheira]

@gitcoinbot I'm having issues understanding how to run the app locally. I was reading the documentation but I'm still unsure

[rachelhamlin]

Hi @Keheira anything in particular we can help with?

[gitcoinbot]

@keheira Hello from Gitcoin Core - are you still working on this issue? Please submit a WIP PR or comment back within the next 3 days or you will be removed from this ticket and it will be returned to an ‘Open’ status. Please let us know if you have questions!

• [x] reminder (3 days)
• [ ] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

@keheira due to inactivity, we have escalated this issue to Gitcoin's moderation team. Let us know if you believe this has been done in error!

• [x] reminder (3 days)
• [x] escalation to mods (6 days)

Funders only: Snooze warnings for 1 day | 3 days | 5 days | 10 days | 100 days

[Keheira]

@rachelhamlin I’m sorry I can no longer complete this task.

[rachelhamlin]

Thanks for the update @Keheira. If you haven't already, can you please unassign yourself on Gitcoin?

[vkjr]

@rachelhamlin, I'll take this one. Could you please unlist it from gitcoin? thanks!

[vkjr]

@errorists, currently in Status when searchbar is focused and empty, we show that search result is empty. In other messengers when searchbar is empty, all conversations listed in search result and that list reduces while you type in the name you are looking for.
What do you think about using the same approach? It seems a bit more logical for me.

[errorists]

@vkjr sure sgtm, go for it!

[gitcoinbot]

Issue Status: 1. Open 2. Cancelled

---

__The funding of 80.0 DAI (80.0 USD @ $1.0/DAI) attached to this issue has been cancelled by the bounty submitter__

• Questions? Checkout Gitcoin Help or the Gitcoin Slack
• $135,130.15 more funded OSS Work available on the Gitcoin Issue Explorer