lodash#reduce JavaScript Examples

The following examples show how to use lodash#reduce. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: MessagesList.js    From CyberStateRP with MIT License 5 votes vote down vote up
MessagesList = props => {
    const { phone } = useContext(PhoneContext)
    const getMessages = () => {
        const { myNumber } = phone
        const msgs = phone.messages
        const senders = reduce(msgs, (result, value, key) => {
            if (!result[value.sender_num] && value.sender_num !== myNumber) {
                result[value.sender_num] = [value]
            } else if (value.sender_num !== myNumber) {
                result[value.sender_num].push(value)
            }
            if (!result[value.creator_num] && value.creator_num !== myNumber) {
                result[value.creator_num] = [value]
            } else if (value.creator_num !== myNumber) {
                result[value.creator_num].push(value)
            }
            return result
        }, {})
        const messagesToRender = []
        forEach(senders, (v, k) => {
            //console.log(`${JSON.stringify(v)} ${k}`)
            messagesToRender.push(
                <Message
                    key={k}
                    contactNumber={k}
                    messages={v}
                />
            )
        })
        return messagesToRender
    }
    return (
        <div className="app messages">
            <div className="container">
                <div className="control-bar">
                    <div className="control inactive" />
                    <div className="control new">
                        <div className="icon">
                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23">
                                <path d="M21.735.369l.896.888a1.317 1.283 0 0 1 0 1.783l-.716.713-2.688-2.671.717-.713a1.248 1.216 0 0 1 1.791 0zm-10.736 14.236v.011l-3.021.447a.101.099 0 0 1-.115-.085.154.15 0 0 1 0-.03l.455-3.009h.01l-.01-.011 10.384-10.33.896.888-9.959 9.913a3.323 3.238 0 0 0 .382.517 2.909 2.835 0 0 0 .507.365v.008l9.966-9.91.895.888-10.384 10.336zm4.197-10.759l-1.013 1.009h-13.17v17.138l17.222-.016v-13.09l1.013-1.008v15.121l-19.248-.016v-19.139z" />
                            </svg>
                        </div>
                    </div>
                </div>
                <div className="title-bar">
                    <div className="title">Messages</div>
                </div>
                <div className="workspace">
                    {getMessages()}
                </div>
            </div>
        </div>
    )
}
Example #2
Source File: MessagesList.js    From CyberState with GNU General Public License v3.0 5 votes vote down vote up
MessagesList = props => {
    const { phone } = useContext(PhoneContext)
    const getMessages = () => {
        const { myNumber } = phone
        const msgs = phone.messages
        const senders = reduce(msgs, (result, value, key) => {
            if (!result[value.sender_num] && value.sender_num !== myNumber) {
                result[value.sender_num] = [value]
            } else if (value.sender_num !== myNumber) {
                result[value.sender_num].push(value)
            }
            if (!result[value.creator_num] && value.creator_num !== myNumber) {
                result[value.creator_num] = [value]
            } else if (value.creator_num !== myNumber) {
                result[value.creator_num].push(value)
            }
            return result
        }, {})
        const messagesToRender = []
        forEach(senders, (v, k) => {
            //console.log(`${JSON.stringify(v)} ${k}`)
            messagesToRender.push(
                <Message
                    key={k}
                    contactNumber={k}
                    messages={v}
                />
            )
        })
        return messagesToRender
    }
    return (
        <div className="app messages">
            <div className="container">
                <div className="control-bar">
                    <div className="control inactive" />
                    <div className="control new">
                        <div className="icon">
                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23">
                                <path d="M21.735.369l.896.888a1.317 1.283 0 0 1 0 1.783l-.716.713-2.688-2.671.717-.713a1.248 1.216 0 0 1 1.791 0zm-10.736 14.236v.011l-3.021.447a.101.099 0 0 1-.115-.085.154.15 0 0 1 0-.03l.455-3.009h.01l-.01-.011 10.384-10.33.896.888-9.959 9.913a3.323 3.238 0 0 0 .382.517 2.909 2.835 0 0 0 .507.365v.008l9.966-9.91.895.888-10.384 10.336zm4.197-10.759l-1.013 1.009h-13.17v17.138l17.222-.016v-13.09l1.013-1.008v15.121l-19.248-.016v-19.139z" />
                            </svg>
                        </div>
                    </div>
                </div>
                <div className="title-bar">
                    <div className="title">Сообщения</div>
                </div>
                <div className="workspace">
                    {getMessages()}
                </div>
            </div>
        </div>
    )
}
Example #3
Source File: index.js    From gobench with Apache License 2.0 5 votes vote down vote up
Breadcrumbs = props => {
  const [breadcrumbs, setBreadcrumbs] = useState([])
  const {
    location: { pathname },
    menuData = [],
  } = props
  useEffect(() => {
    setBreadcrumbs(() => getBreadcrumbs())
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [pathname, menuData])

  const getPath = (data, url, parents = []) => {
    const items = reduce(
      data,
      (result, entry) => {
        if (result.length) {
          return result
        }
        if (entry.url === url) {
          return [entry].concat(parents)
        }
        if (entry.children) {
          const nested = getPath(entry.children, url, [entry].concat(parents))
          return (result || []).concat(nested.filter(e => !!e))
        }
        return result
      },
      [],
    )
    return items.length > 0 ? items : [false]
  }

  const getBreadcrumbs = () => {
    const [activeMenuItem, ...path] = getPath(menuData, pathname)

    if (!activeMenuItem) {
      return null
    }
    if (activeMenuItem && path.length) {
      return path.reverse().map((item, index) => {
        if (index === path.length - 1) {
          return (
            <span key={item.key}>
              <span className={styles.arrow} />
              <span>{item.title}</span>
              <span className={styles.arrow} />
              <strong className={styles.current}>{activeMenuItem.title}</strong>
            </span>
          )
        }
        return (
          <span key={item.key}>
            <span className={styles.arrow} />
            <span>{item.title}</span>
          </span>
        )
      })
    }
    return (
      <span>
        <span className={styles.arrow} />
        <strong className={styles.current}>{activeMenuItem.title}</strong>
      </span>
    )
  }

  return (
    breadcrumbs &&
    (breadcrumbs.length ? (
      <div className={styles.breadcrumbs}>
        <div className={styles.path}>
          <Link to="/dashboard/alpha">Home</Link>
          {breadcrumbs}
        </div>
      </div>
    ) : null)
  )
}