allow console.log

.eslintrc

@@ -35,7 +35,7 @@
     "linebreak-style": ["warn", "unix"],
     "no-alert": "error",
     "no-case-declarations": "error",
-    "no-console": "error",
+    //"no-console": "error",
     "no-constant-condition": "error",
     "no-continue": "warn",
     "no-div-regex": "error",

src/pages/account/feeds/AccountFeeds.tsx

@@ -10,7 +10,8 @@ import ExpandableListItem from '../../../components/ExpandableListItem'
 import ExpandableListItemActions from '../../../components/ExpandableListItemActions'
 import ExpandableListItemKey from '../../../components/ExpandableListItemKey'
 import { SwarmButton } from '../../../components/SwarmButton'
-import { Context as IdentityContext, Identity } from '../../../providers/Feeds'
+import { SwarmTextInput } from '../../../components/SwarmTextInput'
+import { Post, Context as IdentityContext, Identity } from '../../../providers/Feeds'
 import { ROUTES } from '../../../routes'
 import { formatEnum } from '../../../utils'
 import { persistIdentitiesWithoutUpdate } from '../../../utils/identity'
@@ -21,9 +22,13 @@ import { AccountNavigation } from '../AccountNavigation'
 import { Header } from '../Header'
 import TroubleshootConnectionCard from '../../../components/TroubleshootConnectionCard'
 import { CheckState, Context as BeeContext } from '../../../providers/Bee'
