To reproduce

• Create a skill with no hashtags and hit save then cancel (not sure this is why)

Acceptance criteria

• There's a little edit pencil icon in top right of profile view ( we can lose the logout from there)

In edit mode:

• It's possible to edit your preferred name (single long field)
• It's possible to edit a short bio "tell us a little about yourself"
• it's possible to pick an image from gallery and have it become their profile page (separate user story)
• There's a list of contact methods already attached to that user (email address being one) and the ability to click into an 'edit contact methods' user story (separate user story)
• There's a save changes or cancel button which take you back to profile in presentation mode

Notes

• We may add a edit username user story later
• Sign up process is a whole different epic that we haven't got to yet
• Always show the username which is assumed to always exist and must be unique
• _ID is already the unique identifier for the user record this is good (something like 1adf3b84-5739-41ce-b171-16fe2246d3f6)
• We'll need to change (for testing) the temporary sign up page to allow username to be entered there

Can we rename hashtagmeta to jsut hashtag per the following, pretty please

type HashtagVariant {
    id: ID!
    variant: String! @id @search(by: [exact, regexp])
    hashtag: Hashtag! @hasInverse(field: "hashtagVariants")
    skills: [Skill] @hasInverse(field: "hashtagVariants")
    requests: [Request] @hasInverse(field: "hashtagVariants")
}

type Hashtag {
    id: ID!
    name: String! @id @search(by: [exact, regexp])
    iconName: String
    blessed: Boolean @search
    blessedInt: Int
    hashtagVariants: [HashtagVariant] @hasInverse(field: "hashtag")
    skillCountAllTime: Int
    requestCountAllTime: Int
    skillCountLast24h: Int
    requestCountLast24h: Int
    skillCountLast1w: Int
    requestCountLast1w: Int
}

``

** Acceptance criteria **

• When on a profile page different from my own there is a send gratitude button
• I can click button and be taken to the 'create gratitude' screen with the user already selected (from=me, to=them)

Kane can't do this until we get done with setting up the wireframes

For now anyone can see this - since we don't have authentication

I'm guessing this is related to my brilliant idea to delete the AWS Amplify instance that said, I reset the amplify config and still getting issues.

Relevant context

• I removed the dart config
  rm lib/amplifyconfiguration.dart
• Then re-created it with the new instance
  amplify pull --appId d4i3jwl1gm9oi --envName dev
• This recreated the amplifyconfiguration.dart config

To reproduce

• Login as user with email address [email protected]
• Navigate to profile page in emulator
• Click to edit
• Click on image
• Choose camera.. take a photo of the fake room.. crop it
• See a message saying 'upload success' and see this screen

Actual behavior

• See a broken image or exclamation mark on the profile page

Expected behavior

• Expect to be able to update image even if I screwed it all up in the past ?

Acceptance Criteria

• If I have no skills and click on 'skills' from the left nav I see this content
• If I have no skills and view my own profile page I scroll into the skill section i see the same content
• The "my skills" link is actually just a shortcut to the "skills" part of the profile section
• There's a list of all blessed (pinned) hashtags chosen by the admin, sorted alphabetically
• User can click on any of the hastags to go into the 'add skill' dialog
• User can also click on 'something else' to go into the 'add skill' dialog

** Out of scope for now **

• If a hashtag is popular amongst requests then it has a star (since we dont have requests)

Mockup

Something like this

Current front runners:

• GraphQL + MongoDB
• GraphQL + Firestore

Other ideas

• GraphQL + Neo4j + MongoDB
• GraphQL + ArrangoDB

Acceptance criteria

