Skip to content

Commit e3b6a4c

Browse files
committed
complete most of port to TypeScript + Redux
1 parent 786c331 commit e3b6a4c

24 files changed

+370
-437
lines changed

src/ReactChat/ReactChat/ReactChat.csproj

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -161,9 +161,10 @@
161161
<TypeScriptCompile Include="typings\browser\ambient\es6-shim\es6-shim.d.ts" />
162162
<TypeScriptCompile Include="typings\browser\ambient\jquery\jquery.d.ts" />
163163
<TypeScriptCompile Include="typings\browser\ambient\react-dom\react-dom.d.ts" />
164+
<TypeScriptCompile Include="typings\browser\ambient\react-redux\react-redux.d.ts" />
164165
<TypeScriptCompile Include="typings\browser\ambient\react\react.d.ts" />
166+
<TypeScriptCompile Include="typings\browser\ambient\redux\redux.d.ts" />
165167
<TypeScriptCompile Include="typings\browser\ambient\ss-utils\ss-utils.d.ts" />
166-
<TypeScriptCompile Include="typings\main.d.ts" />
167168
</ItemGroup>
168169
<ItemGroup>
169170
<Content Include="Global.asax" />
@@ -177,7 +178,6 @@
177178
<DependentUpon>Global.asax</DependentUpon>
178179
</Compile>
179180
<Compile Include="Properties\AssemblyInfo.cs" />
180-
<Content Include="src\Actions.js" />
181181
</ItemGroup>
182182
<!--<ItemGroup>
183183
<Service Include="{4A0DDDB5-7A95-4FBF-97CC-616D07737A77}" />

src/ReactChat/ReactChat/default.html

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,6 @@
66
<link rel="stylesheet" href="css/app.css" />
77
<!-- endbuild -->
88
<title>ReactChat</title>
9-
10-
<script type="text/javascript">
11-
var channelStr = "home";
12-
var channels = channelStr.split(',');
13-
window.AppData = {
14-
channels: channels,
15-
selectedChannel: channels[channels.length - 1],
16-
isAuthenticated: false, //@IsAuthenticated.ToString().ToLower(),
17-
eventStreamUrl: `/event-stream?channels=${channelStr}&t=${new Date().getTime()}`,
18-
channelSubscribersUrl: `/event-subscribers?channels=${channelStr}`,
19-
chatHistoryUrl: `/chathistory?channels=${channelStr}`
20-
};
21-
</script>
229
</head>
2310
<body>
2411
<div class="container">

src/ReactChat/ReactChat/src/Actions.js

Lines changed: 0 additions & 135 deletions
This file was deleted.

src/ReactChat/ReactChat/src/ChatLog.js

Lines changed: 13 additions & 11 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/ReactChat/ReactChat/src/ChatLog.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/ReactChat/ReactChat/src/ChatLog.tsx

Lines changed: 18 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,40 @@
11
import * as React from 'react';
2-
import { User } from './User';
3-
import { reduxify } from './utils';
2+
import { User } from './User';
3+
import { reduxify } from './utils';
44

55
@reduxify(
66
(state) => ({
7-
messages: state.messages, users: state.users, activeSub: state.activeSub })
7+
messages: state.messages.filter(m => !m.channel || m.channel === state.selectedChannel), users: state.users, activeSub: state.activeSub })
88
)
99
export class ChatLog extends React.Component<any, any> {
10-
renderItem(o, i, msgs) {
11-
var user = this.props.users.filter(user => (user.userId === o.userId))[0];
12-
13-
var clsHighlight = o.msg.indexOf(this.props.activeSub.displayName.replace(" ", "")) >= 0
10+
renderItem(m, i, msgs) {
11+
const user = this.props.users.filter(user => (user.userId === m.userId))[0];
12+
const clsHighlight = m.msg.indexOf(this.props.activeSub.displayName.replace(" ", "")) >= 0
1413
? "highlight "
15-
: "";
16-
17-
var msgId = "m_" + (o.id || "0");
18-
var clsMsg = 'msg ' + clsHighlight + o.cls;
19-
20-
var lastMsg = i > 0 && msgs[i -1],
21-
repeatingUser = lastMsg.userId == o.userId;
14+
: "";
15+
const msgId = `m_${m.id || "0"}`;
16+
const clsMsg = `msg ${clsHighlight}${m.cls}`;
17+
const lastMsg = i > 0 && msgs[i -1];
18+
const repeatingUser = lastMsg.userId === m.userId;
2219

2320
return (
2421
<div key={msgId} id={msgId} className={clsMsg}>
25-
{o.userId && !repeatingUser
22+
{m.userId && !repeatingUser
2623
? <b className="user">
27-
<User user={ user || $.extend(o, { displayName: o.userName }) } />
24+
<User user={ user || $.extend(m, { displayName: m.userName }) } />
2825
</b>
2926
: <b>&nbsp;</b>}
30-
<i>{ $.ss.tfmt12(o.time || new Date()) }</i>
31-
<div>{o.msg}</div>
27+
<i>{ $.ss.tfmt12(m.time || new Date()) }</i>
28+
<div>{m.msg}</div>
3229
</div>
3330
);
3431
}
3532

36-
render () {
33+
render() {
34+
console.log(this.props.messages.map(m => m.id).sort());
3735
return (
3836
<div ref="log" id="log">
39-
{this.props.messages.map(this.renderItem)}
37+
{this.props.messages.map(this.renderItem.bind(this))}
4038
</div>
4139
);
4240
}

0 commit comments

Comments
 (0)