+import { dropDownOption } from '../../../providers/Feeds'
+import { Context as SettingsContext } from '../../../providers/Settings'
+import { readFeed } from '../../../utils/identity'
 
 export function AccountFeeds(): ReactElement {
-  const { identities, setIdentities } = useContext(IdentityContext)
+  const { identities, setIdentities, setDDOptions, isLoadingPosts, setisLoadingPosts, Posts, setPostsList } =
+    useContext(IdentityContext)
   const { status } = useContext(BeeContext)
 
   const navigate = useNavigate()
@@ -32,15 +37,50 @@ export function AccountFeeds(): ReactElement {
   const [showImport, setShowImport] = useState(false)
   const [showExport, setShowExport] = useState(false)
   const [showDelete, setShowDelete] = useState(false)
+  const { beeApi, beeDebugApi } = useContext(SettingsContext)
+  const [pwd, setPasswd] = useState('')
 
   function createNewFeed() {
+    const oa: dropDownOption[] = [{ label: 'Create a new', value: 'New' }]
+    const oa1 = new Set()
+
+    identities.map((x, i) => {
+      if (!oa1.has(x.name)) {
+        oa1.add(x.name)
+        oa.push({ label: x.name, value: x.name })
+      }
+
+      return oa1
+    })
+
+    setDDOptions(oa)
+
     return navigate(ROUTES.ACCOUNT_FEEDS_NEW)
   }
 
   function viewFeed(uuid: string) {
+    const identity = identities.find(x => x.uuid === uuid)
+
+    if (identity?.topic !== '' && beeApi) {
+      try {
+        console.log('ID', identity)
+        readFeed(beeApi, beeDebugApi, identity as Identity, pwd).then(Posts => {
+          console.log('Success', Posts)
+          setPostsList(Posts)
+          setisLoadingPosts(false)
+        })
+      } catch {
+        console.log('Failure')
+        setPostsList([])
+      }
+    }
     navigate(ROUTES.ACCOUNT_FEEDS_VIEW.replace(':uuid', uuid))
   }
 
+  const onChangePassword = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setPasswd(event.target.value)
+  }
+
   function onDialogClose() {
     setShowDelete(false)
     setShowExport(false)
@@ -98,7 +138,23 @@ export function AccountFeeds(): ReactElement {
               <ExpandableListItem label="Identity type" value={formatEnum(x.type)} />
             </ExpandableList>
           </Box>
-          <ExpandableListItemKey label="Topic" value={'00'.repeat(32)} />
+          <Box>
+            {x.type === 'V3' && (
+              <SwarmTextInput
+                name="password"
+                label="Password"
+                password
+                onChange={e => {
+                  setPasswd(e.target.value)
+                }}
+              />
+            )}
+          </Box>
+          {x.topic === '00' ? (
+            <ExpandableListItemKey label="Website Topic" value={'00'.repeat(32)} />
+          ) : (
+            <SwarmTextInput name="Topic" label={x.topic} />
+          )}
           {x.feedHash && <ExpandableListItemKey label="Feed hash" value={x.feedHash} />}
           <Box mt={0.75}>
             <ExpandableListItemActions>

src/pages/feeds/CreateNewFeed.tsx

@@ -1,4 +1,4 @@
-import { Box, Grid, Typography } from '@material-ui/core'
+import { Box, Grid, Typography, Checkbox } from '@material-ui/core'
 import { Form, Formik } from 'formik'
 import { useSnackbar } from 'notistack'
 import { ReactElement, useContext, useState } from 'react'
@@ -12,30 +12,47 @@ import { HistoryHeader } from '../../components/HistoryHeader'
 import { SwarmButton } from '../../components/SwarmButton'
 import { SwarmSelect } from '../../components/SwarmSelect'
 import { SwarmTextInput } from '../../components/SwarmTextInput'
-import { Context as FeedsContext, IdentityType } from '../../providers/Feeds'
+import { Context as FeedsContext, Identity, IdentityType } from '../../providers/Feeds'
 import { Context as SettingsContext } from '../../providers/Settings'
 import { ROUTES } from '../../routes'
-import { convertWalletToIdentity, generateWallet, persistIdentity } from '../../utils/identity'
+import { convertWalletToIdentity, generateWallet, persistIdentity, getWalletFromIdentity } from '../../utils/identity'
+import { Wallet } from 'ethers'
+import * as React from 'react'
+import FormControlLabel from '@material-ui/core/FormControlLabel'
 
 interface FormValues {
   identityName?: string
   type?: IdentityType
+  website: boolean
+  topic: string
   password?: string
 }
 
 const initialValues: FormValues = {
   identityName: '',
-  type: 'PRIVATE_KEY',
+  type: 'V3',
   password: '',
+  website: false,
+  topic: '00',
 }
 
 export default function CreateNewFeed(): ReactElement {
   const { beeApi, beeDebugApi } = useContext(SettingsContext)
-  const { identities, setIdentities } = useContext(FeedsContext)
+  const { identities, setIdentities, optionsArray } = useContext(FeedsContext)
   const [loading, setLoading] = useState(false)
+  const [website, setFeedType] = useState(true)
   const { enqueueSnackbar } = useSnackbar()
-
   const navigate = useNavigate()
+  const [checked, setChecked] = React.useState(true)
+  const [checkedpk, setCheckedk] = React.useState(true)
+
+  const handleChangeNewId = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setChecked(event.target.checked)
+  }
+
+  const handleChangeV3oPk = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setCheckedk(event.target.checked)
+  }
 
   async function onSubmit(values: FormValues) {
     setLoading(true)
@@ -46,7 +63,17 @@ export default function CreateNewFeed(): ReactElement {
 
       return
     }
-    const wallet = generateWallet()
+    let wallet: Wallet
+
+    if (values.identityName === 'New') {
+      wallet = generateWallet()
+    } else {
+      const identity = identities.find(x => x.name === values.identityName)
+      {
+        identity ? (wallet = await getWalletFromIdentity(identity, values.password)) : (wallet = generateWallet())
+      }
+    }
+
     const stamps = await beeDebugApi?.getAllPostageBatch()
 
     if (!stamps || !stamps.length) {
@@ -63,17 +90,28 @@ export default function CreateNewFeed(): ReactElement {
       return
     }
 
-    const identity = await convertWalletToIdentity(wallet, values.type, values.identityName, values.password)
+    const identity = await convertWalletToIdentity(
+      wallet,
+      values.type,
+      values.identityName,
+      values.topic,
+      values.password,
+    )
     persistIdentity(identities, identity)
     setIdentities(identities)
     navigate(ROUTES.ACCOUNT_FEEDS)
     setLoading(false)
+    enqueueSnackbar(<span>Done saving new ID</span>, { variant: 'error' })
   }
 
   function cancel() {
     navigate(-1)
   }
 
+  function setTopic() {
+    setFeedType(false)
+  }
+
   return (
     <div>
       <HistoryHeader>Create new feed</HistoryHeader>
@@ -94,36 +132,65 @@ export default function CreateNewFeed(): ReactElement {
         {({ submitForm, values }) => (
           <Form>
             <Box mb={0.25}>
-              <SwarmTextInput name="identityName" label="Identity name" formik />
-            </Box>
-            <Box mb={0.25}>
-              <SwarmSelect
-                formik
-                name="type"
-                options={[
-                  { label: 'Keypair Only', value: 'PRIVATE_KEY' },
-                  { label: 'Password Protected', value: 'V3' },
-                ]}
-              />
+              {checked ? (
+                <SwarmTextInput name="identityName" label="Identity name" formik />
+              ) : (
+                <SwarmSelect formik name="identityName" label="Identity name" options={optionsArray} />
+              )}
             </Box>
+            <SwarmSelect
+              formik
+              name="Type"
+              options={[
+                { label: 'V3', value: 'V3' },
+                { label: 'PRIVATE_KEY', value: 'PRIVATE_KEY' },
+              ]}
+            />
             {values.type === 'V3' && <SwarmTextInput name="password" label="Password" password formik />}
             <Box mt={2}>
-              <ExpandableListItemKey label="Topic" value={'00'.repeat(32)} />
+              {website ? (
+                <ExpandableListItemKey label="topic" value={'00'.repeat(32)} />
+              ) : (
+                <SwarmTextInput name="topic" label="Specify Feed Topic" formik />
+              )}
             </Box>
             <Box mt={2} sx={{ bgcolor: '#fcf2e8' }} p={2}>
               <Grid container justifyContent="space-between">
                 <Typography>Feeds name</Typography>
-                <Typography>{values.identityName} Website</Typography>
+                <Typography>{values.identityName}</Typography>
               </Grid>
             </Box>
             <Box mt={1.25}>
               <ExpandableListItemActions>
                 <SwarmButton onClick={submitForm} iconType={Check} disabled={loading} loading={loading}>
                   Create Feed
                 </SwarmButton>
+                <SwarmButton onClick={setTopic} iconType={Check} disabled={loading} loading={loading}>
+                  Feed
+                </SwarmButton>
                 <SwarmButton onClick={cancel} iconType={X} disabled={loading} cancel>
                   Cancel
                 </SwarmButton>
+                <FormControlLabel
+                  label="Create a new ID"
+                  control={
+                    <Checkbox
+                      checked={checked}
+                      onChange={handleChangeNewId}
+                      inputProps={{ 'aria-label': 'controlled' }}
+                    />
+                  }
+                />
+                <FormControlLabel
+                  label="V3 or Privatk"
+                  control={
+                    <Checkbox
+                      checked={checked}
+                      onChange={handleChangeV3oPk}
+                      inputProps={{ 'aria-label': 'controlled' }}
+                    />
+                  }
+                />
               </ExpandableListItemActions>
             </Box>
           </Form>