• User can enter title, desciption and hit save and these things are saved
• If the user types a 'hashtag' (#) in the text area it adds to the 'hashtags section'
• If the user clicks '+ add tag' it creates a way where they can add a hashtag
• If the user clicks on a hashtag it deletes the hashtag (not exactly sure the best way to handle this vis-a-vis text)
• When the user saves a skill it checks that all hashtags already exist in the hashtag table and if not there adds them
• User can hit cancel and go back to my skills section (equivalent of swiping back)
• No navigation visible at bottom in this page

Discussion

When the user deletes from the list of hashtags should it remove from the text?

Mockup

This is the epic of setting up the environment for development.

In scope

• choosing an appropriate flutter 'starter'
• getting into github
• setting up an open-access development-only firebase/firestore instance
• ability to build for the developer.

Out of scope

• This does not include the full back end - it's just for visual prototype phase. Before we put this into people's hands - even for user testing - the plan is to connect up to graphql / cashless-ui/server back end.
• Any authentication / logging permissions

Acceptance criteria

• I can see a list of hashtags on this page
• It is possible to click into a hashtag to edit its properties
• You can see the icon (if any has been assigned) otherwise it shows the default icon but grayed out
• The admin can click something to add a hashtag
• If a hashtag is not being used they can delete that hashtag

Mockups

No mockup is available! Yeesh. Just make something up pretty please.

This is phrased as "as a developer" because this is a technology proof of concept - we want to be able to show that we can add or update an acknowledgement and have it affect the layout of the graph

I'm going to put all the details into the A/C here but really its more of an epic than a simple user story.. we should create a separate branch for this.

Acceptance criteria - graph layout

• When I go to the people tab I can click a button to see the graph view
• In the graph view I see all the people in the current db (for now just show all)
• Each person appears with a circle and their bio pic in the photo
• If there is an acknowledgement between two people there is a line added between those two people
• The graph of people and edges has a workable auto-layout - such as in the vis.js sample already used

Acceptance criteria - scaling test

• As an admin its possible to press a button in the admin portal to add some fake users (10 at a time)
• As an admin its possible to press a button in the admin portal to add fake acknowledgements between any existing users (n at a time)
• As an admin it's possible to remove all fake users and fake acknowledgements (or failing that you can just drop table)
• The script adds about 30 users and 50 edges or so
• The graph layout works OK at that scale

Commentary: As an interesting excerize it would be interesting to see what happens when we have hundreds of users and when it starts to 'not work' any more.

Profile pages - are the core of the application - they represent the people.

People have some basic bio info (photo, full name, @handle)

They have contact methods (primarily so you can message them) which take the form of accounts - such as email (required), twitter, 'raklet' account handles, which they can add for contact reasons (but not, for now, for authentication purpose)

They have a set of skills

They have a set of requests

They have a set of incoming and outgoing acknowledgements (or 'gratitudes')

The last three are not really in-scope for this epic, per se, other than just displaying them on a profile page.

The profile page also has some clever scrolling that we need to implement

After issue #49 we can add some things to the schema

Suggestion:

type User {
    id: ID!
    email: String! @id
    name: String!
    age: Int
  	isAdmin: Boolean
  	createdTimestamp: DateTime
    requests: [Request] @hasInverse(field: "owner")
  	skills: [Skill] @hasInverse(field: "owner")
	  gratitudeSent: [Gratitude] @hasInverse(field: "from")
	  gratitudeReceived: [Gratitude] @hasInverse(field: "to")
}

type Request {
    id: ID!
    owner: User! @hasInverse(field: "requests")
    title: String! @search
    message: String! @search
  	status: RequestStatus!
  	hashtagVariants: [HashtagVariant]! @hasInverse(field: "requests")
  	createdTimestamp: DateTime
}

enum RequestStatus {
  	OPEN,
	  TENTATIVE,
	  FILLED,
	  DONE
}

type Skill {
  	id: ID!
  	owner: User! @hasInverse(field: "skills")
    title: String
    message: String
    hashtagVariants: [HashtagVariant]! @hasInverse(field: "skills")
    isAvailable: Boolean
  	createdTimestamp: DateTime
}

type Gratitude {
  	id: ID!
  	from: User! @hasInverse(field: "gratitudeSent")
  	to: User! @hasInverse(field: "gratitudeReceived")
        message: String
        hashtagVariants: [HashtagVariant]! @hasInverse(field: "skills")
  	createdTimestamp: DateTime
}
``

We are tied to flutter but this could be an interesting starting position for the lie of the land

https://neo4j.com/developer/tools-graph-visualization/

This is a research issue - decide what package to use

Acceptance Criteria

• On the edit bio screen there is an explicit text field for '
  pronouns'
• Pronouns appear on the 'full' bio page - per mockup
• Pronouns also appear on the 'narrow' bio view - also per mockup
• If you leave the pronouns field blank the bio section of the page still renders in a way that looks good (no extra hanging 'dot')

Whether its better to have the pronouns appear in the 'narrow' bio view or not is somewhat under discussion - but for now assuming it's 'in'.

Acceptance Criteria

• User can click on their 'image' when in profile edit mode and pops up a chooser
• Chooser lets them select an image from their gallery
• If the image is above a specified size (1MB?) it tells them its too big
• If the image is not square shows a crop image dialog thing that lets them adjust how to crop
• Once the image is displayed it always displays as a circle
• Image is stored somewhere ?? so that next time someone loads this profile page it is possible to see the image

This bug will presumably go away when we re-do the layout to @courtbee's new designs, so i guess you can probably ignore but fwiw:

To reproduce

• Boot the app in Pixel5 emulator.
• Navigate to the profile page

Actual result

I see the following in the emulator

And a warning pointing to a problem in buildUserInfoSection

The plan is to develop this in two phases
Acceptance Criteria

• There is at least one table in the data store
• Some of the data is loaded from the data store onto the page

Out of scope

• Comprehensive state management (since we're going to rip a lot of this out, why bother)
• Proof that it is possible to 'write' data to firestore (we'll figure this out when we need to)

Acceptance criteria

• Admin can type in (or clear) the icon string
• When they type in a string that matches a font-awesome icon it shows as a preview
• They can hit save and return to the icon list page

Out of scope

• No need to be able to 'bless' a hashtag or not yet
• No need to show counts etc

I'm not sure what the tooling is for theming in Flutter - but I assume there is something. For instance Material UX + Flutter ?

We are desperately short of a good designer at this point in time.. so we'll just have to make do - but worth taking the time to get set up with some sort of library for doing this nicely

This seems relevant
https://docs.flutter.dev/cookbook/design/themes

also
https://github.com/material-components/material-components-flutter

Discuss with @utunga + the channel the choice of theme, refer back to this issue for discussion on this.

Acceptance criteria

• When looking at someone else's profile page it shows a list of their skills
• If a skill is marked as not available it has a 'not available' thing showing otherwise it doesnt say anything about that

Mockup

It looks something like this - within the context of the profile page generally

Acceptance criteria

• You can switch availability on and off
• You can also remove a skill - when you are not in edit mode on that skill
• You can click edit to get into the add/edit view
• You can click 'add skill' to add new skill
• Skills sort by alphabetical on the title for now
• Feel free to use a more mobile-centric 'add skill' button

Mockup

Looks something like this (adjusted to fit mobile)

Acceptance criteria

• There is a bottom nav
• There is a burger menu top left
• There is a side nav that pops into place when you hit burger menu
• The items listed in the wireframe appear listed in each place
• The items in the bottom nav have attractive icons (we'll need to discuss this, but the wireframe ones are just place holders)
• It is possible to click to get to content on two of navigation items

Probably Out of scope

• It is not necessary to build out all the pages at this point. I think it might be premature to do that, but am willing to take under advisement.

===